@devtable/dashboard 0.0.1

package/dist/index.d.ts

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

package/dist/layout/index.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+import { IDashboardItem } from "../types/dashboard";
+interface IDashboardLayout {
+    dashboard: IDashboardItem[];
+    className?: string;
+    cols?: {
+        lg: number;
+        md: number;
+        sm: number;
+        xs: number;
+        xxs: number;
+    };
+    rowHeight?: number;
+}
+export declare function DashboardLayout({ dashboard, className, cols, rowHeight, }: IDashboardLayout): JSX.Element;
+export {};

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

@@ -0,0 +1,8 @@
+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 {};

package/dist/panel/index.d.ts

@@ -0,0 +1,12 @@
+/// <reference types="react" />
+import { IVizConfig } from '../types/dashboard';
+interface IPanel {
+    layout: any;
+    destroy: () => void;
+    sql: string;
+    viz: IVizConfig;
+    title: string;
+    description: string;
+}
+export declare function Panel({ viz: initialViz, sql: initialSQL, title: initialTitle, description: initialDesc }: IPanel): JSX.Element;
+export {};

package/dist/panel/settings/common/mantine-color.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+interface IMantineColorSelector {
+    value: string;
+    onChange: (value: string) => void;
+}
+export declare function MantineColorSelector({ value, onChange }: IMantineColorSelector): JSX.Element;
+export {};

package/dist/panel/settings/common/mantine-size.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+interface IMantineSizeSlider {
+    label: string;
+    value: string;
+    onChange: (value: string) => void;
+}
+export declare function MantineSizeSlider({ label, value, onChange }: IMantineSizeSlider): JSX.Element;
+export {};

package/dist/panel/settings/common/mantine-weight.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+interface IMantineFontSizeSlider {
+    label: string;
+    value: string;
+    onChange: (value: string) => void;
+}
+export declare function MantineFontSizeSlider({ label, value, onChange }: IMantineFontSizeSlider): JSX.Element;
+export {};

package/dist/panel/settings/context-info/index.d.ts

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

package/dist/panel/settings/index.d.ts

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

package/dist/panel/settings/query-editor/index.d.ts

@@ -0,0 +1,2 @@
+import { SQLQueryEditor } from './sql-query-editor';
+export declare const QueryEditor: typeof SQLQueryEditor;

package/dist/panel/settings/query-editor/sql-query-editor/index.d.ts

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

package/dist/panel/settings/query-result/index.d.ts

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

package/dist/panel/settings/viz-config/description.d.ts

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

package/dist/panel/settings/viz-config/index.d.ts

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

package/dist/panel/settings/viz-config/title.d.ts

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

package/dist/panel/settings/viz-config/viz-conf.d.ts

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

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

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

package/dist/panel/viz/bar-3d/index.d.ts

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

package/dist/panel/viz/bar-3d/panel.d.ts

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

package/dist/panel/viz/bar-3d/type.d.ts

@@ -0,0 +1,4 @@
+export interface IVizBar3DPanel {
+    conf: any;
+    setConf: (values: any) => void;
+}

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+import { IVizConfig } from "../../types/dashboard";
+interface IViz {
+    viz: IVizConfig;
+    data: any;
+    loading: boolean;
+}
+export declare function Viz({ viz, data, loading }: IViz): JSX.Element;
+export {};

package/dist/panel/viz/line-bar/index.d.ts

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+interface ILineBarChart {
+    conf: any;
+    data: any[];
+    width: number;
+    height: number;
+}
+export declare function VizLineBarChart({ conf, data, width, height }: ILineBarChart): JSX.Element | null;
+export {};

package/dist/panel/viz/line-bar/panel.d.ts

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

package/dist/panel/viz/line-bar/type.d.ts

@@ -0,0 +1,16 @@
+export interface ILineBarChartSeriesItem {
+    type: 'line' | 'bar';
+    name: string;
+    showSymbol: false;
+    y_axis_data_key: string;
+    stack: string;
+    color?: string;
+}
+export interface ILineBarChartConf {
+    x_axis_data_key: string;
+    series: ILineBarChartSeriesItem[];
+}
+export interface IVizLineBarChartPanel {
+    conf: ILineBarChartConf;
+    setConf: (values: ILineBarChartConf) => void;
+}

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

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

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

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

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

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { ITableConf } from "./type";
+interface IVizTable {
+    conf: ITableConf;
+    data: any;
+    width: number;
+    height: number;
+}
+export declare function VizTable({ conf, data, width, height }: IVizTable): JSX.Element;
+export {};

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

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

package/dist/panel/viz/table/type.d.ts

@@ -0,0 +1,21 @@
+export declare enum ValueType {
+    string = "string",
+    number = "number",
+    eloc = "eloc",
+    percentage = "percentage"
+}
+export interface IColumnConf {
+    label: string;
+    value_field: string;
+    value_type: ValueType;
+}
+export interface ITableConf {
+    id_field: string;
+    use_raw_columns: boolean;
+    columns: IColumnConf[];
+    size: string;
+    horizontalSpacing: string;
+    verticalSpacing: string;
+    striped: boolean;
+    highlightOnHover: boolean;
+}

package/dist/panel/viz/table/value-type-selector.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { Sx } from "@mantine/core";
+interface IValueTypeSelector {
+    label: string;
+    value: string;
+    onChange: (value: string) => void;
+    sx?: Sx;
+}
+export declare function ValueTypeSelector({ label, value, onChange, sx }: IValueTypeSelector): JSX.Element;
+export {};

package/dist/panel/viz/table/value.d.ts

@@ -0,0 +1,8 @@
+/// <reference types="react" />
+import { ValueType } from "./type";
+interface ICellValue {
+    value: any;
+    type: ValueType;
+}
+export declare function CellValue({ value, type }: ICellValue): JSX.Element;
+export {};

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

@@ -0,0 +1,9 @@
+/// <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

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

package/dist/style.css

@@ -0,0 +1 @@
+.react-grid-item{padding:0}.react-grid-item:not(.react-grid-placeholder){background:transparent;border-radius:5px;box-shadow:0 0 10px #0003}.remove-panel{position:absolute;right:2px;top:0;cursor:pointer}.react-grid-layout{position:relative;transition:height .2s ease}.react-grid-item{transition:all .2s ease;transition-property:left,top}.react-grid-item img{pointer-events:none;user-select:none}.react-grid-item.cssTransforms{transition-property:transform}.react-grid-item.resizing{z-index:1;will-change:width,height}.react-grid-item.react-draggable-dragging{transition:none;z-index:3;will-change:transform}.react-grid-item.dropping{visibility:hidden}.react-grid-item.react-grid-placeholder{background:red;opacity:.2;transition-duration:.1s;z-index:2;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;-o-user-select:none;user-select:none}.react-grid-item>.react-resizable-handle{position:absolute;width:20px;height:20px}.react-grid-item>.react-resizable-handle:after{content:"";position:absolute;right:3px;bottom:3px;width:5px;height:5px;border-right:2px solid rgba(0,0,0,.4);border-bottom:2px solid rgba(0,0,0,.4)}.react-resizable-hide>.react-resizable-handle{display:none}.react-grid-item>.react-resizable-handle.react-resizable-handle-sw{bottom:0;left:0;cursor:sw-resize;transform:rotate(90deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-se{bottom:0;right:0;cursor:se-resize}.react-grid-item>.react-resizable-handle.react-resizable-handle-nw{top:0;left:0;cursor:nw-resize;transform:rotate(180deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-ne{top:0;right:0;cursor:ne-resize;transform:rotate(270deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-w,.react-grid-item>.react-resizable-handle.react-resizable-handle-e{top:50%;margin-top:-10px;cursor:ew-resize}.react-grid-item>.react-resizable-handle.react-resizable-handle-w{left:0;transform:rotate(135deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-e{right:0;transform:rotate(315deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-n,.react-grid-item>.react-resizable-handle.react-resizable-handle-s{left:50%;margin-left:-10px;cursor:ns-resize}.react-grid-item>.react-resizable-handle.react-resizable-handle-n{top:0;transform:rotate(225deg)}.react-grid-item>.react-resizable-handle.react-resizable-handle-s{bottom:0;transform:rotate(45deg)}.react-resizable{position:relative}.react-resizable-handle{position:absolute;width:20px;height:20px;background-repeat:no-repeat;background-origin:content-box;box-sizing:border-box;background-image:url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCA2IDYiIHN0eWxlPSJiYWNrZ3JvdW5kLWNvbG9yOiNmZmZmZmYwMCIgeD0iMHB4IiB5PSIwcHgiIHdpZHRoPSI2cHgiIGhlaWdodD0iNnB4Ij48ZyBvcGFjaXR5PSIwLjMwMiI+PHBhdGggZD0iTSA2IDYgTCAwIDYgTCAwIDQuMiBMIDQgNC4yIEwgNC4yIDQuMiBMIDQuMiAwIEwgNiAwIEwgNiA2IEwgNiA2IFoiIGZpbGw9IiMwMDAwMDAiLz48L2c+PC9zdmc+);background-position:bottom right;padding:0 3px 3px 0}.react-resizable-handle-sw{bottom:0;left:0;cursor:sw-resize;transform:rotate(90deg)}.react-resizable-handle-se{bottom:0;right:0;cursor:se-resize}.react-resizable-handle-nw{top:0;left:0;cursor:nw-resize;transform:rotate(180deg)}.react-resizable-handle-ne{top:0;right:0;cursor:ne-resize;transform:rotate(270deg)}.react-resizable-handle-w,.react-resizable-handle-e{top:50%;margin-top:-10px;cursor:ew-resize}.react-resizable-handle-w{left:0;transform:rotate(135deg)}.react-resizable-handle-e{right:0;transform:rotate(315deg)}.react-resizable-handle-n,.react-resizable-handle-s{left:50%;margin-left:-10px;cursor:ns-resize}.react-resizable-handle-n{top:0;transform:rotate(225deg)}.react-resizable-handle-s{bottom:0;transform:rotate(45deg)}.viz-root{width:100%;overflow:scroll;padding-top:10px;height:calc(100% - 30px);background-color:#fff}.sql-query-editor-root textarea{font-family:monospace}.panel-root{padding:5px;height:100%;width:100%;max-width:100%}.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}

package/dist/types/dashboard.d.ts

@@ -0,0 +1,21 @@
+export interface IVizConfig {
+    type: string;
+    conf: Record<string, any>;
+}
+export interface IDashboardItem {
+    id: string;
+    title: string;
+    description: string;
+    layout: {
+        x: number;
+        y: number;
+        w: number;
+        h: number;
+    };
+    sql: string;
+    viz: IVizConfig;
+}
+export declare enum DashboardMode {
+    Use = "use",
+    Edit = "edit"
+}

package/dist/types/index.d.ts

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

package/dist/types/viz-panel.d.ts

@@ -0,0 +1,5 @@
+import { IVizConfig } from "./dashboard";
+export interface IVizPanelProps {
+    conf: IVizConfig['conf'];
+    setConf: (conf: IVizConfig['conf']) => void;
+}

package/dist/vite-env.d.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />

package/package.json

@@ -0,0 +1,72 @@
+{
+  "name": "@devtable/dashboard",
+  "version": "0.0.1",
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  },
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/dashboard.umd.js",
+  "module": "./dist/dashboard.es.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/dashboard.es.js",
+      "require": "./dist/dashboard.umd.js"
+    },
+    "./dist/style.css": {
+      "import": "./dist/style.css",
+      "require": "./dist/style.css"
+    }
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "ahooks": "^3.3.11",
+    "echarts": "^5.3.2",
+    "echarts-for-react": "^3.0.2",
+    "echarts-gl": "^2.0.9",
+    "numbro": "^2.3.6",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0",
+    "react-grid-layout": "^1.3.4",
+    "react-hook-form": "^7.31.2"
+  },
+  "devDependencies": {
+    "@mantine/core": "^4.2.5",
+    "@mantine/dates": "^4.2.5",
+    "@mantine/form": "^4.2.5",
+    "@mantine/hooks": "^4.2.5",
+    "@mantine/notifications": "^4.2.5",
+    "@mantine/prism": "^4.2.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",
+    "axios": "^0.27.2",
+    "lodash": "^4.17.21",
+    "tabler-icons-react": "^1.48.0",
+    "typescript": "^4.6.3",
+    "vite": "^2.9.9",
+    "vite-plugin-dts": "^1.1.1"
+  },
+  "peerDependencies": {
+    "@mantine/core": "^4.2.5",
+    "@mantine/dates": "^4.2.5",
+    "@mantine/form": "^4.2.5",
+    "@mantine/hooks": "^4.2.5",
+    "@mantine/notifications": "^4.2.5",
+    "@mantine/prism": "^4.2.5",
+    "axios": "^0.27.2",
+    "lodash": "^4.17.21",
+    "react": "^16.8.0 || 17.x || 18.x",
+    "react-dom": "^16.8.0 || 17.x || 18.x",
+    "tabler-icons-react": "^1.48.0"
+  }
+}