@devtable/dashboard 1.18.0 → 1.19.0

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

@@ -1,12 +1,12 @@
 import { ContextInfoContextType } from "../contexts";
-import { IDashboardDefinition, IDataSource } from "../types";
+import { IDashboardDefinition, IQuery } from "../types";
 interface IQueryBySQL {
     context: ContextInfoContextType;
     definitions: IDashboardDefinition;
     title: string;
-    dataSource?: IDataSource;
+    query?: IQuery;
 }
-export declare const queryBySQL: ({ context, definitions, title, dataSource }: IQueryBySQL) => () => Promise<any>;
+export declare const queryBySQL: ({ context, definitions, title, query }: IQueryBySQL) => () => Promise<any>;
 export declare type TQuerySources = Record<string, string[]>;
 export declare function getQuerySources(): Promise<TQuerySources>;
 export {};

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

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

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

@@ -7,8 +7,8 @@ export interface IPanelContext {
     setTitle: React.Dispatch<React.SetStateAction<string>>;
     description: string;
     setDescription: React.Dispatch<React.SetStateAction<string>>;
-    dataSourceID: string;
-    setDataSourceID: React.Dispatch<React.SetStateAction<string>>;
+    queryID: string;
+    setQueryID: React.Dispatch<React.SetStateAction<string>>;
     viz: IVizConfig;
     setViz: React.Dispatch<React.SetStateAction<IVizConfig>>;
     refreshData: () => void;

package/dist/dashboard.es.js

@@ -132,11 +132,11 @@ const APIClient = {
     };
   }
 };
-const queryBySQL = ({ context, definitions, title, dataSource }) => async () => {
-  if (!dataSource || !dataSource.sql) {
+const queryBySQL = ({ context, definitions, title, query }) => async () => {
+  if (!query || !query.sql) {
     return [];
   }
-  const { type, key, sql } = dataSource;
+  const { type, key, sql } = query;
   const needParams = sql.includes("$");
   try {
     const params = getSQLParams(context, definitions);
@@ -174,8 +174,8 @@ const initialContext$1 = {
   description: "",
   setDescription: () => {
   },
-  dataSourceID: "",
-  setDataSourceID: () => {
+  queryID: "",
+  setQueryID: () => {
   },
   viz: {
     type: "",
@@ -191,8 +191,8 @@ const initialContext = {
   sqlSnippets: [],
   setSQLSnippets: () => {
   },
-  dataSources: [],
-  setDataSources: () => {
+  queries: [],
+  setQueries: () => {
   }
 };
 const DefinitionContext = React.createContext(initialContext);
@@ -230,8 +230,8 @@ const jsx = jsxRuntime.exports.jsx;
 const jsxs = jsxRuntime.exports.jsxs;
 const Fragment = jsxRuntime.exports.Fragment;
 function DescriptionPopover({
-  position,
-  trigger = "click"
+  position = "bottom",
+  trigger = "hover"
 }) {
   const {
     freezeLayout
@@ -269,13 +269,14 @@ function DescriptionPopover({
   return /* @__PURE__ */ jsx(Popover, {
     opened,
     onClose: () => setOpened(false),
-    withCloseButton: true,
+    withCloseButton: trigger === "click",
     withArrow: true,
     trapFocus: true,
     closeOnEscape: false,
     placement: "center",
     position,
     target,
+    width: "40vw",
     children: /* @__PURE__ */ jsx(RichTextEditor, {
       readOnly: true,
       value: description,
@@ -380,7 +381,7 @@ function PreviewPanel() {
       mx: "auto",
       mt: "xl",
       p: "5px",
-      spacing: "xs",
+      spacing: 5,
       sx: {
         width: "600px",
         height: "450px",
@@ -392,8 +393,6 @@ function PreviewPanel() {
         position: "apart",
         noWrap: true,
         sx: {
-          borderBottom: "1px solid #eee",
-          paddingBottom: "5px",
           flexGrow: 0,
           flexShrink: 0
         },
@@ -492,9 +491,9 @@ function DataPreview({
 }) {
   const definitions = React.useContext(DefinitionContext);
   const contextInfo = React.useContext(ContextInfoContext);
-  const dataSource = React.useMemo(() => {
-    return definitions.dataSources.find((d) => d.id === id);
-  }, [definitions.dataSources, id]);
+  const query = React.useMemo(() => {
+    return definitions.queries.find((d) => d.id === id);
+  }, [definitions.queries, id]);
   const {
     data = [],
     loading,
@@ -503,9 +502,9 @@ function DataPreview({
     context: contextInfo,
     definitions,
     title: id,
-    dataSource
+    query
   }), {
-    refreshDeps: [contextInfo, definitions, dataSource]
+    refreshDeps: [contextInfo, definitions, query]
   });
   if (loading) {
     return /* @__PURE__ */ jsx(LoadingOverlay, {
@@ -581,22 +580,22 @@ function DataPreview({
     })]
   });
 }
-function PickDataSource({}) {
+function PickQuery({}) {
   const {
-    dataSources
+    queries
   } = React.useContext(DefinitionContext);
   const {
-    dataSourceID,
-    setDataSourceID,
+    queryID,
+    setQueryID,
     data,
     loading
   } = React.useContext(PanelContext);
   const options = React.useMemo(() => {
-    return dataSources.map((d) => ({
+    return queries.map((d) => ({
       value: d.id,
       label: d.id
     }));
-  }, [dataSources]);
+  }, [queries]);
   return /* @__PURE__ */ jsxs(Group, {
     direction: "column",
     grow: true,
@@ -608,11 +607,11 @@ function PickDataSource({}) {
         alignItems: "baseline"
       },
       children: [/* @__PURE__ */ jsx(Text, {
-        children: "Select a Data Source"
+        children: "Select a Query"
       }), /* @__PURE__ */ jsx(Select, {
         data: options,
-        value: dataSourceID,
-        onChange: setDataSourceID,
+        value: queryID,
+        onChange: setQueryID,
         allowDeselect: false,
         clearable: false,
         sx: {
@@ -620,7 +619,7 @@ function PickDataSource({}) {
         }
       })]
     }), /* @__PURE__ */ jsx(DataPreview, {
-      id: dataSourceID
+      id: queryID
     })]
   });
 }
@@ -3547,11 +3546,11 @@ function PanelSettingsModal({
       children: /* @__PURE__ */ jsxs(Tabs, {
         initialTab: 2,
         children: [/* @__PURE__ */ jsxs(Tabs.Tab, {
-          label: "Data Source",
+          label: "Data",
           children: [/* @__PURE__ */ jsx(LoadingOverlay, {
             visible: loading,
             exitTransitionDuration: 0
-          }), /* @__PURE__ */ jsx(PickDataSource, {})]
+          }), /* @__PURE__ */ jsx(PickQuery, {})]
         }), /* @__PURE__ */ jsx(Tabs.Tab, {
           label: "Panel",
           children: /* @__PURE__ */ jsx(PanelConfig, {})
@@ -3563,6 +3562,7 @@ function PanelSettingsModal({
     })
   });
 }
+var titleBar = "";
 function PanelTitleBar({}) {
   const [opened, setOpened] = React.useState(false);
   const open = () => setOpened(true);
@@ -3574,30 +3574,33 @@ function PanelTitleBar({}) {
   const {
     inEditMode
   } = React.useContext(LayoutStateContext);
-  return /* @__PURE__ */ jsxs(Group, {
-    position: "apart",
-    noWrap: true,
+  return /* @__PURE__ */ jsxs(Box, {
     sx: {
-      borderBottom: "1px solid #eee",
-      paddingBottom: "5px"
+      position: "relative"
     },
-    children: [/* @__PURE__ */ jsx(Group, {
+    children: [/* @__PURE__ */ jsx(Box, {
+      sx: {
+        position: "absolute",
+        left: 0,
+        top: 0,
+        height: 28
+      },
       children: /* @__PURE__ */ jsx(DescriptionPopover, {})
     }), /* @__PURE__ */ jsx(Group, {
       grow: true,
       position: "center",
-      children: /* @__PURE__ */ jsx(Text, {
-        lineClamp: 1,
-        weight: "bold",
-        children: title
-      })
-    }), /* @__PURE__ */ jsx(Group, {
-      position: "right",
-      spacing: 0,
+      px: 20,
+      className: "panel-title-wrapper",
       sx: {
-        height: "28px"
+        flexGrow: 1
       },
       children: /* @__PURE__ */ jsxs(Menu, {
+        control: /* @__PURE__ */ jsx(Text, {
+          lineClamp: 1,
+          weight: "bold",
+          children: title
+        }),
+        placement: "center",
         children: [/* @__PURE__ */ jsx(Menu.Item, {
           onClick: refreshData,
           icon: /* @__PURE__ */ jsx(Refresh, {
@@ -3628,7 +3631,7 @@ function PanelTitleBar({}) {
 var index$1 = "";
 function Panel({
   viz: initialViz,
-  dataSourceID: initialDataSourceID,
+  queryID: initialQueryID,
   title: initialTitle,
   description: initialDesc,
   update,
@@ -3639,24 +3642,24 @@ function Panel({
   const definitions = React.useContext(DefinitionContext);
   const [title, setTitle] = React.useState(initialTitle);
   const [description, setDescription] = React.useState(initialDesc);
-  const [dataSourceID, setDataSourceID] = React.useState(initialDataSourceID);
+  const [queryID, setQueryID] = React.useState(initialQueryID);
   const [viz, setViz] = React.useState(initialViz);
-  const dataSource = React.useMemo(() => {
-    if (!dataSourceID) {
+  const query = React.useMemo(() => {
+    if (!queryID) {
       return void 0;
     }
-    return definitions.dataSources.find((d) => d.id === dataSourceID);
-  }, [dataSourceID, definitions.dataSources]);
+    return definitions.queries.find((d) => d.id === queryID);
+  }, [queryID, definitions.queries]);
   React.useEffect(() => {
     update == null ? void 0 : update({
       id,
       layout,
       title,
       description,
-      dataSourceID,
+      queryID,
       viz
     });
-  }, [title, description, dataSource, viz, id, layout, dataSourceID]);
+  }, [title, description, query, viz, id, layout, queryID]);
   const {
     data = [],
     loading,
@@ -3665,9 +3668,9 @@ function Panel({
     context: contextInfo,
     definitions,
     title,
-    dataSource
+    query
   }), {
-    refreshDeps: [contextInfo, definitions, dataSource]
+    refreshDeps: [contextInfo, definitions, query]
   });
   const refreshData = refresh;
   return /* @__PURE__ */ jsx(PanelContext.Provider, {
@@ -3678,8 +3681,8 @@ function Panel({
       setTitle,
       description,
       setDescription,
-      dataSourceID,
-      setDataSourceID,
+      queryID,
+      setQueryID,
       viz,
       setViz,
       refreshData
@@ -3893,7 +3896,7 @@ function PreviewSQL({
     children: explained
   });
 }
-function DataSourceForm({
+function QueryForm({
   value,
   onChange
 }) {
@@ -3950,7 +3953,7 @@ function DataSourceForm({
         },
         children: [/* @__PURE__ */ jsx(Text, {
           weight: 500,
-          children: "Data Source Configuration"
+          children: "Edit Query"
         }), /* @__PURE__ */ jsx(ActionIcon, {
           type: "submit",
           mr: 5,
@@ -4013,81 +4016,81 @@ function DataSourceForm({
     })
   });
 }
-function DataSourceEditor({
+function QueryEditor({
   id,
   setID
 }) {
   const {
-    dataSources,
-    setDataSources
+    queries,
+    setQueries
   } = React.useContext(DefinitionContext);
-  const dataSource = React.useMemo(() => {
-    return dataSources.find((d) => d.id === id);
-  }, [dataSources, id]);
+  const query = React.useMemo(() => {
+    return queries.find((d) => d.id === id);
+  }, [queries, id]);
   const update = React.useCallback((value) => {
-    const index2 = dataSources.findIndex((d) => d.id === id);
+    const index2 = queries.findIndex((d) => d.id === id);
     if (index2 === -1) {
       console.error(new Error("Invalid data source id when updating by id"));
       return;
     }
-    setDataSources((prevs) => {
+    setQueries((prevs) => {
       const index22 = prevs.findIndex((p2) => p2.id === id);
       prevs.splice(index22, 1, value);
       return [...prevs];
     });
     setID(value.id);
-  }, [id, dataSources, setDataSources, setID]);
+  }, [id, queries, setQueries, setID]);
   if (!id) {
     return null;
   }
-  if (!dataSource) {
+  if (!query) {
     return /* @__PURE__ */ jsx("span", {
       children: "Invalid Data Source ID"
     });
   }
-  return /* @__PURE__ */ jsx(DataSourceForm, {
-    value: dataSource,
+  return /* @__PURE__ */ jsx(QueryForm, {
+    value: query,
     onChange: update
   });
 }
-function SelectOrAddDataSource({
+function SelectOrAddQuery({
   id,
   setID
 }) {
   const {
-    dataSources,
-    setDataSources
+    queries,
+    setQueries
   } = React.useContext(DefinitionContext);
   const chooseDefault = React.useCallback(() => {
     var _a, _b;
-    setID((_b = (_a = dataSources[0]) == null ? void 0 : _a.id) != null ? _b : "");
-  }, [setID, dataSources]);
+    setID((_b = (_a = queries[0]) == null ? void 0 : _a.id) != null ? _b : "");
+  }, [setID, queries]);
   React.useEffect(() => {
     if (!id) {
       chooseDefault();
       return;
     }
-    const index2 = dataSources.findIndex((d) => d.id === id);
+    const index2 = queries.findIndex((d) => d.id === id);
     if (index2 === -1) {
       chooseDefault();
     }
-  }, [id, dataSources, chooseDefault]);
+  }, [id, queries, chooseDefault]);
   const options = React.useMemo(() => {
-    return dataSources.map((d) => ({
+    return queries.map((d) => ({
       value: d.id,
       label: d.id
     }));
-  }, [dataSources]);
+  }, [queries]);
   const add = React.useCallback(() => {
-    const newDataSource = {
+    const newQuery = {
       id: randomId(),
       type: "postgresql",
       key: "",
       sql: ""
     };
-    setDataSources((prevs) => [...prevs, newDataSource]);
-    setID(newDataSource.id);
-  }, [setDataSources, setID]);
+    setQueries((prevs) => [...prevs, newQuery]);
+    setID(newQuery.id);
+  }, [setQueries, setID]);
   return /* @__PURE__ */ jsx(Group, {
     pb: "xl",
     children: /* @__PURE__ */ jsxs(Group, {
@@ -4097,7 +4100,7 @@ function SelectOrAddDataSource({
         alignItems: "baseline"
       },
       children: [/* @__PURE__ */ jsx(Text, {
-        children: "Select a Data Source"
+        children: "Select a Query"
       }), /* @__PURE__ */ jsx(Select, {
         data: options,
         value: id,
@@ -4114,13 +4117,13 @@ function SelectOrAddDataSource({
         mt: "md",
         children: /* @__PURE__ */ jsx(Button, {
           onClick: add,
-          children: "Add a Data Source"
+          children: "Add a Query"
         })
       })]
     })
   });
 }
-function EditDataSources({}) {
+function EditQueries({}) {
   const [id, setID] = React.useState("");
   return /* @__PURE__ */ jsxs(AppShell, {
     sx: {
@@ -4150,10 +4153,10 @@ function EditDataSources({}) {
           flexGrow: 1,
           maxWidth: "calc(60% - 16px)"
         },
-        children: [/* @__PURE__ */ jsx(SelectOrAddDataSource, {
+        children: [/* @__PURE__ */ jsx(SelectOrAddQuery, {
           id,
           setID
-        }), /* @__PURE__ */ jsx(DataSourceEditor, {
+        }), /* @__PURE__ */ jsx(QueryEditor, {
           id,
           setID
         })]
@@ -4471,8 +4474,8 @@ function DataEditorModal({
         label: "SQL Snippet",
         children: /* @__PURE__ */ jsx(EditSQLSnippets, {})
       }), /* @__PURE__ */ jsx(Tabs.Tab, {
-        label: "Data Source",
-        children: /* @__PURE__ */ jsx(EditDataSources, {})
+        label: "Queries",
+        children: /* @__PURE__ */ jsx(EditQueries, {})
       })]
     })
   });
@@ -4490,8 +4493,8 @@ function DashboardActions({
     inUseMode
   } = React.useContext(LayoutStateContext);
   const [dataEditorOpened, setDataEditorOpened] = React.useState(false);
-  const openDataSources = () => setDataEditorOpened(true);
-  const closeDataSources = () => setDataEditorOpened(false);
+  const openQueries = () => setDataEditorOpened(true);
+  const closeQueries = () => setDataEditorOpened(false);
   return /* @__PURE__ */ jsxs(Group, {
     position: "apart",
     pt: "sm",
@@ -4515,7 +4518,7 @@ function DashboardActions({
       }), inEditMode && /* @__PURE__ */ jsx(Button, {
         variant: "default",
         size: "sm",
-        onClick: openDataSources,
+        onClick: openQueries,
         leftIcon: /* @__PURE__ */ jsx(Database, {
           size: 20
         }),
@@ -4540,7 +4543,7 @@ function DashboardActions({
       })]
     }), /* @__PURE__ */ jsx(DataEditorModal, {
       opened: dataEditorOpened,
-      close: closeDataSources
+      close: closeQueries
     }), inUseMode && /* @__PURE__ */ jsx(Button, {
       variant: "default",
       size: "sm",
@@ -4565,7 +4568,7 @@ function Dashboard({
   const [layoutFrozen, freezeLayout] = React.useState(false);
   const [panels, setPanels] = React.useState(dashboard.panels);
   const [sqlSnippets, setSQLSnippets] = React.useState(dashboard.definition.sqlSnippets);
-  const [dataSources, setDataSources] = React.useState(dashboard.definition.dataSources);
+  const [queries, setQueries] = React.useState(dashboard.definition.queries);
   const [mode, setMode] = React.useState(DashboardMode.Edit);
   const hasChanges = React.useMemo(() => {
     const cleanJSON = (v) => JSON.parse(JSON.stringify(v));
@@ -4576,14 +4579,14 @@ function Dashboard({
     if (!_.isEqual(sqlSnippets, dashboard.definition.sqlSnippets)) {
       return true;
     }
-    return !_.isEqual(dataSources, dashboard.definition.dataSources);
-  }, [dashboard, panels, sqlSnippets, dataSources]);
+    return !_.isEqual(queries, dashboard.definition.queries);
+  }, [dashboard, panels, sqlSnippets, queries]);
   const saveDashboardChanges = async () => {
     const d = __spreadProps(__spreadValues({}, dashboard), {
       panels,
       definition: {
         sqlSnippets,
-        dataSources
+        queries
       }
     });
     await update(d);
@@ -4598,9 +4601,9 @@ function Dashboard({
         w: 3,
         h: 15
       },
-      title: `New Panel - ${id}`,
-      description: "",
-      dataSourceID: "",
+      title: `Panel - ${id}`,
+      description: "<p><br></p>",
+      queryID: "",
       viz: {
         type: "text",
         conf: {}
@@ -4621,9 +4624,9 @@ function Dashboard({
   const definitions = React.useMemo(() => ({
     sqlSnippets,
     setSQLSnippets,
-    dataSources,
-    setDataSources
-  }), [sqlSnippets, setSQLSnippets, dataSources, setDataSources]);
+    queries,
+    setQueries
+  }), [sqlSnippets, setSQLSnippets, queries, setQueries]);
   return /* @__PURE__ */ jsx(ContextInfoContext.Provider, {
     value: context,
     children: /* @__PURE__ */ jsx("div", {
@@ -4695,7 +4698,7 @@ function ReadOnlyDashboard({
   const definition = React.useMemo(() => __spreadProps(__spreadValues({}, dashboard.definition), {
     setSQLSnippets: () => {
     },
-    setDataSources: () => {
+    setQueries: () => {
     }
   }), [dashboard]);
   return /* @__PURE__ */ jsx(ContextInfoContext.Provider, {

package/dist/dashboard.umd.js

@@ -1,4 +1,4 @@
-(function(y,T){typeof exports=="object"&&typeof module!="undefined"?T(exports,require("react"),require("lodash"),require("react-grid-layout"),require("@mantine/core"),require("ahooks"),require("axios"),require("tabler-icons-react"),require("@mantine/rte"),require("@mantine/hooks"),require("echarts-for-react/lib/core"),require("echarts/core"),require("echarts/charts"),require("echarts/renderers"),require("echarts/components"),require("numbro"),require("echarts-gl"),require("react-hook-form"),require("@mantine/form"),require("@mantine/prism")):typeof define=="function"&&define.amd?define(["exports","react","lodash","react-grid-layout","@mantine/core","ahooks","axios","tabler-icons-react","@mantine/rte","@mantine/hooks","echarts-for-react/lib/core","echarts/core","echarts/charts","echarts/renderers","echarts/components","numbro","echarts-gl","react-hook-form","@mantine/form","@mantine/prism"],T):(y=typeof globalThis!="undefined"?globalThis:y||self,T(y.dashboard={},y.React,y._,y["react-grid-layout"],y["@mantine/core"],y.ahooks,y.axios,y["tabler-icons-react"],y["@mantine/rte"],y["@mantine/hooks"],y["echarts-for-react/lib/core"],y["echarts/core"],y["echarts/charts"],y["echarts/renderers"],y["echarts/components"],y.numbro,y["echarts-gl"],y["react-hook-form"],y["@mantine/form"],y["@mantine/prism"]))})(this,function(y,T,_,P,r,he,ft,S,Ie,E,mt,ht,re,ie,Q,xt,Cr,w,$,q){"use strict";var br=Object.defineProperty,yr=Object.defineProperties;var Sr=Object.getOwnPropertyDescriptors;var me=Object.getOwnPropertySymbols;var dt=Object.prototype.hasOwnProperty,ct=Object.prototype.propertyIsEnumerable;var Pe=(y,T,_)=>T in y?br(y,T,{enumerable:!0,configurable:!0,writable:!0,value:_}):y[T]=_,h=(y,T)=>{for(var _ in T||(T={}))dt.call(T,_)&&Pe(y,_,T[_]);if(me)for(var _ of me(T))ct.call(T,_)&&Pe(y,_,T[_]);return y},G=(y,T)=>yr(y,Sr(T));var z=(y,T)=>{var _={};for(var P in y)dt.call(y,P)&&T.indexOf(P)<0&&(_[P]=y[P]);if(y!=null&&me)for(var P of me(y))T.indexOf(P)<0&&ct.call(y,P)&&(_[P]=y[P]);return _};var pt=(y,T,_)=>(Pe(y,typeof T!="symbol"?T+"":T,_),_);function U(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}function gt(e){if(e&&e.__esModule)return e;var n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});return e&&Object.keys(e).forEach(function(i){if(i!=="default"){var l=Object.getOwnPropertyDescriptor(e,i);Object.defineProperty(n,i,l.get?l:{enumerable:!0,get:function(){return e[i]}})}}),n.default=e,Object.freeze(n)}var c=U(T),D=U(_),Le=U(P),bt=U(ft),yt=U(Ie),oe=U(mt),B=gt(ht),K=U(xt),A=(e=>(e.Use="use",e.Layout="layout",e.Edit="edit",e))(A||{});const St={layoutFrozen:!1,freezeLayout:()=>{},mode:A.Edit,inEditMode:!1,inLayoutMode:!1,inUseMode:!0},j=c.default.createContext(St);function Ct(e,n){const i=Object.keys(n),l=Object.values(n);try{return new Function(...i,`return \`${e}\`;`)(...l)}catch(o){return console.error(o),o.message}}function xe(e,n){const i=Object.keys(n),l=Object.values(n);try{return new Function(...i,`return \`${e}\`;`)(...l)}catch(o){throw i.length===0&&e.includes("$")?new Error("[formatSQL] insufficient params"):o}}function Ae(e,n){const i=n.sqlSnippets.reduce((l,o)=>(l[o.key]=xe(o.value,e),l),{});return D.default.merge({},i,e)}function wt(e,n,i){try{const l=Ae(n,i);return xe(e,l)}catch(l){return console.error(l),l.message}}const Y={baseURL:"http://localhost:31200",getRequest(e){return(n,i,l={})=>{const o=h({"X-Requested-With":"XMLHttpRequest","Content-Type":l.string?"application/x-www-form-urlencoded":"application/json"},l.headers),s={baseURL:this.baseURL,method:e,url:n,params:e==="GET"?i:l.params,headers:o};return e==="POST"&&(s.data=l.string?JSON.stringify(i):i),bt.default(s).then(a=>a.data).catch(a=>Promise.reject(a))}}},Me=({context:e,definitions:n,title:i,dataSource:l})=>async()=>{if(!l||!l.sql)return[];const{type:o,key:s,sql:a}=l,u=a.includes("$");try{const d=Ae(e,n),f=xe(a,d);return u&&(console.groupCollapsed(`Final SQL for: ${i}`),console.log(f),console.groupEnd()),await Y.getRequest("POST")("/query",{type:o,key:s,sql:f})}catch(d){return console.error(d),[]}};async function vt(){try{return await Y.getRequest("GET")("/query/sources",{})}catch(e){return console.error(e),{}}}const Oe={},Tt=Oe,R=c.default.createContext(Oe),Gt={data:[],loading:!1,title:"",setTitle:()=>{},description:"",setDescription:()=>{},dataSourceID:"",setDataSourceID:()=>{},viz:{type:"",conf:{}},setViz:()=>{},refreshData:()=>{}},M=c.default.createContext(Gt),_t={sqlSnippets:[],setSQLSnippets:()=>{},dataSources:[],setDataSources:()=>{}},O=c.default.createContext(_t);var le={exports:{}},ae={};/**
+(function(y,T){typeof exports=="object"&&typeof module!="undefined"?T(exports,require("react"),require("lodash"),require("react-grid-layout"),require("@mantine/core"),require("ahooks"),require("axios"),require("tabler-icons-react"),require("@mantine/rte"),require("@mantine/hooks"),require("echarts-for-react/lib/core"),require("echarts/core"),require("echarts/charts"),require("echarts/renderers"),require("echarts/components"),require("numbro"),require("echarts-gl"),require("react-hook-form"),require("@mantine/form"),require("@mantine/prism")):typeof define=="function"&&define.amd?define(["exports","react","lodash","react-grid-layout","@mantine/core","ahooks","axios","tabler-icons-react","@mantine/rte","@mantine/hooks","echarts-for-react/lib/core","echarts/core","echarts/charts","echarts/renderers","echarts/components","numbro","echarts-gl","react-hook-form","@mantine/form","@mantine/prism"],T):(y=typeof globalThis!="undefined"?globalThis:y||self,T(y.dashboard={},y.React,y._,y["react-grid-layout"],y["@mantine/core"],y.ahooks,y.axios,y["tabler-icons-react"],y["@mantine/rte"],y["@mantine/hooks"],y["echarts-for-react/lib/core"],y["echarts/core"],y["echarts/charts"],y["echarts/renderers"],y["echarts/components"],y.numbro,y["echarts-gl"],y["react-hook-form"],y["@mantine/form"],y["@mantine/prism"]))})(this,function(y,T,_,I,r,he,ft,C,Le,E,mt,ht,re,ie,W,xt,Sr,w,$,k){"use strict";var br=Object.defineProperty,yr=Object.defineProperties;var Cr=Object.getOwnPropertyDescriptors;var me=Object.getOwnPropertySymbols;var dt=Object.prototype.hasOwnProperty,ct=Object.prototype.propertyIsEnumerable;var Ie=(y,T,_)=>T in y?br(y,T,{enumerable:!0,configurable:!0,writable:!0,value:_}):y[T]=_,h=(y,T)=>{for(var _ in T||(T={}))dt.call(T,_)&&Ie(y,_,T[_]);if(me)for(var _ of me(T))ct.call(T,_)&&Ie(y,_,T[_]);return y},G=(y,T)=>yr(y,Cr(T));var P=(y,T)=>{var _={};for(var I in y)dt.call(y,I)&&T.indexOf(I)<0&&(_[I]=y[I]);if(y!=null&&me)for(var I of me(y))T.indexOf(I)<0&&ct.call(y,I)&&(_[I]=y[I]);return _};var pt=(y,T,_)=>(Ie(y,typeof T!="symbol"?T+"":T,_),_);function U(e){return e&&typeof e=="object"&&"default"in e?e:{default:e}}function gt(e){if(e&&e.__esModule)return e;var n=Object.create(null,{[Symbol.toStringTag]:{value:"Module"}});return e&&Object.keys(e).forEach(function(i){if(i!=="default"){var o=Object.getOwnPropertyDescriptor(e,i);Object.defineProperty(n,i,o.get?o:{enumerable:!0,get:function(){return e[i]}})}}),n.default=e,Object.freeze(n)}var c=U(T),z=U(_),Ae=U(I),bt=U(ft),yt=U(Le),le=U(mt),B=gt(ht),K=U(xt),D=(e=>(e.Use="use",e.Layout="layout",e.Edit="edit",e))(D||{});const Ct={layoutFrozen:!1,freezeLayout:()=>{},mode:D.Edit,inEditMode:!1,inLayoutMode:!1,inUseMode:!0},j=c.default.createContext(Ct);function St(e,n){const i=Object.keys(n),o=Object.values(n);try{return new Function(...i,`return \`${e}\`;`)(...o)}catch(l){return console.error(l),l.message}}function xe(e,n){const i=Object.keys(n),o=Object.values(n);try{return new Function(...i,`return \`${e}\`;`)(...o)}catch(l){throw i.length===0&&e.includes("$")?new Error("[formatSQL] insufficient params"):l}}function De(e,n){const i=n.sqlSnippets.reduce((o,l)=>(o[l.key]=xe(l.value,e),o),{});return z.default.merge({},i,e)}function wt(e,n,i){try{const o=De(n,i);return xe(e,o)}catch(o){return console.error(o),o.message}}const Y={baseURL:"http://localhost:31200",getRequest(e){return(n,i,o={})=>{const l=h({"X-Requested-With":"XMLHttpRequest","Content-Type":o.string?"application/x-www-form-urlencoded":"application/json"},o.headers),s={baseURL:this.baseURL,method:e,url:n,params:e==="GET"?i:o.params,headers:l};return e==="POST"&&(s.data=o.string?JSON.stringify(i):i),bt.default(s).then(a=>a.data).catch(a=>Promise.reject(a))}}},Me=({context:e,definitions:n,title:i,query:o})=>async()=>{if(!o||!o.sql)return[];const{type:l,key:s,sql:a}=o,u=a.includes("$");try{const d=De(e,n),f=xe(a,d);return u&&(console.groupCollapsed(`Final SQL for: ${i}`),console.log(f),console.groupEnd()),await Y.getRequest("POST")("/query",{type:l,key:s,sql:f})}catch(d){return console.error(d),[]}};async function vt(){try{return await Y.getRequest("GET")("/query/sources",{})}catch(e){return console.error(e),{}}}const qe={},Tt=qe,R=c.default.createContext(qe),Gt={data:[],loading:!1,title:"",setTitle:()=>{},description:"",setDescription:()=>{},queryID:"",setQueryID:()=>{},viz:{type:"",conf:{}},setViz:()=>{},refreshData:()=>{}},M=c.default.createContext(Gt),_t={sqlSnippets:[],setSQLSnippets:()=>{},queries:[],setQueries:()=>{}},q=c.default.createContext(_t);var oe={exports:{}},ae={};/**
  * @license React
  * react-jsx-runtime.production.min.js
  *
@@ -6,8 +6,8 @@
  *
  * This source code is licensed under the MIT license found in the
  * LICENSE file in the root directory of this source tree.
- */var Dt=c.default,zt=Symbol.for("react.element"),Pt=Symbol.for("react.fragment"),It=Object.prototype.hasOwnProperty,Lt=Dt.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,At={key:!0,ref:!0,__self:!0,__source:!0};function ke(e,n,i){var l,o={},s=null,a=null;i!==void 0&&(s=""+i),n.key!==void 0&&(s=""+n.key),n.ref!==void 0&&(a=n.ref);for(l in n)It.call(n,l)&&!At.hasOwnProperty(l)&&(o[l]=n[l]);if(e&&e.defaultProps)for(l in n=e.defaultProps,n)o[l]===void 0&&(o[l]=n[l]);return{$$typeof:zt,type:e,key:s,ref:a,props:o,_owner:Lt.current}}ae.Fragment=Pt,ae.jsx=ke,ae.jsxs=ke,le.exports=ae;const t=le.exports.jsx,p=le.exports.jsxs,Z=le.exports.Fragment;function qe({position:e,trigger:n="click"}){const{freezeLayout:i}=c.default.useContext(j),[l,o]=c.default.useState(!1),{description:s}=c.default.useContext(M);if(c.default.useEffect(()=>{i(l)},[l]),!s||s==="<p><br></p>")return null;const a=n==="click"?t(r.Tooltip,{label:"Click to see description",openDelay:500,children:t(S.InfoCircle,{size:20,onClick:()=>o(u=>!u),style:{verticalAlign:"baseline",cursor:"pointer"}})}):t(S.InfoCircle,{size:20,onMouseEnter:()=>o(!0),onMouseLeave:()=>o(!1),style:{verticalAlign:"baseline",cursor:"pointer"}});return t(r.Popover,{opened:l,onClose:()=>o(!1),withCloseButton:!0,withArrow:!0,trapFocus:!0,closeOnEscape:!1,placement:"center",position:e,target:a,children:t(yt.default,{readOnly:!0,value:s,onChange:D.default.noop,sx:{border:"none"}})})}function Mt(){const{description:e,setDescription:n}=c.default.useContext(M),[i,l]=c.default.useState(e),o=e!==i,s=c.default.useCallback(()=>{!o||n(i)},[o,i]);return p(r.Group,{direction:"column",sx:{flexGrow:1},children:[p(r.Group,{align:"end",children:[t(r.Text,{children:"Description"}),t(r.ActionIcon,{variant:"hover",color:"blue",disabled:!o,onClick:s,children:t(S.DeviceFloppy,{size:20})})]}),t(Ie.RichTextEditor,{value:i,onChange:l,sx:{flexGrow:1},sticky:!0,p:"0"})]})}class Ee extends c.default.Component{constructor(n){super(n),this.state={error:null}}componentDidCatch(n){this.setState({error:n})}render(){var n;if(this.state.error){const i=()=>{this.setState({error:null})};return p(r.Box,{children:[t(r.Text,{size:"xs",children:(n=this.state.error)==null?void 0:n.message}),t(r.Button,{variant:"subtle",size:"xs",mx:"auto",compact:!0,sx:{display:"block"},onClick:i,children:"Retry"})]})}return this.props.children}}function Ot(){const{title:e}=c.default.useContext(M);return t(Ee,{children:p(r.Group,{direction:"column",grow:!0,noWrap:!0,mx:"auto",mt:"xl",p:"5px",spacing:"xs",sx:{width:"600px",height:"450px",background:"transparent",borderRadius:"5px",boxShadow:"0px 0px 10px 0px rgba(0,0,0,.2)"},children:[p(r.Group,{position:"apart",noWrap:!0,sx:{borderBottom:"1px solid #eee",paddingBottom:"5px",flexGrow:0,flexShrink:0},children:[t(r.Group,{children:t(qe,{position:"bottom",trigger:"hover"})}),t(r.Group,{grow:!0,position:"center",children:t(r.Text,{lineClamp:1,weight:"bold",children:e})}),t(r.Group,{position:"right",spacing:0,sx:{height:"28px"}})]}),t(r.Group,{sx:{background:"#eee",flexGrow:1}})]})})}function kt(){const{title:e,setTitle:n}=c.default.useContext(M),[i,l]=E.useInputState(e),o=e!==i,s=c.default.useCallback(()=>{!o||n(i)},[o,i]);return t(r.TextInput,{value:i,onChange:l,label:p(r.Group,{align:"end",children:[t(r.Text,{children:"Panel Title"}),t(r.ActionIcon,{variant:"hover",color:"blue",disabled:!o,onClick:s,children:t(S.DeviceFloppy,{size:20})})]})})}function qt({}){return p(r.Group,{direction:"row",grow:!0,noWrap:!0,align:"stretch",sx:{height:"100%"},children:[p(r.Group,{grow:!0,direction:"column",sx:{width:"40%",flexShrink:0,flexGrow:0,height:"100%"},children:[t(kt,{}),t(Mt,{})]}),t(r.Box,{sx:{height:"100%",flexGrow:1,maxWidth:"60%"},children:t(Ot,{})})]})}function $e({id:e}){const n=c.default.useContext(O),i=c.default.useContext(R),l=c.default.useMemo(()=>n.dataSources.find(u=>u.id===e),[n.dataSources,e]),{data:o=[],loading:s,refresh:a}=he.useRequest(Me({context:i,definitions:n,title:e,dataSource:l}),{refreshDeps:[i,n,l]});return s?t(r.LoadingOverlay,{visible:s,exitTransitionDuration:0}):o.length===0?t(r.Table,{}):p(r.Group,{my:"xl",direction:"column",grow:!0,sx:{border:"1px solid #eee"},children:[p(r.Group,{position:"apart",py:"md",pl:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef"},children:[p(r.Group,{position:"left",children:[t(r.Text,{weight:500,children:"Preview Data"}),o.length>10&&p(r.Text,{size:"sm",color:"gray",children:["Showing 10 rows of ",o.length]})]}),t(r.ActionIcon,{mr:15,variant:"hover",color:"blue",disabled:s,onClick:a,children:t(S.Refresh,{size:15})})]}),p(r.Table,{children:[t("thead",{children:t("tr",{children:Object.keys(o==null?void 0:o[0]).map(u=>t("th",{children:t(r.Text,{weight:700,color:"#000",children:u})},u))})}),t("tbody",{children:o.slice(0,10).map((u,d)=>t("tr",{children:Object.values(u).map((f,x)=>t("td",{children:t(r.Group,{sx:{"&, .mantine-Text-root":{fontFamily:"monospace"}},children:t(r.Text,{children:f})})},`${f}--${x}`))},`row-${d}`))})]})]})}function Et({}){const{dataSources:e}=c.default.useContext(O),{dataSourceID:n,setDataSourceID:i,data:l,loading:o}=c.default.useContext(M),s=c.default.useMemo(()=>e.map(a=>({value:a.id,label:a.id})),[e]);return p(r.Group,{direction:"column",grow:!0,noWrap:!0,children:[p(r.Group,{position:"left",sx:{maxWidth:"600px",alignItems:"baseline"},children:[t(r.Text,{children:"Select a Data Source"}),t(r.Select,{data:s,value:n,onChange:i,allowDeselect:!1,clearable:!1,sx:{flexGrow:1}})]}),t($e,{id:n})]})}B.use([re.SunburstChart,ie.CanvasRenderer]);const $t={tooltip:{show:!0},series:{type:"sunburst",radius:[0,"90%"],emphasis:{focus:"ancestor"}}};function Rt({conf:e,data:n,width:i,height:l}){const m=e,{label_field:o="name",value_field:s="value"}=m,a=z(m,["label_field","value_field"]),u=c.default.useMemo(()=>n.map(g=>({name:g[o],value:Number(g[s])})),[n,o,s]),d=c.default.useMemo(()=>{var g,b;return(b=(g=D.default.maxBy(u,C=>C.value))==null?void 0:g.value)!=null?b:1},[u]),f=c.default.useMemo(()=>({series:{label:{formatter:({name:g,value:b})=>b/d<.2?" ":g}}}),[d]),x=D.default.merge({},$t,f,a,{series:{data:u}});return t(oe.default,{echarts:B,option:x,style:{width:i,height:l}})}B.use([re.BarChart,re.LineChart,Q.GridComponent,Q.LegendComponent,Q.TooltipComponent,ie.CanvasRenderer]);const Ft={legend:{show:!0,bottom:0,left:0},tooltip:{trigger:"axis"},xAxis:{type:"category",nameGap:25,nameLocation:"center",nameTextStyle:{fontWeight:"bold"}},grid:{top:30,left:15,right:15,bottom:30,containLabel:!0}};function Bt({conf:e,data:n,width:i,height:l}){const o=c.default.useMemo(()=>{var f;const s=e.y_axes.reduce((x,{label_formatter:m},g)=>(x[g]=function(C){const v=typeof C=="object"?C.value:C;if(!m)return v;try{return K.default(v).format(m)}catch(k){return console.error(k),v}},x),{default:({value:x})=>x}),a=e.series.reduce((x,{yAxisIndex:m,name:g})=>(x[g]=m,x),{}),u=e.series.map(v=>{var k=v,{y_axis_data_key:x,yAxisIndex:m,label_position:g,name:b}=k,C=z(k,["y_axis_data_key","yAxisIndex","label_position","name"]);return h({data:n.map(X=>X[x]),label:{show:!!g,position:g,formatter:s[m!=null?m:"default"]},name:b,yAxisIndex:m},C)}),d={xAxis:{data:n.map(x=>x[e.x_axis_data_key]),name:(f=e.x_axis_name)!=null?f:""},yAxis:e.y_axes.map((b,g)=>{var C=b,{label_formatter:x}=C,m=z(C,["label_formatter"]);var v;return G(h({},m),{axisLabel:{show:!0,formatter:(v=s[g])!=null?v:s.default}})}),dataset:{source:n},series:u,tooltip:{formatter:function(x){const m=Array.isArray(x)?x:[x];if(m.length===0)return"";const g=m.map(({seriesName:b,value:C})=>{var L;if(!b)return C;const v=a[b],k=(L=s[v])!=null?L:s.default;return`${b}: ${k({value:C})}`});return g.unshift(`<strong>${m[0].name}</strong>`),g.join("<br />")}}};return D.default.merge({},Ft,d)},[e,n]);return!i||!l?null:t(oe.default,{echarts:B,option:o,style:{width:i,height:l}})}var N=(e=>(e.string="string",e.number="number",e.eloc="eloc",e.percentage="percentage",e))(N||{});function jt({value:e}){return t(r.Text,{component:"span",children:e})}function Nt({value:e}){return t(r.Text,{component:"span",children:e})}function Vt({value:e}){const n=K.default(e).format({thousandSeparated:!0});return t(r.Text,{component:"span",children:n})}function Wt({value:e}){const n=K.default(e).format({output:"percent",mantissa:3});return t(r.Text,{component:"span",children:n})}function Qt({value:e,type:n}){switch(n){case N.string:return t(jt,{value:e});case N.eloc:return t(Nt,{value:e});case N.number:return t(Vt,{value:e});case N.percentage:return t(Wt,{value:e})}}function Ut({conf:e,data:n=[],width:i,height:l}){const x=e,{id_field:o,use_raw_columns:s,columns:a}=x,u=z(x,["id_field","use_raw_columns","columns"]),d=c.default.useMemo(()=>s?Object.keys(n==null?void 0:n[0]):a.map(m=>m.label),[s,a,n]),f=c.default.useMemo(()=>s?Object.keys(n==null?void 0:n[0]).map(m=>({label:m,value_field:m,value_type:N.string})):a,[s,a,n]);return p(r.Table,G(h({sx:{maxHeight:l}},u),{children:[t("thead",{children:t("tr",{children:d.map(m=>t("th",{children:m},m))})}),t("tbody",{children:n.slice(0,30).map((m,g)=>t("tr",{children:f.map(({value_field:b,value_type:C})=>t("td",{children:t(r.Group,{sx:{"&, .mantine-Text-root":{fontFamily:"monospace",fontSize:u.fontSize}},children:t(Qt,{value:m[b],type:C})})},`${b}--${m[b]}`))},o?m[o]:`row-${g}`))}),n.length>100&&t("tfoot",{children:t("tr",{children:t("td",{colSpan:d.length,children:t(r.Text,{color:"red",size:"sm",children:"Showing only the first 30 rows to avoid causing slow performance"})})})})]}))}function Jt(e,n={}){const i=G(h({},n),{numbro:K.default}),l=Object.keys(i),o=Object.values(i);try{return new Function(...l,`return \`${e}\`;`)(...o)}catch(s){return s.message}}function Yt({conf:{paragraphs:e},data:n}){return t(Z,{children:e.map((a,s)=>{var u=a,{template:i,size:l}=u,o=z(u,["template","size"]);return t(r.Text,G(h({},o),{sx:{fontSize:l},children:Jt(i,n[0])}),`${i}---${s}`)})})}B.use([Q.GridComponent,Q.VisualMapComponent,Q.LegendComponent,Q.TooltipComponent,ie.CanvasRenderer]);function Xt({conf:e,data:n,width:i,height:l}){const m=e,{x_axis_data_key:o,y_axis_data_key:s,z_axis_data_key:a}=m,u=z(m,["x_axis_data_key","y_axis_data_key","z_axis_data_key"]),d=c.default.useMemo(()=>D.default.minBy(n,g=>g[a])[a],[n,a]),f=c.default.useMemo(()=>D.default.maxBy(n,g=>g[a])[a],[n,a]),x=G(h({tooltip:{},backgroundColor:"#fff",visualMap:{show:!0,dimension:2,min:d,max:f,inRange:{color:["#313695","#4575b4","#74add1","#abd9e9","#e0f3f8","#ffffbf","#fee090","#fdae61","#f46d43","#d73027","#a50026"]}},xAxis3D:{type:"value"},yAxis3D:{type:"value"},zAxis3D:{type:"value"},grid3D:{viewControl:{projection:"orthographic",autoRotate:!1},light:{main:{shadow:!0,quality:"ultra",intensity:1.5}}}},u),{series:[{type:"bar3D",wireframe:{},data:n.map(g=>[g[o],g[s],g[a]])}]});return t(oe.default,{echarts:B,option:x,style:{width:i,height:l}})}var wr="";B.use([re.PieChart,ie.CanvasRenderer]);const Kt={tooltip:{show:!0},series:{type:"pie",radius:["50%","80%"],label:{position:"outer",alignTo:"edge",formatter:`{name|{b}}
-{percentage|{d}%}`,minMargin:5,edgeDistance:10,lineHeight:15,rich:{percentage:{color:"#999"}},margin:20},labelLine:{length:15,length2:0,maxSurfaceAngle:80,showAbove:!0},top:10,bottom:10,left:10,right:10}};function Zt({conf:e,data:n,width:i,height:l}){const x=e,{label_field:o="name",value_field:s="value"}=x,a=z(x,["label_field","value_field"]),u=c.default.useMemo(()=>n.map(m=>({name:m[o],value:Number(m[s])})),[n,o,s]),d=c.default.useMemo(()=>({series:{labelLayout:function(m){const g=m.labelRect.x<i/2,b=m.labelLinePoints;return b[2][0]=g?m.labelRect.x:m.labelRect.x+m.labelRect.width,{labelLinePoints:b}}}}),[i]),f=D.default.merge({},Kt,d,a,{series:{data:u}});return t(oe.default,{echarts:B,option:f,style:{width:i,height:l}})}var Re=function(){};const Ht=(e,n,i)=>Math.min(Math.max(i,e),n),Fe=(e,n,i)=>{const l=n-e;return l===0?1:(i-e)/l},ge=(e,n,i)=>-i*e+i*n+e,Be=(e,n)=>i=>Math.max(Math.min(i,n),e),H=e=>e%1?Number(e.toFixed(5)):e,se=/(-)?([\d]*\.?[\d])+/g,be=/(#[0-9a-f]{6}|#[0-9a-f]{3}|#(?:[0-9a-f]{2}){2,4}|(rgb|hsl)a?\((-?[\d\.]+%?[,\s]+){2,3}\s*\/*\s*[\d\.]+%?\))/gi,en=/^(#[0-9a-f]{3}|#(?:[0-9a-f]{2}){2,4}|(rgb|hsl)a?\((-?[\d\.]+%?[,\s]+){2,3}\s*\/*\s*[\d\.]+%?\))$/i;function ee(e){return typeof e=="string"}const ue={test:e=>typeof e=="number",parse:parseFloat,transform:e=>e},je=Object.assign(Object.assign({},ue),{transform:Be(0,1)});Object.assign(Object.assign({},ue),{default:1});const te=(e=>({test:n=>ee(n)&&n.endsWith(e)&&n.split(" ").length===1,parse:parseFloat,transform:n=>`${n}${e}`}))("%");Object.assign(Object.assign({},te),{parse:e=>te.parse(e)/100,transform:e=>te.transform(e*100)});const ye=(e,n)=>i=>Boolean(ee(i)&&en.test(i)&&i.startsWith(e)||n&&Object.prototype.hasOwnProperty.call(i,n)),Ne=(e,n,i)=>l=>{if(!ee(l))return l;const[o,s,a,u]=l.match(se);return{[e]:parseFloat(o),[n]:parseFloat(s),[i]:parseFloat(a),alpha:u!==void 0?parseFloat(u):1}},J={test:ye("hsl","hue"),parse:Ne("hue","saturation","lightness"),transform:({hue:e,saturation:n,lightness:i,alpha:l=1})=>"hsla("+Math.round(e)+", "+te.transform(H(n))+", "+te.transform(H(i))+", "+H(je.transform(l))+")"},tn=Be(0,255),Se=Object.assign(Object.assign({},ue),{transform:e=>Math.round(tn(e))}),V={test:ye("rgb","red"),parse:Ne("red","green","blue"),transform:({red:e,green:n,blue:i,alpha:l=1})=>"rgba("+Se.transform(e)+", "+Se.transform(n)+", "+Se.transform(i)+", "+H(je.transform(l))+")"};function nn(e){let n="",i="",l="",o="";return e.length>5?(n=e.substr(1,2),i=e.substr(3,2),l=e.substr(5,2),o=e.substr(7,2)):(n=e.substr(1,1),i=e.substr(2,1),l=e.substr(3,1),o=e.substr(4,1),n+=n,i+=i,l+=l,o+=o),{red:parseInt(n,16),green:parseInt(i,16),blue:parseInt(l,16),alpha:o?parseInt(o,16)/255:1}}const Ce={test:ye("#"),parse:nn,transform:V.transform},de={test:e=>V.test(e)||Ce.test(e)||J.test(e),parse:e=>V.test(e)?V.parse(e):J.test(e)?J.parse(e):Ce.parse(e),transform:e=>ee(e)?e:e.hasOwnProperty("red")?V.transform(e):J.transform(e)},Ve="${c}",We="${n}";function rn(e){var n,i,l,o;return isNaN(e)&&ee(e)&&((i=(n=e.match(se))===null||n===void 0?void 0:n.length)!==null&&i!==void 0?i:0)+((o=(l=e.match(be))===null||l===void 0?void 0:l.length)!==null&&o!==void 0?o:0)>0}function Qe(e){typeof e=="number"&&(e=`${e}`);const n=[];let i=0;const l=e.match(be);l&&(i=l.length,e=e.replace(be,Ve),n.push(...l.map(de.parse)));const o=e.match(se);return o&&(e=e.replace(se,We),n.push(...o.map(ue.parse))),{values:n,numColors:i,tokenised:e}}function Ue(e){return Qe(e).values}function Je(e){const{values:n,numColors:i,tokenised:l}=Qe(e),o=n.length;return s=>{let a=l;for(let u=0;u<o;u++)a=a.replace(u<i?Ve:We,u<i?de.transform(s[u]):H(s[u]));return a}}const on=e=>typeof e=="number"?0:e;function ln(e){const n=Ue(e);return Je(e)(n.map(on))}const Ye={test:rn,parse:Ue,createTransformer:Je,getAnimatableNone:ln};function we(e,n,i){return i<0&&(i+=1),i>1&&(i-=1),i<1/6?e+(n-e)*6*i:i<1/2?n:i<2/3?e+(n-e)*(2/3-i)*6:e}function Xe({hue:e,saturation:n,lightness:i,alpha:l}){e/=360,n/=100,i/=100;let o=0,s=0,a=0;if(!n)o=s=a=i;else{const u=i<.5?i*(1+n):i+n-i*n,d=2*i-u;o=we(d,u,e+1/3),s=we(d,u,e),a=we(d,u,e-1/3)}return{red:Math.round(o*255),green:Math.round(s*255),blue:Math.round(a*255),alpha:l}}const an=(e,n,i)=>{const l=e*e,o=n*n;return Math.sqrt(Math.max(0,i*(o-l)+l))},sn=[Ce,V,J],Ke=e=>sn.find(n=>n.test(e)),Ze=(e,n)=>{let i=Ke(e),l=Ke(n),o=i.parse(e),s=l.parse(n);i===J&&(o=Xe(o),i=V),l===J&&(s=Xe(s),l=V);const a=Object.assign({},o);return u=>{for(const d in a)d!=="alpha"&&(a[d]=an(o[d],s[d],u));return a.alpha=ge(o.alpha,s.alpha,u),i.transform(a)}},un=e=>typeof e=="number",dn=(e,n)=>i=>n(e(i)),He=(...e)=>e.reduce(dn);function et(e,n){return un(e)?i=>ge(e,n,i):de.test(e)?Ze(e,n):rt(e,n)}const tt=(e,n)=>{const i=[...e],l=i.length,o=e.map((s,a)=>et(s,n[a]));return s=>{for(let a=0;a<l;a++)i[a]=o[a](s);return i}},cn=(e,n)=>{const i=Object.assign(Object.assign({},e),n),l={};for(const o in i)e[o]!==void 0&&n[o]!==void 0&&(l[o]=et(e[o],n[o]));return o=>{for(const s in l)i[s]=l[s](o);return i}};function nt(e){const n=Ye.parse(e),i=n.length;let l=0,o=0,s=0;for(let a=0;a<i;a++)l||typeof n[a]=="number"?l++:n[a].hue!==void 0?s++:o++;return{parsed:n,numNumbers:l,numRGB:o,numHSL:s}}const rt=(e,n)=>{const i=Ye.createTransformer(n),l=nt(e),o=nt(n);return l.numHSL===o.numHSL&&l.numRGB===o.numRGB&&l.numNumbers>=o.numNumbers?He(tt(l.parsed,o.parsed),i):a=>`${a>0?n:e}`},pn=(e,n)=>i=>ge(e,n,i);function fn(e){if(typeof e=="number")return pn;if(typeof e=="string")return de.test(e)?Ze:rt;if(Array.isArray(e))return tt;if(typeof e=="object")return cn}function mn(e,n,i){const l=[],o=i||fn(e[0]),s=e.length-1;for(let a=0;a<s;a++){let u=o(e[a],e[a+1]);if(n){const d=Array.isArray(n)?n[a]:n;u=He(d,u)}l.push(u)}return l}function hn([e,n],[i]){return l=>i(Fe(e,n,l))}function xn(e,n){const i=e.length,l=i-1;return o=>{let s=0,a=!1;if(o<=e[0]?a=!0:o>=e[l]&&(s=l-1,a=!0),!a){let d=1;for(;d<i&&!(e[d]>o||d===l);d++);s=d-1}const u=Fe(e[s],e[s+1],o);return n[s](u)}}function gn(e,n,{clamp:i=!0,ease:l,mixer:o}={}){const s=e.length;Re(s===n.length),Re(!l||!Array.isArray(l)||l.length===s-1),e[0]>e[s-1]&&(e=[].concat(e),n=[].concat(n),e.reverse(),n.reverse());const a=mn(n,l,o),u=s===2?hn(e,a):xn(e,a);return i?d=>u(Ht(e[0],e[s-1],d)):u}class bn{constructor({valueRange:n,colorRange:i}){pt(this,"mapper");this.mapper=gn(n,i)}getColor(n){return this.mapper(n)}}function yn(e,n){if(e.type==="static")return e.staticColor;if(e.type==="continuous"){const i=new bn(e),l=n[e.valueField];return i.getColor(l)}return"black"}function Sn(e){return e===null?"null":e===void 0?"undefined":Array.isArray(e)?`Array(${e.length})`:e.toString()}function Cn(s){var a=s,{conf:u}=a,d=u,{content:e,size:n,color:i}=d,l=z(d,["content","size","color"]),{data:o}=a;const f=c.default.useMemo(()=>yn(i,o[0]),[i,o]),x=c.default.useMemo(()=>{var L;const{prefix:m,postfix:g,data_field:b,formatter:C}=e,v=(L=o==null?void 0:o[0])==null?void 0:L[b];return["string","number"].includes(typeof v)?[m,K.default(v).format(C),g].join(" "):Sn(v)},[e,o]);return t(r.Text,G(h({},l),{color:f,sx:{fontSize:n},children:x}))}function wn(e,n,i,l){const o={width:e,height:n,data:i,conf:l.conf};switch(l.type){case"sunburst":return t(Rt,h({},o));case"line-bar":case"cartesian":return t(Bt,h({},o));case"table":return t(Ut,h({},o));case"text":return t(Yt,h({},o));case"stats":return t(Cn,h({},o));case"bar-3d":return t(Xt,h({},o));case"pie":return t(Zt,h({},o));default:return null}}function it({viz:e,data:n,loading:i}){const{ref:l,width:o,height:s}=E.useElementSize(),a=c.default.useMemo(()=>!Array.isArray(n)||n.length===0,[n]);return i?t("div",{className:"viz-root",ref:l,children:t(r.LoadingOverlay,{visible:i,exitTransitionDuration:0})}):p("div",{className:"viz-root",ref:l,children:[a&&t(r.Text,{color:"gray",align:"center",children:"nothing to show"}),!a&&t(Ee,{children:wn(o,s,n,e)})]})}function vn({}){const{data:e,loading:n,viz:i}=c.default.useContext(M);return t(it,{viz:i,data:e,loading:n})}function Tn({label:e,required:n,value:i,onChange:l,data:o,sx:s},a){const u=c.default.useMemo(()=>!Array.isArray(o)||o.length===0?[]:Object.keys(o[0]).map(f=>({label:f,value:f})),[o]);return t(r.Select,{ref:a,label:e,data:u,value:i,onChange:l,required:n,sx:s})}const I=c.default.forwardRef(Tn);function Gn({conf:e,setConf:n,data:i}){const l=D.default.assign({},{x_axis_data_key:"x",y_axis_data_key:"y",z_axis_data_key:"z",xAxis3D:{type:"value",name:"X Axis Name"},yAxis3D:{type:"value",name:"Y Axis Name"},zAxis3D:{type:"value",name:"Z Axis Name"}},e),{control:o,handleSubmit:s,formState:a}=w.useForm({defaultValues:l});return t(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,children:p("form",{onSubmit:s(n),children:[t(r.Text,{children:"X Axis"}),p(r.Group,{position:"apart",grow:!0,p:"md",sx:{position:"relative",border:"1px solid #eee"},children:[t(w.Controller,{name:"x_axis_data_key",control:o,render:({field:u})=>t(I,h({label:"Data Field",required:!0,data:i},u))}),t(w.Controller,{name:"xAxis3D.name",control:o,render:({field:u})=>t(r.TextInput,h({sx:{flexGrow:1},size:"md",label:"Name"},u))})]}),t(r.Text,{mt:"lg",children:"Y Axis"}),p(r.Group,{position:"apart",grow:!0,p:"md",sx:{position:"relative",border:"1px solid #eee"},children:[t(w.Controller,{name:"y_axis_data_key",control:o,render:({field:u})=>t(I,h({label:"Data Field",required:!0,data:i},u))}),t(w.Controller,{name:"yAxis3D.name",control:o,render:({field:u})=>t(r.TextInput,h({sx:{flexGrow:1},size:"md",label:"Name"},u))})]}),t(r.Text,{mt:"lg",children:"Z Axis"}),p(r.Group,{position:"apart",grow:!0,p:"md",sx:{position:"relative",border:"1px solid #eee"},children:[t(w.Controller,{name:"z_axis_data_key",control:o,render:({field:u})=>t(I,h({label:"Data Field",required:!0,data:i},u))}),t(w.Controller,{name:"zAxis3D.name",control:o,render:({field:u})=>t(r.TextInput,h({sx:{flexGrow:1},size:"md",label:"Name"},u))})]}),t(r.Group,{position:"center",mt:"xl",grow:!0,sx:{width:"60%"},mx:"auto",children:p(r.Button,{color:"blue",type:"submit",children:[t(S.DeviceFloppy,{size:20}),t(r.Text,{ml:"md",children:"Save"})]})})]})})}function _n({value:e,onChange:n},i){const l=r.useMantineTheme(),o=c.default.useMemo(()=>Object.entries(l.colors).map(([a,u])=>({label:a,value:u[6]})),[l]),s=c.default.useMemo(()=>o.some(a=>a.value===e),[e,o]);return p(r.Group,{position:"apart",spacing:"xs",children:[t(r.TextInput,{placeholder:"Set any color",value:s?"":e,onChange:a=>n(a.currentTarget.value),rightSection:t(r.ColorSwatch,{color:s?"transparent":e,radius:4}),variant:s?"filled":"default",sx:{maxWidth:"100%",flexGrow:1}}),t(r.Text,{sx:{flexGrow:0},children:"or"}),t(r.Select,{data:o,value:e,onChange:n,variant:s?"default":"filled",placeholder:"Pick a theme color",icon:t(r.ColorSwatch,{color:s?e:"transparent",radius:4}),sx:{maxWidth:"100%",flexGrow:1}})]})}const ve=c.default.forwardRef(_n),Dn=[{label:"off",value:""},{label:"top",value:"top"},{label:"left",value:"left"},{label:"right",value:"right"},{label:"bottom",value:"bottom"},{label:"inside",value:"inside"},{label:"insideLeft",value:"insideLeft"},{label:"insideRight",value:"insideRight"},{label:"insideTop",value:"insideTop"},{label:"insideBottom",value:"insideBottom"},{label:"insideTopLeft",value:"insideTopLeft"},{label:"insideBottomLeft",value:"insideBottomLeft"},{label:"insideTopRight",value:"insideTopRight"},{label:"insideBottomRight",value:"insideBottomRight"}];function zn({control:e,index:n,remove:i,seriesItem:l,yAxisOptions:o,data:s}){const a=l.type;return p(r.Group,{direction:"column",grow:!0,my:0,p:"md",pr:40,sx:{border:"1px solid #eee",position:"relative"},children:[t(r.Group,{direction:"column",grow:!0,noWrap:!0,children:t(w.Controller,{name:`series.${n}.type`,control:e,render:({field:u})=>t(r.SegmentedControl,h({data:[{label:"Line",value:"line"},{label:"Bar",value:"bar"},{label:"Scatter",value:"scatter",disabled:!0},{label:"Boxplot",value:"boxplot",disabled:!0}]},u))})}),t(w.Controller,{name:`series.${n}.name`,control:e,render:({field:u})=>t(r.TextInput,h({label:"Name",required:!0,sx:{flex:1}},u))}),p(r.Group,{direction:"row",grow:!0,noWrap:!0,children:[t(w.Controller,{name:`series.${n}.y_axis_data_key`,control:e,render:({field:u})=>t(I,h({label:"Value Field",required:!0,data:s,sx:{flex:1}},u))}),t(w.Controller,{name:`series.${n}.yAxisIndex`,control:e,render:x=>{var{field:m}=x,g=m,{value:u,onChange:d}=g,f=z(g,["value","onChange"]);var b;return t(r.Select,G(h({label:"Y Axis",data:o,disabled:o.length===0},f),{value:(b=u==null?void 0:u.toString())!=null?b:"",onChange:C=>{if(!C){d(0);return}d(Number(C))},sx:{flex:1}}))}})]}),a==="bar"&&p(r.Group,{direction:"row",grow:!0,align:"top",children:[t(w.Controller,{name:`series.${n}.stack`,control:e,render:({field:u})=>t(r.TextInput,h({label:"Stack",placeholder:"Stack bars by this ID",sx:{flexGrow:1}},u))}),t(w.Controller,{name:`series.${n}.barWidth`,control:e,render:({field:u})=>t(r.TextInput,h({label:"Bar Width",sx:{flexGrow:1}},u))})]}),t(w.Controller,{name:`series.${n}.label_position`,control:e,render:({field:u})=>t(r.Select,h({label:"Label Position",data:Dn},u))}),p(r.Group,{direction:"column",grow:!0,spacing:4,children:[t(r.Text,{size:"sm",children:"Color"}),t(w.Controller,{name:`series.${n}.color`,control:e,render:({field:u})=>t(ve,h({},u))})]}),t(r.ActionIcon,{color:"red",variant:"hover",onClick:()=>i(n),sx:{position:"absolute",top:15,right:5},children:t(S.Trash,{size:16})})]},n)}function Pn({control:e,watch:n,getValues:i,data:l}){const{fields:o,append:s,remove:a}=w.useFieldArray({control:e,name:"series"}),u=n("y_axes"),d=o.map((m,g)=>h(h({},m),u[g])),f=()=>s({type:"bar",name:E.randomId(),showSymbol:!1,y_axis_data_key:"value",yAxisIndex:0,label_position:"top",stack:"",color:"#000"}),x=c.default.useMemo(()=>i().y_axes.map(({name:m},g)=>({label:m,value:g.toString()})),[i]);return p(r.Group,{direction:"column",grow:!0,children:[t(r.Text,{mt:"xl",mb:0,children:"Series"}),d.map((m,g)=>t(zn,{control:e,index:g,remove:a,seriesItem:m,yAxisOptions:x,data:l})),t(r.Group,{position:"center",mt:"xs",children:t(r.Button,{onClick:f,children:"Add a Series"})})]})}const ot={mantissa:0,output:"number"};function In({value:e,onChange:n},i){const l=a=>{n(G(h({},e),{output:a}))},o=a=>{const u=a===0?!1:e.trimMantissa;n(G(h({},e),{mantissa:a,trimMantissa:u}))},s=a=>{n(G(h({},e),{trimMantissa:a.currentTarget.checked}))};return t(r.Group,{direction:"column",grow:!0,noWrap:!0,ref:i,children:p(r.Group,{direction:"row",grow:!0,children:[t(r.Select,{label:"Format",data:[{label:"1234",value:"number"},{label:"99%",value:"percent"}],value:e.output,onChange:l}),t(r.NumberInput,{label:"Mantissa",defaultValue:0,min:0,step:1,max:4,value:e.mantissa,onChange:o}),t(r.Switch,{label:"Trim mantissa",checked:e.trimMantissa,onChange:s,disabled:e.mantissa===0})]})})}const lt=c.default.forwardRef(In);function Ln({control:e,index:n,remove:i}){return p(r.Group,{direction:"column",grow:!0,my:0,p:"md",pr:40,sx:{border:"1px solid #eee",position:"relative"},children:[t(r.Group,{direction:"row",grow:!0,noWrap:!0,children:t(w.Controller,{name:`y_axes.${n}.name`,control:e,render:({field:l})=>t(r.TextInput,h({label:"Name",required:!0,sx:{flex:1}},l))})}),t(r.Group,{direction:"column",grow:!0,noWrap:!0,children:t(w.Controller,{name:`y_axes.${n}.label_formatter`,control:e,render:({field:l})=>t(lt,h({},l))})}),t(r.ActionIcon,{color:"red",variant:"hover",onClick:()=>i(n),sx:{position:"absolute",top:15,right:5},disabled:n===0,children:t(S.Trash,{size:16})})]},n)}function An({control:e,watch:n}){const{fields:i,append:l,remove:o}=w.useFieldArray({control:e,name:"y_axes"}),s=n("y_axes"),a=i.map((d,f)=>h(h({},d),s[f])),u=()=>l({name:"",label_formatter:ot});return p(r.Group,{direction:"column",grow:!0,children:[t(r.Text,{mt:"xl",mb:0,children:"Y Axes"}),a.map((d,f)=>t(Ln,{control:e,index:f,remove:o})),t(r.Group,{position:"center",mt:"xs",children:t(r.Button,{onClick:u,children:"Add a Y Axis"})})]})}function Mn(e){function n({type:i,name:l,showSymbol:o,y_axis_data_key:s="value",yAxisIndex:a=0,label_position:u="top",stack:d="1",color:f="black",barWidth:x="30"}){return{type:i,name:l,showSymbol:o,y_axis_data_key:s,yAxisIndex:a,label_position:u,stack:d,color:f,barWidth:x}}return e.map(n)}function On({conf:e,setConf:n,data:i}){const g=e,{series:l,y_axes:o}=g,s=z(g,["series","y_axes"]),a=c.default.useMemo(()=>{const v=s,{x_axis_name:b=""}=v,C=z(v,["x_axis_name"]);return h({series:Mn(l!=null?l:[]),x_axis_name:b,y_axes:o!=null?o:[{name:"Y Axis",label_formatter:ot}]},C)},[l,s]);c.default.useEffect(()=>{!D.default.isEqual(e,a)&&n(a)},[e,a]);const{control:u,handleSubmit:d,watch:f,formState:{isDirty:x},getValues:m}=w.useForm({defaultValues:a});return t(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,children:p("form",{onSubmit:d(n),children:[p(r.Group,{position:"apart",mb:"lg",sx:{position:"relative"},children:[t(r.Text,{children:"Chart Config"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",disabled:!x,children:t(S.DeviceFloppy,{size:20})})]}),p(r.Group,{direction:"column",grow:!0,noWrap:!0,mb:"lg",children:[t(w.Controller,{name:"x_axis_data_key",control:u,render:({field:b})=>t(I,h({label:"X Axis Data Field",required:!0,data:i,sx:{flex:1}},b))}),t(w.Controller,{name:"x_axis_name",control:u,render:({field:b})=>t(r.TextInput,h({label:"X Axis Name"},b))})]}),t(An,{control:u,watch:f}),t(Pn,{control:u,watch:f,getValues:m,data:i})]})})}function kn({conf:{label_field:e,value_field:n},setConf:i,data:l}){const o=$.useForm({initialValues:{label_field:e,value_field:n}});return t(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,children:p("form",{onSubmit:o.onSubmit(i),children:[p(r.Group,{position:"apart",mb:"lg",sx:{position:"relative"},children:[t(r.Text,{children:"Pie Config"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",children:t(S.DeviceFloppy,{size:20})})]}),p(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,p:"md",mb:"sm",sx:{border:"1px solid #eee",borderRadius:"5px"},children:[t(I,h({label:"Label Field",required:!0,data:l},o.getInputProps("label_field"))),t(I,h({label:"Value Field",required:!0,data:l},o.getInputProps("value_field")))]})]})})}const ce=[{label:"initial",value:0},{label:"500",value:25},{label:"700",value:50},{label:"semibold",value:75},{label:"bold",value:100}];function qn({label:e,value:n,onChange:i},l){var a,u;const[o,s]=c.default.useState((u=(a=ce.find(d=>d.label===n))==null?void 0:a.value)!=null?u:ce[0].value);return c.default.useEffect(()=>{const d=ce.find(f=>f.value===o);d&&i(d.label)},[o]),p(r.Group,{direction:"column",grow:!0,spacing:"xs",mb:"lg",children:[t(r.Text,{children:e}),t(r.Slider,{label:null,marks:ce,value:o,onChange:s,step:25,placeholder:"Pick a font size",ref:l})]})}const at=c.default.forwardRef(qn);function En({label:e,value:n,onChange:i},l){const[o,s]=c.default.useState(Array.isArray(n)?[...n]:[]),a=c.default.useCallback(()=>{s(x=>[...x,""])},[s]),u=c.default.useCallback(x=>{s(m=>(m.splice(x,1),[...m]))},[s]),d=c.default.useMemo(()=>!D.default.isEqual(o,n),[o,n]),f=()=>{i(o.map(x=>x.toString()))};return p(Z,{children:[p(r.Group,{position:"left",ref:l,children:[t(r.Text,{children:e}),t(r.ActionIcon,{mr:5,variant:"filled",color:"blue",disabled:!d,onClick:f,children:t(S.DeviceFloppy,{size:20})})]}),p(r.Group,{children:[o.map((x,m)=>t(r.TextInput,{value:x,onChange:g=>{const b=g.currentTarget.value;s(C=>(C.splice(m,1,b),[...C]))},rightSection:t(r.ActionIcon,{onClick:()=>u(m),color:"red",children:t(S.Trash,{size:14})}),sx:{width:"45%"}})),t(r.ActionIcon,{onClick:a,color:"blue",variant:"outline",children:t(S.PlaylistAdd,{size:20})})]})]})}const $n=c.default.forwardRef(En);function Rn({label:e,value:n,onChange:i},l){const[o,s]=c.default.useState(Array.isArray(n)?[...n]:[]),a=c.default.useCallback(()=>{s(g=>[...g,""])},[s]),u=c.default.useCallback(g=>{s(b=>(b.splice(g,1),[...b]))},[s]),d=c.default.useMemo(()=>!D.default.isEqual(o,n),[o,n]),f=()=>{i(o.map(g=>g.toString()))},x=r.useMantineTheme(),m=c.default.useMemo(()=>Object.entries(x.colors).map(([g,b])=>b[6]),[x]);return p(Z,{children:[p(r.Group,{position:"left",ref:l,children:[t(r.Text,{children:e}),t(r.ActionIcon,{mr:5,variant:"filled",color:"blue",disabled:!d,onClick:f,children:t(S.DeviceFloppy,{size:20})})]}),p(r.Group,{children:[o.map((g,b)=>t(r.ColorInput,{value:g,onChange:C=>{s(v=>(v.splice(b,1,C),[...v]))},swatches:m,rightSection:t(r.ActionIcon,{onClick:()=>u(b),color:"red",children:t(S.Trash,{size:14})}),sx:{width:"45%"}})),t(r.ActionIcon,{onClick:a,color:"blue",variant:"outline",children:t(S.PlaylistAdd,{size:20})})]})]})}const Fn=c.default.forwardRef(Rn);function Bn({conf:e,setConf:n,data:i}){const l=D.default.merge({},{align:"center",size:"100px",weight:"bold",color:{type:"static",staticColor:"red"},content:{prefix:"",data_field:"",formatter:{output:"number",mantissa:0},postfix:""}},e),{control:o,handleSubmit:s,watch:a,formState:{isDirty:u}}=w.useForm({defaultValues:l}),d=a("color.type");return a("color.valueField"),t(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,noWrap:!0,children:p("form",{onSubmit:s(n),children:[p(r.Group,{position:"left",py:"md",pl:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef"},children:[t(r.Text,{weight:500,children:"Stats Configurations"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",disabled:!u,children:t(S.DeviceFloppy,{size:20})})]}),p(r.Accordion,{offsetIcon:!1,multiple:!0,initialState:{0:!0,2:!0},children:[t(r.Accordion.Item,{label:"Content",children:p(r.Group,{direction:"column",grow:!0,children:[p(r.Group,{direction:"row",grow:!0,noWrap:!0,children:[t(w.Controller,{name:"content.prefix",control:o,render:({field:f})=>t(r.TextInput,h({label:"Prefix",sx:{flexGrow:1}},f))}),t(w.Controller,{name:"content.data_field",control:o,render:({field:f})=>t(I,h({label:"Data Field",required:!0,data:i},f))}),t(w.Controller,{name:"content.postfix",control:o,render:({field:f})=>t(r.TextInput,h({label:"Postfix",sx:{flexGrow:1}},f))})]}),t(w.Controller,{name:"content.formatter",control:o,render:({field:f})=>t(lt,h({},f))})]})}),p(r.Accordion.Item,{label:"Font",children:[t(r.Group,{direction:"column",grow:!0,children:t(w.Controller,{name:"size",control:o,render:({field:f})=>t(r.TextInput,h({label:"Font Size",placeholder:"10px, 1em, 1rem, 100%...",sx:{flex:1}},f))})}),t(r.Group,{position:"apart",grow:!0,sx:{"> *":{flexGrow:1,maxWidth:"100%"}},children:t(w.Controller,{name:"weight",control:o,render:({field:f})=>t(at,h({label:"Font Weight"},f))})})]}),t(r.Accordion.Item,{label:"Color",children:p(r.Group,{direction:"column",grow:!0,children:[t(w.Controller,{name:"color.type",control:o,render:({field:f})=>t(r.Select,h({label:"Color Type",data:[{label:"Static Color",value:"static"},{label:"Continuous Color",value:"continuous"}]},f))}),d==="static"&&t(w.Controller,{name:"color.staticColor",control:o,render:({field:f})=>t(ve,h({},f))}),d==="continuous"&&p(Z,{children:[t(w.Controller,{name:"color.valueField",control:o,defaultValue:"",render:({field:f})=>t(r.TextInput,h({placeholder:"Calculate color with this field",label:"Value Field",required:!0,sx:{flex:1}},f))}),t(w.Controller,{name:"color.valueRange",control:o,render:({field:f})=>t($n,h({label:"Value Range"},f))}),t(w.Controller,{name:"color.colorRange",control:o,render:({field:f})=>t(Fn,h({label:"Color Range"},f))})]})]})})]})]})})}function jn({conf:{label_field:e,value_field:n},setConf:i,data:l}){const o=$.useForm({initialValues:{label_field:e,value_field:n}});return t(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,children:p("form",{onSubmit:o.onSubmit(i),children:[p(r.Group,{position:"apart",mb:"lg",sx:{position:"relative"},children:[t(r.Text,{children:"Sunburst Config"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",children:t(S.DeviceFloppy,{size:20})})]}),p(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,p:"md",mb:"sm",sx:{border:"1px solid #eee",borderRadius:"5px"},children:[t(I,h({label:"Label Field",required:!0,data:l},o.getInputProps("label_field"))),t(I,h({label:"Value Field",required:!0,data:l},o.getInputProps("value_field")))]})]})})}const Nn=Object.values(N).map(e=>({label:e,value:e}));function Vn({label:e,value:n,onChange:i,sx:l}){return t(r.Select,{label:e,data:Nn,value:n,onChange:i,sx:l})}function Wn(o){var s=o,{conf:a}=s,u=a,{columns:e}=u,n=z(u,["columns"]),{setConf:i,data:l}=s;const d=$.useForm({initialValues:h({id_field:"id",use_raw_columns:!0,columns:$.formList(e!=null?e:[]),fontSize:"sm",horizontalSpacing:"sm",verticalSpacing:"sm",striped:!1,highlightOnHover:!1},n)}),f=()=>d.addListItem("columns",{label:E.randomId(),value_field:"value",value_type:N.string});return t(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,children:p("form",{onSubmit:d.onSubmit(i),children:[p(r.Group,{position:"apart",mb:"lg",sx:{position:"relative"},children:[t(r.Text,{children:"Table Config"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",children:t(S.DeviceFloppy,{size:20})})]}),p(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,p:"md",mb:"sm",sx:{border:"1px solid #eee",borderRadius:"5px"},children:[t(I,h({label:"ID Field",required:!0,data:l},d.getInputProps("id_field"))),p(r.Group,{position:"apart",mb:"lg",grow:!0,sx:{"> *":{flexGrow:1}},children:[t(r.TextInput,h({label:"Horizontal Spacing",placeholder:"10px, 1em, 1rem, 100%...",required:!0,sx:{flex:1}},d.getInputProps("horizontalSpacing"))),t(r.TextInput,h({label:"Vertical Spacing",placeholder:"10px, 1em, 1rem, 100%...",required:!0,sx:{flex:1}},d.getInputProps("verticalSpacing")))]}),t(r.Group,{position:"apart",mb:"lg",grow:!0,sx:{"> *":{flexGrow:1}},children:t(r.TextInput,h({label:"Font Size",placeholder:"10px, 1em, 1rem, 100%...",required:!0,sx:{flex:1}},d.getInputProps("fontSize")))}),p(r.Group,{direction:"column",grow:!0,children:[t(r.Text,{children:"Other"}),p(r.Group,{position:"apart",grow:!0,children:[t(r.Switch,h({label:"Striped"},d.getInputProps("striped",{type:"checkbox"}))),t(r.Switch,h({label:"Highlight on hover"},d.getInputProps("highlightOnHover",{type:"checkbox"})))]})]})]}),p(r.Group,{direction:"column",mt:"xs",spacing:"xs",grow:!0,p:"md",mb:"xl",sx:{border:"1px solid #eee",borderRadius:"5px"},children:[t(r.Switch,h({label:"Use Original Data Columns"},d.getInputProps("use_raw_columns",{type:"checkbox"}))),!d.values.use_raw_columns&&p(r.Group,{direction:"column",grow:!0,children:[t(r.Text,{mt:"xl",mb:0,children:"Custom Columns"}),d.values.columns.map((x,m)=>p(r.Group,{direction:"column",grow:!0,my:0,p:"md",pr:40,sx:{border:"1px solid #eee",position:"relative"},children:[p(r.Group,{position:"apart",grow:!0,children:[t(r.TextInput,h({label:"Label",required:!0,sx:{flex:1}},d.getListInputProps("columns",m,"label"))),t(I,h({label:"Value Field",required:!0,data:l},d.getListInputProps("columns",m,"value_field"))),t(Vn,h({label:"Value Type",sx:{flex:1}},d.getListInputProps("columns",m,"value_type")))]}),t(r.ActionIcon,{color:"red",variant:"hover",onClick:()=>d.removeListItem("columns",m),sx:{position:"absolute",top:15,right:5},children:t(S.Trash,{size:16})})]},m)),t(r.Group,{position:"center",mt:"xs",children:t(r.Button,{onClick:f,children:"Add a Column"})})]})]}),t(r.Text,{weight:500,mb:"md",children:"Current Configuration:"}),t(q.Prism,{language:"json",colorScheme:"dark",noCopy:!0,children:JSON.stringify(d.values,null,2)})]})})}const st=[{align:"center",size:"xl",weight:"bold",color:"black",template:"Time: ${new Date().toISOString()}"},{align:"center",size:"md",weight:"bold",color:"red",template:"Platform: ${navigator.userAgentData.platform}."}];function Qn({conf:e,setConf:n}){var o;const i=$.useForm({initialValues:{paragraphs:$.formList((o=e.paragraphs)!=null?o:st)}}),l=()=>i.addListItem("paragraphs",G(h({},st[0]),{template:E.randomId()}));return t(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,children:p("form",{onSubmit:i.onSubmit(n),children:[i.values.paragraphs.length===0&&t(r.Text,{color:"dimmed",align:"center",children:"Empty"}),p(r.Group,{position:"apart",mb:"xs",sx:{" + .mantine-Group-root":{marginTop:0}},children:[t(r.Text,{children:"Paragraphs"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",children:t(S.DeviceFloppy,{size:20})})]}),i.values.paragraphs.map((s,a)=>p(r.Group,{direction:"column",grow:!0,my:0,p:"md",pr:40,sx:{border:"1px solid #eee",position:"relative"},children:[t(r.TextInput,h({placeholder:"Time: ${new Date().toISOString()}",label:"Content Template",required:!0,sx:{flex:1}},i.getListInputProps("paragraphs",a,"template"))),p(r.Group,{direction:"column",grow:!0,children:[t(r.Text,{children:"Color"}),t(ve,h({},i.getListInputProps("paragraphs",a,"color")))]}),t(r.Group,{direction:"column",grow:!0,children:t(r.TextInput,h({label:"Font Size",placeholder:"10px, 1em, 1rem, 100%...",sx:{flex:1}},i.getListInputProps("paragraphs",a,"size")))}),t(r.Group,{position:"apart",grow:!0,sx:{"> *":{flexGrow:1,maxWidth:"100%"}},children:t(at,h({label:"Font Weight"},i.getListInputProps("paragraphs",a,"weight")))}),t(r.ActionIcon,{color:"red",variant:"hover",onClick:()=>i.removeListItem("paragraphs",a),sx:{position:"absolute",top:15,right:5},children:t(S.Trash,{size:16})})]},a)),t(r.Group,{position:"center",mt:"md",children:t(r.Button,{onClick:l,children:"Add a Paragraph"})}),t(r.Text,{size:"sm",weight:500,mt:"md",children:"Current Configuration:"}),t(q.Prism,{language:"json",colorScheme:"dark",noCopy:!0,children:JSON.stringify(i.values,null,2)})]})})}const Te=[{value:"text",label:"Text",Panel:Qn},{value:"stats",label:"Stats",Panel:Bn},{value:"table",label:"Table",Panel:Wn},{value:"sunburst",label:"Sunburst",Panel:jn},{value:"bar-3d",label:"Bar Chart (3D)",Panel:Gn},{value:"cartesian",label:"Cartesian Chart",Panel:On},{value:"pie",label:"Pie Chart",Panel:kn}];function Un(){const{data:e,viz:n,setViz:i}=c.default.useContext(M),[l,o]=E.useInputState(n.type),s=n.type!==l,a=c.default.useCallback(()=>{!s||i(x=>G(h({},x),{type:l}))},[s,l]),u=x=>{i(m=>G(h({},m),{conf:x}))},d=x=>{try{u(JSON.parse(x))}catch(m){console.error(m)}},f=c.default.useMemo(()=>{var x;return(x=Te.find(m=>m.value===l))==null?void 0:x.Panel},[l,Te]);return p(Z,{children:[t(r.Select,{label:"Visualization",value:l,onChange:o,data:Te,rightSection:t(r.ActionIcon,{disabled:!s,onClick:a,children:t(S.DeviceFloppy,{size:20})})}),f&&t(f,{conf:n.conf,setConf:u,data:e}),!f&&t(r.JsonInput,{minRows:20,label:"Config",value:JSON.stringify(n.conf,null,2),onChange:d})]})}function Jn({}){return p(r.Group,{direction:"row",grow:!0,noWrap:!0,align:"stretch",sx:{height:"100%"},children:[t(r.Group,{grow:!0,direction:"column",noWrap:!0,sx:{width:"40%",flexShrink:0,flexGrow:0},children:t(Un,{})}),t(r.Box,{sx:{height:"100%",flexGrow:1,maxWidth:"60%"},children:t(vn,{})})]})}function Yn({opened:e,close:n}){const{freezeLayout:i}=c.default.useContext(j),{data:l,loading:o,viz:s,title:a}=c.default.useContext(M);return c.default.useEffect(()=>{i(e)},[e]),t(r.Modal,{size:"96vw",overflow:"inside",opened:e,onClose:n,title:a,trapFocus:!0,onDragStart:u=>{u.stopPropagation()},children:t(r.AppShell,{sx:{height:"90vh",maxHeight:"calc(100vh - 185px)",".mantine-AppShell-body":{height:"100%"},main:{height:"100%",width:"100%"}},padding:"md",children:p(r.Tabs,{initialTab:2,children:[p(r.Tabs.Tab,{label:"Data Source",children:[t(r.LoadingOverlay,{visible:o,exitTransitionDuration:0}),t(Et,{})]}),t(r.Tabs.Tab,{label:"Panel",children:t(qt,{})}),t(r.Tabs.Tab,{label:"Visualization",children:t(Jn,{})})]})})})}function Xn({}){const[e,n]=c.default.useState(!1),i=()=>n(!0),l=()=>n(!1),{title:o,refreshData:s}=c.default.useContext(M),{inEditMode:a}=c.default.useContext(j);return p(r.Group,{position:"apart",noWrap:!0,sx:{borderBottom:"1px solid #eee",paddingBottom:"5px"},children:[t(r.Group,{children:t(qe,{})}),t(r.Group,{grow:!0,position:"center",children:t(r.Text,{lineClamp:1,weight:"bold",children:o})}),t(r.Group,{position:"right",spacing:0,sx:{height:"28px"},children:p(r.Menu,{children:[t(r.Menu.Item,{onClick:s,icon:t(S.Refresh,{size:14}),children:"Refresh"}),a&&t(r.Menu.Item,{onClick:i,icon:t(S.Settings,{size:14}),children:"Settings"}),t(r.Divider,{}),t(r.Menu.Item,{color:"red",disabled:!0,icon:t(S.Trash,{size:14}),children:"Delete"})]})}),a&&t(Yn,{opened:e,close:l})]})}var Tr="";function Ge({viz:e,dataSourceID:n,title:i,description:l,update:o,layout:s,id:a}){const u=c.default.useContext(R),d=c.default.useContext(O),[f,x]=c.default.useState(i),[m,g]=c.default.useState(l),[b,C]=c.default.useState(n),[v,k]=c.default.useState(e),L=c.default.useMemo(()=>{if(!!b)return d.dataSources.find(ze=>ze.id===b)},[b,d.dataSources]);c.default.useEffect(()=>{o==null||o({id:a,layout:s,title:f,description:m,dataSourceID:b,viz:v})},[f,m,L,v,a,s,b]);const{data:X=[],loading:pe,refresh:ne}=he.useRequest(Me({context:u,definitions:d,title:f,dataSource:L}),{refreshDeps:[u,d,L]}),De=ne;return t(M.Provider,{value:{data:X,loading:pe,title:f,setTitle:x,description:m,setDescription:g,dataSourceID:b,setDataSourceID:C,viz:v,setViz:k,refreshData:De},children:p(r.Container,{className:"panel-root",children:[t(Xn,{}),t(it,{viz:v,data:X,loading:pe})]})})}var Gr="";const Kn=P.WidthProvider(Le.default);function ut({panels:e,setPanels:n,className:i="layout",rowHeight:l=10,onRemoveItem:o,isDraggable:s,isResizable:a}){const u=c.default.useCallback(d=>{const f=new Map;d.forEach(b=>{var C=b,{i:m}=C,g=z(C,["i"]);f.set(m,g)});const x=e.map(m=>G(h({},m),{layout:f.get(m.id)}));n(x)},[e,n]);return t(Kn,{onLayoutChange:u,className:i,rowHeight:l,isDraggable:s,isResizable:a,children:e.map((m,x)=>{var g=m,{id:d}=g,f=z(g,["id"]);return t("div",{"data-grid":f.layout,children:t(Ge,G(h({id:d},f),{destroy:()=>o(d),update:b=>{n(C=>(C.splice(x,1,b),[...C]))}}))},d)})})}function _e(e,n){return p(r.Text,{sx:{svg:{verticalAlign:"text-bottom"}},children:[e," ",n]})}function Zn({mode:e,setMode:n}){return t(r.SegmentedControl,{value:e,onChange:n,data:[{label:_e(t(S.PlayerPlay,{size:20}),"Use"),value:A.Use},{label:_e(t(S.Resize,{size:20}),"Layout"),value:A.Layout},{label:_e(t(S.Paint,{size:20}),"Content"),value:A.Edit}]})}const Hn=`
+ */var zt=c.default,Pt=Symbol.for("react.element"),It=Symbol.for("react.fragment"),Lt=Object.prototype.hasOwnProperty,At=zt.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentOwner,Dt={key:!0,ref:!0,__self:!0,__source:!0};function Oe(e,n,i){var o,l={},s=null,a=null;i!==void 0&&(s=""+i),n.key!==void 0&&(s=""+n.key),n.ref!==void 0&&(a=n.ref);for(o in n)Lt.call(n,o)&&!Dt.hasOwnProperty(o)&&(l[o]=n[o]);if(e&&e.defaultProps)for(o in n=e.defaultProps,n)l[o]===void 0&&(l[o]=n[o]);return{$$typeof:Pt,type:e,key:s,ref:a,props:l,_owner:At.current}}ae.Fragment=It,ae.jsx=Oe,ae.jsxs=Oe,oe.exports=ae;const t=oe.exports.jsx,p=oe.exports.jsxs,Z=oe.exports.Fragment;function ke({position:e="bottom",trigger:n="hover"}){const{freezeLayout:i}=c.default.useContext(j),[o,l]=c.default.useState(!1),{description:s}=c.default.useContext(M);if(c.default.useEffect(()=>{i(o)},[o]),!s||s==="<p><br></p>")return null;const a=n==="click"?t(r.Tooltip,{label:"Click to see description",openDelay:500,children:t(C.InfoCircle,{size:20,onClick:()=>l(u=>!u),style:{verticalAlign:"baseline",cursor:"pointer"}})}):t(C.InfoCircle,{size:20,onMouseEnter:()=>l(!0),onMouseLeave:()=>l(!1),style:{verticalAlign:"baseline",cursor:"pointer"}});return t(r.Popover,{opened:o,onClose:()=>l(!1),withCloseButton:n==="click",withArrow:!0,trapFocus:!0,closeOnEscape:!1,placement:"center",position:e,target:a,width:"40vw",children:t(yt.default,{readOnly:!0,value:s,onChange:z.default.noop,sx:{border:"none"}})})}function Mt(){const{description:e,setDescription:n}=c.default.useContext(M),[i,o]=c.default.useState(e),l=e!==i,s=c.default.useCallback(()=>{!l||n(i)},[l,i]);return p(r.Group,{direction:"column",sx:{flexGrow:1},children:[p(r.Group,{align:"end",children:[t(r.Text,{children:"Description"}),t(r.ActionIcon,{variant:"hover",color:"blue",disabled:!l,onClick:s,children:t(C.DeviceFloppy,{size:20})})]}),t(Le.RichTextEditor,{value:i,onChange:o,sx:{flexGrow:1},sticky:!0,p:"0"})]})}class Ee extends c.default.Component{constructor(n){super(n),this.state={error:null}}componentDidCatch(n){this.setState({error:n})}render(){var n;if(this.state.error){const i=()=>{this.setState({error:null})};return p(r.Box,{children:[t(r.Text,{size:"xs",children:(n=this.state.error)==null?void 0:n.message}),t(r.Button,{variant:"subtle",size:"xs",mx:"auto",compact:!0,sx:{display:"block"},onClick:i,children:"Retry"})]})}return this.props.children}}function qt(){const{title:e}=c.default.useContext(M);return t(Ee,{children:p(r.Group,{direction:"column",grow:!0,noWrap:!0,mx:"auto",mt:"xl",p:"5px",spacing:5,sx:{width:"600px",height:"450px",background:"transparent",borderRadius:"5px",boxShadow:"0px 0px 10px 0px rgba(0,0,0,.2)"},children:[p(r.Group,{position:"apart",noWrap:!0,sx:{flexGrow:0,flexShrink:0},children:[t(r.Group,{children:t(ke,{position:"bottom",trigger:"hover"})}),t(r.Group,{grow:!0,position:"center",children:t(r.Text,{lineClamp:1,weight:"bold",children:e})}),t(r.Group,{position:"right",spacing:0,sx:{height:"28px"}})]}),t(r.Group,{sx:{background:"#eee",flexGrow:1}})]})})}function Ot(){const{title:e,setTitle:n}=c.default.useContext(M),[i,o]=E.useInputState(e),l=e!==i,s=c.default.useCallback(()=>{!l||n(i)},[l,i]);return t(r.TextInput,{value:i,onChange:o,label:p(r.Group,{align:"end",children:[t(r.Text,{children:"Panel Title"}),t(r.ActionIcon,{variant:"hover",color:"blue",disabled:!l,onClick:s,children:t(C.DeviceFloppy,{size:20})})]})})}function kt({}){return p(r.Group,{direction:"row",grow:!0,noWrap:!0,align:"stretch",sx:{height:"100%"},children:[p(r.Group,{grow:!0,direction:"column",sx:{width:"40%",flexShrink:0,flexGrow:0,height:"100%"},children:[t(Ot,{}),t(Mt,{})]}),t(r.Box,{sx:{height:"100%",flexGrow:1,maxWidth:"60%"},children:t(qt,{})})]})}function $e({id:e}){const n=c.default.useContext(q),i=c.default.useContext(R),o=c.default.useMemo(()=>n.queries.find(u=>u.id===e),[n.queries,e]),{data:l=[],loading:s,refresh:a}=he.useRequest(Me({context:i,definitions:n,title:e,query:o}),{refreshDeps:[i,n,o]});return s?t(r.LoadingOverlay,{visible:s,exitTransitionDuration:0}):l.length===0?t(r.Table,{}):p(r.Group,{my:"xl",direction:"column",grow:!0,sx:{border:"1px solid #eee"},children:[p(r.Group,{position:"apart",py:"md",pl:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef"},children:[p(r.Group,{position:"left",children:[t(r.Text,{weight:500,children:"Preview Data"}),l.length>10&&p(r.Text,{size:"sm",color:"gray",children:["Showing 10 rows of ",l.length]})]}),t(r.ActionIcon,{mr:15,variant:"hover",color:"blue",disabled:s,onClick:a,children:t(C.Refresh,{size:15})})]}),p(r.Table,{children:[t("thead",{children:t("tr",{children:Object.keys(l==null?void 0:l[0]).map(u=>t("th",{children:t(r.Text,{weight:700,color:"#000",children:u})},u))})}),t("tbody",{children:l.slice(0,10).map((u,d)=>t("tr",{children:Object.values(u).map((f,x)=>t("td",{children:t(r.Group,{sx:{"&, .mantine-Text-root":{fontFamily:"monospace"}},children:t(r.Text,{children:f})})},`${f}--${x}`))},`row-${d}`))})]})]})}function Et({}){const{queries:e}=c.default.useContext(q),{queryID:n,setQueryID:i,data:o,loading:l}=c.default.useContext(M),s=c.default.useMemo(()=>e.map(a=>({value:a.id,label:a.id})),[e]);return p(r.Group,{direction:"column",grow:!0,noWrap:!0,children:[p(r.Group,{position:"left",sx:{maxWidth:"600px",alignItems:"baseline"},children:[t(r.Text,{children:"Select a Query"}),t(r.Select,{data:s,value:n,onChange:i,allowDeselect:!1,clearable:!1,sx:{flexGrow:1}})]}),t($e,{id:n})]})}B.use([re.SunburstChart,ie.CanvasRenderer]);const $t={tooltip:{show:!0},series:{type:"sunburst",radius:[0,"90%"],emphasis:{focus:"ancestor"}}};function Rt({conf:e,data:n,width:i,height:o}){const m=e,{label_field:l="name",value_field:s="value"}=m,a=P(m,["label_field","value_field"]),u=c.default.useMemo(()=>n.map(g=>({name:g[l],value:Number(g[s])})),[n,l,s]),d=c.default.useMemo(()=>{var g,b;return(b=(g=z.default.maxBy(u,S=>S.value))==null?void 0:g.value)!=null?b:1},[u]),f=c.default.useMemo(()=>({series:{label:{formatter:({name:g,value:b})=>b/d<.2?" ":g}}}),[d]),x=z.default.merge({},$t,f,a,{series:{data:u}});return t(le.default,{echarts:B,option:x,style:{width:i,height:o}})}B.use([re.BarChart,re.LineChart,W.GridComponent,W.LegendComponent,W.TooltipComponent,ie.CanvasRenderer]);const Ft={legend:{show:!0,bottom:0,left:0},tooltip:{trigger:"axis"},xAxis:{type:"category",nameGap:25,nameLocation:"center",nameTextStyle:{fontWeight:"bold"}},grid:{top:30,left:15,right:15,bottom:30,containLabel:!0}};function Bt({conf:e,data:n,width:i,height:o}){const l=c.default.useMemo(()=>{var f;const s=e.y_axes.reduce((x,{label_formatter:m},g)=>(x[g]=function(S){const v=typeof S=="object"?S.value:S;if(!m)return v;try{return K.default(v).format(m)}catch(O){return console.error(O),v}},x),{default:({value:x})=>x}),a=e.series.reduce((x,{yAxisIndex:m,name:g})=>(x[g]=m,x),{}),u=e.series.map(v=>{var O=v,{y_axis_data_key:x,yAxisIndex:m,label_position:g,name:b}=O,S=P(O,["y_axis_data_key","yAxisIndex","label_position","name"]);return h({data:n.map(X=>X[x]),label:{show:!!g,position:g,formatter:s[m!=null?m:"default"]},name:b,yAxisIndex:m},S)}),d={xAxis:{data:n.map(x=>x[e.x_axis_data_key]),name:(f=e.x_axis_name)!=null?f:""},yAxis:e.y_axes.map((b,g)=>{var S=b,{label_formatter:x}=S,m=P(S,["label_formatter"]);var v;return G(h({},m),{axisLabel:{show:!0,formatter:(v=s[g])!=null?v:s.default}})}),dataset:{source:n},series:u,tooltip:{formatter:function(x){const m=Array.isArray(x)?x:[x];if(m.length===0)return"";const g=m.map(({seriesName:b,value:S})=>{var A;if(!b)return S;const v=a[b],O=(A=s[v])!=null?A:s.default;return`${b}: ${O({value:S})}`});return g.unshift(`<strong>${m[0].name}</strong>`),g.join("<br />")}}};return z.default.merge({},Ft,d)},[e,n]);return!i||!o?null:t(le.default,{echarts:B,option:l,style:{width:i,height:o}})}var N=(e=>(e.string="string",e.number="number",e.eloc="eloc",e.percentage="percentage",e))(N||{});function jt({value:e}){return t(r.Text,{component:"span",children:e})}function Nt({value:e}){return t(r.Text,{component:"span",children:e})}function Vt({value:e}){const n=K.default(e).format({thousandSeparated:!0});return t(r.Text,{component:"span",children:n})}function Qt({value:e}){const n=K.default(e).format({output:"percent",mantissa:3});return t(r.Text,{component:"span",children:n})}function Wt({value:e,type:n}){switch(n){case N.string:return t(jt,{value:e});case N.eloc:return t(Nt,{value:e});case N.number:return t(Vt,{value:e});case N.percentage:return t(Qt,{value:e})}}function Ut({conf:e,data:n=[],width:i,height:o}){const x=e,{id_field:l,use_raw_columns:s,columns:a}=x,u=P(x,["id_field","use_raw_columns","columns"]),d=c.default.useMemo(()=>s?Object.keys(n==null?void 0:n[0]):a.map(m=>m.label),[s,a,n]),f=c.default.useMemo(()=>s?Object.keys(n==null?void 0:n[0]).map(m=>({label:m,value_field:m,value_type:N.string})):a,[s,a,n]);return p(r.Table,G(h({sx:{maxHeight:o}},u),{children:[t("thead",{children:t("tr",{children:d.map(m=>t("th",{children:m},m))})}),t("tbody",{children:n.slice(0,30).map((m,g)=>t("tr",{children:f.map(({value_field:b,value_type:S})=>t("td",{children:t(r.Group,{sx:{"&, .mantine-Text-root":{fontFamily:"monospace",fontSize:u.fontSize}},children:t(Wt,{value:m[b],type:S})})},`${b}--${m[b]}`))},l?m[l]:`row-${g}`))}),n.length>100&&t("tfoot",{children:t("tr",{children:t("td",{colSpan:d.length,children:t(r.Text,{color:"red",size:"sm",children:"Showing only the first 30 rows to avoid causing slow performance"})})})})]}))}function Jt(e,n={}){const i=G(h({},n),{numbro:K.default}),o=Object.keys(i),l=Object.values(i);try{return new Function(...o,`return \`${e}\`;`)(...l)}catch(s){return s.message}}function Yt({conf:{paragraphs:e},data:n}){return t(Z,{children:e.map((a,s)=>{var u=a,{template:i,size:o}=u,l=P(u,["template","size"]);return t(r.Text,G(h({},l),{sx:{fontSize:o},children:Jt(i,n[0])}),`${i}---${s}`)})})}B.use([W.GridComponent,W.VisualMapComponent,W.LegendComponent,W.TooltipComponent,ie.CanvasRenderer]);function Xt({conf:e,data:n,width:i,height:o}){const m=e,{x_axis_data_key:l,y_axis_data_key:s,z_axis_data_key:a}=m,u=P(m,["x_axis_data_key","y_axis_data_key","z_axis_data_key"]),d=c.default.useMemo(()=>z.default.minBy(n,g=>g[a])[a],[n,a]),f=c.default.useMemo(()=>z.default.maxBy(n,g=>g[a])[a],[n,a]),x=G(h({tooltip:{},backgroundColor:"#fff",visualMap:{show:!0,dimension:2,min:d,max:f,inRange:{color:["#313695","#4575b4","#74add1","#abd9e9","#e0f3f8","#ffffbf","#fee090","#fdae61","#f46d43","#d73027","#a50026"]}},xAxis3D:{type:"value"},yAxis3D:{type:"value"},zAxis3D:{type:"value"},grid3D:{viewControl:{projection:"orthographic",autoRotate:!1},light:{main:{shadow:!0,quality:"ultra",intensity:1.5}}}},u),{series:[{type:"bar3D",wireframe:{},data:n.map(g=>[g[l],g[s],g[a]])}]});return t(le.default,{echarts:B,option:x,style:{width:i,height:o}})}var wr="";B.use([re.PieChart,ie.CanvasRenderer]);const Kt={tooltip:{show:!0},series:{type:"pie",radius:["50%","80%"],label:{position:"outer",alignTo:"edge",formatter:`{name|{b}}
+{percentage|{d}%}`,minMargin:5,edgeDistance:10,lineHeight:15,rich:{percentage:{color:"#999"}},margin:20},labelLine:{length:15,length2:0,maxSurfaceAngle:80,showAbove:!0},top:10,bottom:10,left:10,right:10}};function Zt({conf:e,data:n,width:i,height:o}){const x=e,{label_field:l="name",value_field:s="value"}=x,a=P(x,["label_field","value_field"]),u=c.default.useMemo(()=>n.map(m=>({name:m[l],value:Number(m[s])})),[n,l,s]),d=c.default.useMemo(()=>({series:{labelLayout:function(m){const g=m.labelRect.x<i/2,b=m.labelLinePoints;return b[2][0]=g?m.labelRect.x:m.labelRect.x+m.labelRect.width,{labelLinePoints:b}}}}),[i]),f=z.default.merge({},Kt,d,a,{series:{data:u}});return t(le.default,{echarts:B,option:f,style:{width:i,height:o}})}var Re=function(){};const Ht=(e,n,i)=>Math.min(Math.max(i,e),n),Fe=(e,n,i)=>{const o=n-e;return o===0?1:(i-e)/o},ge=(e,n,i)=>-i*e+i*n+e,Be=(e,n)=>i=>Math.max(Math.min(i,n),e),H=e=>e%1?Number(e.toFixed(5)):e,se=/(-)?([\d]*\.?[\d])+/g,be=/(#[0-9a-f]{6}|#[0-9a-f]{3}|#(?:[0-9a-f]{2}){2,4}|(rgb|hsl)a?\((-?[\d\.]+%?[,\s]+){2,3}\s*\/*\s*[\d\.]+%?\))/gi,en=/^(#[0-9a-f]{3}|#(?:[0-9a-f]{2}){2,4}|(rgb|hsl)a?\((-?[\d\.]+%?[,\s]+){2,3}\s*\/*\s*[\d\.]+%?\))$/i;function ee(e){return typeof e=="string"}const ue={test:e=>typeof e=="number",parse:parseFloat,transform:e=>e},je=Object.assign(Object.assign({},ue),{transform:Be(0,1)});Object.assign(Object.assign({},ue),{default:1});const te=(e=>({test:n=>ee(n)&&n.endsWith(e)&&n.split(" ").length===1,parse:parseFloat,transform:n=>`${n}${e}`}))("%");Object.assign(Object.assign({},te),{parse:e=>te.parse(e)/100,transform:e=>te.transform(e*100)});const ye=(e,n)=>i=>Boolean(ee(i)&&en.test(i)&&i.startsWith(e)||n&&Object.prototype.hasOwnProperty.call(i,n)),Ne=(e,n,i)=>o=>{if(!ee(o))return o;const[l,s,a,u]=o.match(se);return{[e]:parseFloat(l),[n]:parseFloat(s),[i]:parseFloat(a),alpha:u!==void 0?parseFloat(u):1}},J={test:ye("hsl","hue"),parse:Ne("hue","saturation","lightness"),transform:({hue:e,saturation:n,lightness:i,alpha:o=1})=>"hsla("+Math.round(e)+", "+te.transform(H(n))+", "+te.transform(H(i))+", "+H(je.transform(o))+")"},tn=Be(0,255),Ce=Object.assign(Object.assign({},ue),{transform:e=>Math.round(tn(e))}),V={test:ye("rgb","red"),parse:Ne("red","green","blue"),transform:({red:e,green:n,blue:i,alpha:o=1})=>"rgba("+Ce.transform(e)+", "+Ce.transform(n)+", "+Ce.transform(i)+", "+H(je.transform(o))+")"};function nn(e){let n="",i="",o="",l="";return e.length>5?(n=e.substr(1,2),i=e.substr(3,2),o=e.substr(5,2),l=e.substr(7,2)):(n=e.substr(1,1),i=e.substr(2,1),o=e.substr(3,1),l=e.substr(4,1),n+=n,i+=i,o+=o,l+=l),{red:parseInt(n,16),green:parseInt(i,16),blue:parseInt(o,16),alpha:l?parseInt(l,16)/255:1}}const Se={test:ye("#"),parse:nn,transform:V.transform},de={test:e=>V.test(e)||Se.test(e)||J.test(e),parse:e=>V.test(e)?V.parse(e):J.test(e)?J.parse(e):Se.parse(e),transform:e=>ee(e)?e:e.hasOwnProperty("red")?V.transform(e):J.transform(e)},Ve="${c}",Qe="${n}";function rn(e){var n,i,o,l;return isNaN(e)&&ee(e)&&((i=(n=e.match(se))===null||n===void 0?void 0:n.length)!==null&&i!==void 0?i:0)+((l=(o=e.match(be))===null||o===void 0?void 0:o.length)!==null&&l!==void 0?l:0)>0}function We(e){typeof e=="number"&&(e=`${e}`);const n=[];let i=0;const o=e.match(be);o&&(i=o.length,e=e.replace(be,Ve),n.push(...o.map(de.parse)));const l=e.match(se);return l&&(e=e.replace(se,Qe),n.push(...l.map(ue.parse))),{values:n,numColors:i,tokenised:e}}function Ue(e){return We(e).values}function Je(e){const{values:n,numColors:i,tokenised:o}=We(e),l=n.length;return s=>{let a=o;for(let u=0;u<l;u++)a=a.replace(u<i?Ve:Qe,u<i?de.transform(s[u]):H(s[u]));return a}}const ln=e=>typeof e=="number"?0:e;function on(e){const n=Ue(e);return Je(e)(n.map(ln))}const Ye={test:rn,parse:Ue,createTransformer:Je,getAnimatableNone:on};function we(e,n,i){return i<0&&(i+=1),i>1&&(i-=1),i<1/6?e+(n-e)*6*i:i<1/2?n:i<2/3?e+(n-e)*(2/3-i)*6:e}function Xe({hue:e,saturation:n,lightness:i,alpha:o}){e/=360,n/=100,i/=100;let l=0,s=0,a=0;if(!n)l=s=a=i;else{const u=i<.5?i*(1+n):i+n-i*n,d=2*i-u;l=we(d,u,e+1/3),s=we(d,u,e),a=we(d,u,e-1/3)}return{red:Math.round(l*255),green:Math.round(s*255),blue:Math.round(a*255),alpha:o}}const an=(e,n,i)=>{const o=e*e,l=n*n;return Math.sqrt(Math.max(0,i*(l-o)+o))},sn=[Se,V,J],Ke=e=>sn.find(n=>n.test(e)),Ze=(e,n)=>{let i=Ke(e),o=Ke(n),l=i.parse(e),s=o.parse(n);i===J&&(l=Xe(l),i=V),o===J&&(s=Xe(s),o=V);const a=Object.assign({},l);return u=>{for(const d in a)d!=="alpha"&&(a[d]=an(l[d],s[d],u));return a.alpha=ge(l.alpha,s.alpha,u),i.transform(a)}},un=e=>typeof e=="number",dn=(e,n)=>i=>n(e(i)),He=(...e)=>e.reduce(dn);function et(e,n){return un(e)?i=>ge(e,n,i):de.test(e)?Ze(e,n):rt(e,n)}const tt=(e,n)=>{const i=[...e],o=i.length,l=e.map((s,a)=>et(s,n[a]));return s=>{for(let a=0;a<o;a++)i[a]=l[a](s);return i}},cn=(e,n)=>{const i=Object.assign(Object.assign({},e),n),o={};for(const l in i)e[l]!==void 0&&n[l]!==void 0&&(o[l]=et(e[l],n[l]));return l=>{for(const s in o)i[s]=o[s](l);return i}};function nt(e){const n=Ye.parse(e),i=n.length;let o=0,l=0,s=0;for(let a=0;a<i;a++)o||typeof n[a]=="number"?o++:n[a].hue!==void 0?s++:l++;return{parsed:n,numNumbers:o,numRGB:l,numHSL:s}}const rt=(e,n)=>{const i=Ye.createTransformer(n),o=nt(e),l=nt(n);return o.numHSL===l.numHSL&&o.numRGB===l.numRGB&&o.numNumbers>=l.numNumbers?He(tt(o.parsed,l.parsed),i):a=>`${a>0?n:e}`},pn=(e,n)=>i=>ge(e,n,i);function fn(e){if(typeof e=="number")return pn;if(typeof e=="string")return de.test(e)?Ze:rt;if(Array.isArray(e))return tt;if(typeof e=="object")return cn}function mn(e,n,i){const o=[],l=i||fn(e[0]),s=e.length-1;for(let a=0;a<s;a++){let u=l(e[a],e[a+1]);if(n){const d=Array.isArray(n)?n[a]:n;u=He(d,u)}o.push(u)}return o}function hn([e,n],[i]){return o=>i(Fe(e,n,o))}function xn(e,n){const i=e.length,o=i-1;return l=>{let s=0,a=!1;if(l<=e[0]?a=!0:l>=e[o]&&(s=o-1,a=!0),!a){let d=1;for(;d<i&&!(e[d]>l||d===o);d++);s=d-1}const u=Fe(e[s],e[s+1],l);return n[s](u)}}function gn(e,n,{clamp:i=!0,ease:o,mixer:l}={}){const s=e.length;Re(s===n.length),Re(!o||!Array.isArray(o)||o.length===s-1),e[0]>e[s-1]&&(e=[].concat(e),n=[].concat(n),e.reverse(),n.reverse());const a=mn(n,o,l),u=s===2?hn(e,a):xn(e,a);return i?d=>u(Ht(e[0],e[s-1],d)):u}class bn{constructor({valueRange:n,colorRange:i}){pt(this,"mapper");this.mapper=gn(n,i)}getColor(n){return this.mapper(n)}}function yn(e,n){if(e.type==="static")return e.staticColor;if(e.type==="continuous"){const i=new bn(e),o=n[e.valueField];return i.getColor(o)}return"black"}function Cn(e){return e===null?"null":e===void 0?"undefined":Array.isArray(e)?`Array(${e.length})`:e.toString()}function Sn(s){var a=s,{conf:u}=a,d=u,{content:e,size:n,color:i}=d,o=P(d,["content","size","color"]),{data:l}=a;const f=c.default.useMemo(()=>yn(i,l[0]),[i,l]),x=c.default.useMemo(()=>{var A;const{prefix:m,postfix:g,data_field:b,formatter:S}=e,v=(A=l==null?void 0:l[0])==null?void 0:A[b];return["string","number"].includes(typeof v)?[m,K.default(v).format(S),g].join(" "):Cn(v)},[e,l]);return t(r.Text,G(h({},o),{color:f,sx:{fontSize:n},children:x}))}function wn(e,n,i,o){const l={width:e,height:n,data:i,conf:o.conf};switch(o.type){case"sunburst":return t(Rt,h({},l));case"line-bar":case"cartesian":return t(Bt,h({},l));case"table":return t(Ut,h({},l));case"text":return t(Yt,h({},l));case"stats":return t(Sn,h({},l));case"bar-3d":return t(Xt,h({},l));case"pie":return t(Zt,h({},l));default:return null}}function it({viz:e,data:n,loading:i}){const{ref:o,width:l,height:s}=E.useElementSize(),a=c.default.useMemo(()=>!Array.isArray(n)||n.length===0,[n]);return i?t("div",{className:"viz-root",ref:o,children:t(r.LoadingOverlay,{visible:i,exitTransitionDuration:0})}):p("div",{className:"viz-root",ref:o,children:[a&&t(r.Text,{color:"gray",align:"center",children:"nothing to show"}),!a&&t(Ee,{children:wn(l,s,n,e)})]})}function vn({}){const{data:e,loading:n,viz:i}=c.default.useContext(M);return t(it,{viz:i,data:e,loading:n})}function Tn({label:e,required:n,value:i,onChange:o,data:l,sx:s},a){const u=c.default.useMemo(()=>!Array.isArray(l)||l.length===0?[]:Object.keys(l[0]).map(f=>({label:f,value:f})),[l]);return t(r.Select,{ref:a,label:e,data:u,value:i,onChange:o,required:n,sx:s})}const L=c.default.forwardRef(Tn);function Gn({conf:e,setConf:n,data:i}){const o=z.default.assign({},{x_axis_data_key:"x",y_axis_data_key:"y",z_axis_data_key:"z",xAxis3D:{type:"value",name:"X Axis Name"},yAxis3D:{type:"value",name:"Y Axis Name"},zAxis3D:{type:"value",name:"Z Axis Name"}},e),{control:l,handleSubmit:s,formState:a}=w.useForm({defaultValues:o});return t(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,children:p("form",{onSubmit:s(n),children:[t(r.Text,{children:"X Axis"}),p(r.Group,{position:"apart",grow:!0,p:"md",sx:{position:"relative",border:"1px solid #eee"},children:[t(w.Controller,{name:"x_axis_data_key",control:l,render:({field:u})=>t(L,h({label:"Data Field",required:!0,data:i},u))}),t(w.Controller,{name:"xAxis3D.name",control:l,render:({field:u})=>t(r.TextInput,h({sx:{flexGrow:1},size:"md",label:"Name"},u))})]}),t(r.Text,{mt:"lg",children:"Y Axis"}),p(r.Group,{position:"apart",grow:!0,p:"md",sx:{position:"relative",border:"1px solid #eee"},children:[t(w.Controller,{name:"y_axis_data_key",control:l,render:({field:u})=>t(L,h({label:"Data Field",required:!0,data:i},u))}),t(w.Controller,{name:"yAxis3D.name",control:l,render:({field:u})=>t(r.TextInput,h({sx:{flexGrow:1},size:"md",label:"Name"},u))})]}),t(r.Text,{mt:"lg",children:"Z Axis"}),p(r.Group,{position:"apart",grow:!0,p:"md",sx:{position:"relative",border:"1px solid #eee"},children:[t(w.Controller,{name:"z_axis_data_key",control:l,render:({field:u})=>t(L,h({label:"Data Field",required:!0,data:i},u))}),t(w.Controller,{name:"zAxis3D.name",control:l,render:({field:u})=>t(r.TextInput,h({sx:{flexGrow:1},size:"md",label:"Name"},u))})]}),t(r.Group,{position:"center",mt:"xl",grow:!0,sx:{width:"60%"},mx:"auto",children:p(r.Button,{color:"blue",type:"submit",children:[t(C.DeviceFloppy,{size:20}),t(r.Text,{ml:"md",children:"Save"})]})})]})})}function _n({value:e,onChange:n},i){const o=r.useMantineTheme(),l=c.default.useMemo(()=>Object.entries(o.colors).map(([a,u])=>({label:a,value:u[6]})),[o]),s=c.default.useMemo(()=>l.some(a=>a.value===e),[e,l]);return p(r.Group,{position:"apart",spacing:"xs",children:[t(r.TextInput,{placeholder:"Set any color",value:s?"":e,onChange:a=>n(a.currentTarget.value),rightSection:t(r.ColorSwatch,{color:s?"transparent":e,radius:4}),variant:s?"filled":"default",sx:{maxWidth:"100%",flexGrow:1}}),t(r.Text,{sx:{flexGrow:0},children:"or"}),t(r.Select,{data:l,value:e,onChange:n,variant:s?"default":"filled",placeholder:"Pick a theme color",icon:t(r.ColorSwatch,{color:s?e:"transparent",radius:4}),sx:{maxWidth:"100%",flexGrow:1}})]})}const ve=c.default.forwardRef(_n),zn=[{label:"off",value:""},{label:"top",value:"top"},{label:"left",value:"left"},{label:"right",value:"right"},{label:"bottom",value:"bottom"},{label:"inside",value:"inside"},{label:"insideLeft",value:"insideLeft"},{label:"insideRight",value:"insideRight"},{label:"insideTop",value:"insideTop"},{label:"insideBottom",value:"insideBottom"},{label:"insideTopLeft",value:"insideTopLeft"},{label:"insideBottomLeft",value:"insideBottomLeft"},{label:"insideTopRight",value:"insideTopRight"},{label:"insideBottomRight",value:"insideBottomRight"}];function Pn({control:e,index:n,remove:i,seriesItem:o,yAxisOptions:l,data:s}){const a=o.type;return p(r.Group,{direction:"column",grow:!0,my:0,p:"md",pr:40,sx:{border:"1px solid #eee",position:"relative"},children:[t(r.Group,{direction:"column",grow:!0,noWrap:!0,children:t(w.Controller,{name:`series.${n}.type`,control:e,render:({field:u})=>t(r.SegmentedControl,h({data:[{label:"Line",value:"line"},{label:"Bar",value:"bar"},{label:"Scatter",value:"scatter",disabled:!0},{label:"Boxplot",value:"boxplot",disabled:!0}]},u))})}),t(w.Controller,{name:`series.${n}.name`,control:e,render:({field:u})=>t(r.TextInput,h({label:"Name",required:!0,sx:{flex:1}},u))}),p(r.Group,{direction:"row",grow:!0,noWrap:!0,children:[t(w.Controller,{name:`series.${n}.y_axis_data_key`,control:e,render:({field:u})=>t(L,h({label:"Value Field",required:!0,data:s,sx:{flex:1}},u))}),t(w.Controller,{name:`series.${n}.yAxisIndex`,control:e,render:x=>{var{field:m}=x,g=m,{value:u,onChange:d}=g,f=P(g,["value","onChange"]);var b;return t(r.Select,G(h({label:"Y Axis",data:l,disabled:l.length===0},f),{value:(b=u==null?void 0:u.toString())!=null?b:"",onChange:S=>{if(!S){d(0);return}d(Number(S))},sx:{flex:1}}))}})]}),a==="bar"&&p(r.Group,{direction:"row",grow:!0,align:"top",children:[t(w.Controller,{name:`series.${n}.stack`,control:e,render:({field:u})=>t(r.TextInput,h({label:"Stack",placeholder:"Stack bars by this ID",sx:{flexGrow:1}},u))}),t(w.Controller,{name:`series.${n}.barWidth`,control:e,render:({field:u})=>t(r.TextInput,h({label:"Bar Width",sx:{flexGrow:1}},u))})]}),t(w.Controller,{name:`series.${n}.label_position`,control:e,render:({field:u})=>t(r.Select,h({label:"Label Position",data:zn},u))}),p(r.Group,{direction:"column",grow:!0,spacing:4,children:[t(r.Text,{size:"sm",children:"Color"}),t(w.Controller,{name:`series.${n}.color`,control:e,render:({field:u})=>t(ve,h({},u))})]}),t(r.ActionIcon,{color:"red",variant:"hover",onClick:()=>i(n),sx:{position:"absolute",top:15,right:5},children:t(C.Trash,{size:16})})]},n)}function In({control:e,watch:n,getValues:i,data:o}){const{fields:l,append:s,remove:a}=w.useFieldArray({control:e,name:"series"}),u=n("y_axes"),d=l.map((m,g)=>h(h({},m),u[g])),f=()=>s({type:"bar",name:E.randomId(),showSymbol:!1,y_axis_data_key:"value",yAxisIndex:0,label_position:"top",stack:"",color:"#000"}),x=c.default.useMemo(()=>i().y_axes.map(({name:m},g)=>({label:m,value:g.toString()})),[i]);return p(r.Group,{direction:"column",grow:!0,children:[t(r.Text,{mt:"xl",mb:0,children:"Series"}),d.map((m,g)=>t(Pn,{control:e,index:g,remove:a,seriesItem:m,yAxisOptions:x,data:o})),t(r.Group,{position:"center",mt:"xs",children:t(r.Button,{onClick:f,children:"Add a Series"})})]})}const lt={mantissa:0,output:"number"};function Ln({value:e,onChange:n},i){const o=a=>{n(G(h({},e),{output:a}))},l=a=>{const u=a===0?!1:e.trimMantissa;n(G(h({},e),{mantissa:a,trimMantissa:u}))},s=a=>{n(G(h({},e),{trimMantissa:a.currentTarget.checked}))};return t(r.Group,{direction:"column",grow:!0,noWrap:!0,ref:i,children:p(r.Group,{direction:"row",grow:!0,children:[t(r.Select,{label:"Format",data:[{label:"1234",value:"number"},{label:"99%",value:"percent"}],value:e.output,onChange:o}),t(r.NumberInput,{label:"Mantissa",defaultValue:0,min:0,step:1,max:4,value:e.mantissa,onChange:l}),t(r.Switch,{label:"Trim mantissa",checked:e.trimMantissa,onChange:s,disabled:e.mantissa===0})]})})}const ot=c.default.forwardRef(Ln);function An({control:e,index:n,remove:i}){return p(r.Group,{direction:"column",grow:!0,my:0,p:"md",pr:40,sx:{border:"1px solid #eee",position:"relative"},children:[t(r.Group,{direction:"row",grow:!0,noWrap:!0,children:t(w.Controller,{name:`y_axes.${n}.name`,control:e,render:({field:o})=>t(r.TextInput,h({label:"Name",required:!0,sx:{flex:1}},o))})}),t(r.Group,{direction:"column",grow:!0,noWrap:!0,children:t(w.Controller,{name:`y_axes.${n}.label_formatter`,control:e,render:({field:o})=>t(ot,h({},o))})}),t(r.ActionIcon,{color:"red",variant:"hover",onClick:()=>i(n),sx:{position:"absolute",top:15,right:5},disabled:n===0,children:t(C.Trash,{size:16})})]},n)}function Dn({control:e,watch:n}){const{fields:i,append:o,remove:l}=w.useFieldArray({control:e,name:"y_axes"}),s=n("y_axes"),a=i.map((d,f)=>h(h({},d),s[f])),u=()=>o({name:"",label_formatter:lt});return p(r.Group,{direction:"column",grow:!0,children:[t(r.Text,{mt:"xl",mb:0,children:"Y Axes"}),a.map((d,f)=>t(An,{control:e,index:f,remove:l})),t(r.Group,{position:"center",mt:"xs",children:t(r.Button,{onClick:u,children:"Add a Y Axis"})})]})}function Mn(e){function n({type:i,name:o,showSymbol:l,y_axis_data_key:s="value",yAxisIndex:a=0,label_position:u="top",stack:d="1",color:f="black",barWidth:x="30"}){return{type:i,name:o,showSymbol:l,y_axis_data_key:s,yAxisIndex:a,label_position:u,stack:d,color:f,barWidth:x}}return e.map(n)}function qn({conf:e,setConf:n,data:i}){const g=e,{series:o,y_axes:l}=g,s=P(g,["series","y_axes"]),a=c.default.useMemo(()=>{const v=s,{x_axis_name:b=""}=v,S=P(v,["x_axis_name"]);return h({series:Mn(o!=null?o:[]),x_axis_name:b,y_axes:l!=null?l:[{name:"Y Axis",label_formatter:lt}]},S)},[o,s]);c.default.useEffect(()=>{!z.default.isEqual(e,a)&&n(a)},[e,a]);const{control:u,handleSubmit:d,watch:f,formState:{isDirty:x},getValues:m}=w.useForm({defaultValues:a});return t(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,children:p("form",{onSubmit:d(n),children:[p(r.Group,{position:"apart",mb:"lg",sx:{position:"relative"},children:[t(r.Text,{children:"Chart Config"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",disabled:!x,children:t(C.DeviceFloppy,{size:20})})]}),p(r.Group,{direction:"column",grow:!0,noWrap:!0,mb:"lg",children:[t(w.Controller,{name:"x_axis_data_key",control:u,render:({field:b})=>t(L,h({label:"X Axis Data Field",required:!0,data:i,sx:{flex:1}},b))}),t(w.Controller,{name:"x_axis_name",control:u,render:({field:b})=>t(r.TextInput,h({label:"X Axis Name"},b))})]}),t(Dn,{control:u,watch:f}),t(In,{control:u,watch:f,getValues:m,data:i})]})})}function On({conf:{label_field:e,value_field:n},setConf:i,data:o}){const l=$.useForm({initialValues:{label_field:e,value_field:n}});return t(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,children:p("form",{onSubmit:l.onSubmit(i),children:[p(r.Group,{position:"apart",mb:"lg",sx:{position:"relative"},children:[t(r.Text,{children:"Pie Config"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",children:t(C.DeviceFloppy,{size:20})})]}),p(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,p:"md",mb:"sm",sx:{border:"1px solid #eee",borderRadius:"5px"},children:[t(L,h({label:"Label Field",required:!0,data:o},l.getInputProps("label_field"))),t(L,h({label:"Value Field",required:!0,data:o},l.getInputProps("value_field")))]})]})})}const ce=[{label:"initial",value:0},{label:"500",value:25},{label:"700",value:50},{label:"semibold",value:75},{label:"bold",value:100}];function kn({label:e,value:n,onChange:i},o){var a,u;const[l,s]=c.default.useState((u=(a=ce.find(d=>d.label===n))==null?void 0:a.value)!=null?u:ce[0].value);return c.default.useEffect(()=>{const d=ce.find(f=>f.value===l);d&&i(d.label)},[l]),p(r.Group,{direction:"column",grow:!0,spacing:"xs",mb:"lg",children:[t(r.Text,{children:e}),t(r.Slider,{label:null,marks:ce,value:l,onChange:s,step:25,placeholder:"Pick a font size",ref:o})]})}const at=c.default.forwardRef(kn);function En({label:e,value:n,onChange:i},o){const[l,s]=c.default.useState(Array.isArray(n)?[...n]:[]),a=c.default.useCallback(()=>{s(x=>[...x,""])},[s]),u=c.default.useCallback(x=>{s(m=>(m.splice(x,1),[...m]))},[s]),d=c.default.useMemo(()=>!z.default.isEqual(l,n),[l,n]),f=()=>{i(l.map(x=>x.toString()))};return p(Z,{children:[p(r.Group,{position:"left",ref:o,children:[t(r.Text,{children:e}),t(r.ActionIcon,{mr:5,variant:"filled",color:"blue",disabled:!d,onClick:f,children:t(C.DeviceFloppy,{size:20})})]}),p(r.Group,{children:[l.map((x,m)=>t(r.TextInput,{value:x,onChange:g=>{const b=g.currentTarget.value;s(S=>(S.splice(m,1,b),[...S]))},rightSection:t(r.ActionIcon,{onClick:()=>u(m),color:"red",children:t(C.Trash,{size:14})}),sx:{width:"45%"}})),t(r.ActionIcon,{onClick:a,color:"blue",variant:"outline",children:t(C.PlaylistAdd,{size:20})})]})]})}const $n=c.default.forwardRef(En);function Rn({label:e,value:n,onChange:i},o){const[l,s]=c.default.useState(Array.isArray(n)?[...n]:[]),a=c.default.useCallback(()=>{s(g=>[...g,""])},[s]),u=c.default.useCallback(g=>{s(b=>(b.splice(g,1),[...b]))},[s]),d=c.default.useMemo(()=>!z.default.isEqual(l,n),[l,n]),f=()=>{i(l.map(g=>g.toString()))},x=r.useMantineTheme(),m=c.default.useMemo(()=>Object.entries(x.colors).map(([g,b])=>b[6]),[x]);return p(Z,{children:[p(r.Group,{position:"left",ref:o,children:[t(r.Text,{children:e}),t(r.ActionIcon,{mr:5,variant:"filled",color:"blue",disabled:!d,onClick:f,children:t(C.DeviceFloppy,{size:20})})]}),p(r.Group,{children:[l.map((g,b)=>t(r.ColorInput,{value:g,onChange:S=>{s(v=>(v.splice(b,1,S),[...v]))},swatches:m,rightSection:t(r.ActionIcon,{onClick:()=>u(b),color:"red",children:t(C.Trash,{size:14})}),sx:{width:"45%"}})),t(r.ActionIcon,{onClick:a,color:"blue",variant:"outline",children:t(C.PlaylistAdd,{size:20})})]})]})}const Fn=c.default.forwardRef(Rn);function Bn({conf:e,setConf:n,data:i}){const o=z.default.merge({},{align:"center",size:"100px",weight:"bold",color:{type:"static",staticColor:"red"},content:{prefix:"",data_field:"",formatter:{output:"number",mantissa:0},postfix:""}},e),{control:l,handleSubmit:s,watch:a,formState:{isDirty:u}}=w.useForm({defaultValues:o}),d=a("color.type");return a("color.valueField"),t(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,noWrap:!0,children:p("form",{onSubmit:s(n),children:[p(r.Group,{position:"left",py:"md",pl:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef"},children:[t(r.Text,{weight:500,children:"Stats Configurations"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",disabled:!u,children:t(C.DeviceFloppy,{size:20})})]}),p(r.Accordion,{offsetIcon:!1,multiple:!0,initialState:{0:!0,2:!0},children:[t(r.Accordion.Item,{label:"Content",children:p(r.Group,{direction:"column",grow:!0,children:[p(r.Group,{direction:"row",grow:!0,noWrap:!0,children:[t(w.Controller,{name:"content.prefix",control:l,render:({field:f})=>t(r.TextInput,h({label:"Prefix",sx:{flexGrow:1}},f))}),t(w.Controller,{name:"content.data_field",control:l,render:({field:f})=>t(L,h({label:"Data Field",required:!0,data:i},f))}),t(w.Controller,{name:"content.postfix",control:l,render:({field:f})=>t(r.TextInput,h({label:"Postfix",sx:{flexGrow:1}},f))})]}),t(w.Controller,{name:"content.formatter",control:l,render:({field:f})=>t(ot,h({},f))})]})}),p(r.Accordion.Item,{label:"Font",children:[t(r.Group,{direction:"column",grow:!0,children:t(w.Controller,{name:"size",control:l,render:({field:f})=>t(r.TextInput,h({label:"Font Size",placeholder:"10px, 1em, 1rem, 100%...",sx:{flex:1}},f))})}),t(r.Group,{position:"apart",grow:!0,sx:{"> *":{flexGrow:1,maxWidth:"100%"}},children:t(w.Controller,{name:"weight",control:l,render:({field:f})=>t(at,h({label:"Font Weight"},f))})})]}),t(r.Accordion.Item,{label:"Color",children:p(r.Group,{direction:"column",grow:!0,children:[t(w.Controller,{name:"color.type",control:l,render:({field:f})=>t(r.Select,h({label:"Color Type",data:[{label:"Static Color",value:"static"},{label:"Continuous Color",value:"continuous"}]},f))}),d==="static"&&t(w.Controller,{name:"color.staticColor",control:l,render:({field:f})=>t(ve,h({},f))}),d==="continuous"&&p(Z,{children:[t(w.Controller,{name:"color.valueField",control:l,defaultValue:"",render:({field:f})=>t(r.TextInput,h({placeholder:"Calculate color with this field",label:"Value Field",required:!0,sx:{flex:1}},f))}),t(w.Controller,{name:"color.valueRange",control:l,render:({field:f})=>t($n,h({label:"Value Range"},f))}),t(w.Controller,{name:"color.colorRange",control:l,render:({field:f})=>t(Fn,h({label:"Color Range"},f))})]})]})})]})]})})}function jn({conf:{label_field:e,value_field:n},setConf:i,data:o}){const l=$.useForm({initialValues:{label_field:e,value_field:n}});return t(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,children:p("form",{onSubmit:l.onSubmit(i),children:[p(r.Group,{position:"apart",mb:"lg",sx:{position:"relative"},children:[t(r.Text,{children:"Sunburst Config"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",children:t(C.DeviceFloppy,{size:20})})]}),p(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,p:"md",mb:"sm",sx:{border:"1px solid #eee",borderRadius:"5px"},children:[t(L,h({label:"Label Field",required:!0,data:o},l.getInputProps("label_field"))),t(L,h({label:"Value Field",required:!0,data:o},l.getInputProps("value_field")))]})]})})}const Nn=Object.values(N).map(e=>({label:e,value:e}));function Vn({label:e,value:n,onChange:i,sx:o}){return t(r.Select,{label:e,data:Nn,value:n,onChange:i,sx:o})}function Qn(l){var s=l,{conf:a}=s,u=a,{columns:e}=u,n=P(u,["columns"]),{setConf:i,data:o}=s;const d=$.useForm({initialValues:h({id_field:"id",use_raw_columns:!0,columns:$.formList(e!=null?e:[]),fontSize:"sm",horizontalSpacing:"sm",verticalSpacing:"sm",striped:!1,highlightOnHover:!1},n)}),f=()=>d.addListItem("columns",{label:E.randomId(),value_field:"value",value_type:N.string});return t(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,children:p("form",{onSubmit:d.onSubmit(i),children:[p(r.Group,{position:"apart",mb:"lg",sx:{position:"relative"},children:[t(r.Text,{children:"Table Config"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",children:t(C.DeviceFloppy,{size:20})})]}),p(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,p:"md",mb:"sm",sx:{border:"1px solid #eee",borderRadius:"5px"},children:[t(L,h({label:"ID Field",required:!0,data:o},d.getInputProps("id_field"))),p(r.Group,{position:"apart",mb:"lg",grow:!0,sx:{"> *":{flexGrow:1}},children:[t(r.TextInput,h({label:"Horizontal Spacing",placeholder:"10px, 1em, 1rem, 100%...",required:!0,sx:{flex:1}},d.getInputProps("horizontalSpacing"))),t(r.TextInput,h({label:"Vertical Spacing",placeholder:"10px, 1em, 1rem, 100%...",required:!0,sx:{flex:1}},d.getInputProps("verticalSpacing")))]}),t(r.Group,{position:"apart",mb:"lg",grow:!0,sx:{"> *":{flexGrow:1}},children:t(r.TextInput,h({label:"Font Size",placeholder:"10px, 1em, 1rem, 100%...",required:!0,sx:{flex:1}},d.getInputProps("fontSize")))}),p(r.Group,{direction:"column",grow:!0,children:[t(r.Text,{children:"Other"}),p(r.Group,{position:"apart",grow:!0,children:[t(r.Switch,h({label:"Striped"},d.getInputProps("striped",{type:"checkbox"}))),t(r.Switch,h({label:"Highlight on hover"},d.getInputProps("highlightOnHover",{type:"checkbox"})))]})]})]}),p(r.Group,{direction:"column",mt:"xs",spacing:"xs",grow:!0,p:"md",mb:"xl",sx:{border:"1px solid #eee",borderRadius:"5px"},children:[t(r.Switch,h({label:"Use Original Data Columns"},d.getInputProps("use_raw_columns",{type:"checkbox"}))),!d.values.use_raw_columns&&p(r.Group,{direction:"column",grow:!0,children:[t(r.Text,{mt:"xl",mb:0,children:"Custom Columns"}),d.values.columns.map((x,m)=>p(r.Group,{direction:"column",grow:!0,my:0,p:"md",pr:40,sx:{border:"1px solid #eee",position:"relative"},children:[p(r.Group,{position:"apart",grow:!0,children:[t(r.TextInput,h({label:"Label",required:!0,sx:{flex:1}},d.getListInputProps("columns",m,"label"))),t(L,h({label:"Value Field",required:!0,data:o},d.getListInputProps("columns",m,"value_field"))),t(Vn,h({label:"Value Type",sx:{flex:1}},d.getListInputProps("columns",m,"value_type")))]}),t(r.ActionIcon,{color:"red",variant:"hover",onClick:()=>d.removeListItem("columns",m),sx:{position:"absolute",top:15,right:5},children:t(C.Trash,{size:16})})]},m)),t(r.Group,{position:"center",mt:"xs",children:t(r.Button,{onClick:f,children:"Add a Column"})})]})]}),t(r.Text,{weight:500,mb:"md",children:"Current Configuration:"}),t(k.Prism,{language:"json",colorScheme:"dark",noCopy:!0,children:JSON.stringify(d.values,null,2)})]})})}const st=[{align:"center",size:"xl",weight:"bold",color:"black",template:"Time: ${new Date().toISOString()}"},{align:"center",size:"md",weight:"bold",color:"red",template:"Platform: ${navigator.userAgentData.platform}."}];function Wn({conf:e,setConf:n}){var l;const i=$.useForm({initialValues:{paragraphs:$.formList((l=e.paragraphs)!=null?l:st)}}),o=()=>i.addListItem("paragraphs",G(h({},st[0]),{template:E.randomId()}));return t(r.Group,{direction:"column",mt:"md",spacing:"xs",grow:!0,children:p("form",{onSubmit:i.onSubmit(n),children:[i.values.paragraphs.length===0&&t(r.Text,{color:"dimmed",align:"center",children:"Empty"}),p(r.Group,{position:"apart",mb:"xs",sx:{" + .mantine-Group-root":{marginTop:0}},children:[t(r.Text,{children:"Paragraphs"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",children:t(C.DeviceFloppy,{size:20})})]}),i.values.paragraphs.map((s,a)=>p(r.Group,{direction:"column",grow:!0,my:0,p:"md",pr:40,sx:{border:"1px solid #eee",position:"relative"},children:[t(r.TextInput,h({placeholder:"Time: ${new Date().toISOString()}",label:"Content Template",required:!0,sx:{flex:1}},i.getListInputProps("paragraphs",a,"template"))),p(r.Group,{direction:"column",grow:!0,children:[t(r.Text,{children:"Color"}),t(ve,h({},i.getListInputProps("paragraphs",a,"color")))]}),t(r.Group,{direction:"column",grow:!0,children:t(r.TextInput,h({label:"Font Size",placeholder:"10px, 1em, 1rem, 100%...",sx:{flex:1}},i.getListInputProps("paragraphs",a,"size")))}),t(r.Group,{position:"apart",grow:!0,sx:{"> *":{flexGrow:1,maxWidth:"100%"}},children:t(at,h({label:"Font Weight"},i.getListInputProps("paragraphs",a,"weight")))}),t(r.ActionIcon,{color:"red",variant:"hover",onClick:()=>i.removeListItem("paragraphs",a),sx:{position:"absolute",top:15,right:5},children:t(C.Trash,{size:16})})]},a)),t(r.Group,{position:"center",mt:"md",children:t(r.Button,{onClick:o,children:"Add a Paragraph"})}),t(r.Text,{size:"sm",weight:500,mt:"md",children:"Current Configuration:"}),t(k.Prism,{language:"json",colorScheme:"dark",noCopy:!0,children:JSON.stringify(i.values,null,2)})]})})}const Te=[{value:"text",label:"Text",Panel:Wn},{value:"stats",label:"Stats",Panel:Bn},{value:"table",label:"Table",Panel:Qn},{value:"sunburst",label:"Sunburst",Panel:jn},{value:"bar-3d",label:"Bar Chart (3D)",Panel:Gn},{value:"cartesian",label:"Cartesian Chart",Panel:qn},{value:"pie",label:"Pie Chart",Panel:On}];function Un(){const{data:e,viz:n,setViz:i}=c.default.useContext(M),[o,l]=E.useInputState(n.type),s=n.type!==o,a=c.default.useCallback(()=>{!s||i(x=>G(h({},x),{type:o}))},[s,o]),u=x=>{i(m=>G(h({},m),{conf:x}))},d=x=>{try{u(JSON.parse(x))}catch(m){console.error(m)}},f=c.default.useMemo(()=>{var x;return(x=Te.find(m=>m.value===o))==null?void 0:x.Panel},[o,Te]);return p(Z,{children:[t(r.Select,{label:"Visualization",value:o,onChange:l,data:Te,rightSection:t(r.ActionIcon,{disabled:!s,onClick:a,children:t(C.DeviceFloppy,{size:20})})}),f&&t(f,{conf:n.conf,setConf:u,data:e}),!f&&t(r.JsonInput,{minRows:20,label:"Config",value:JSON.stringify(n.conf,null,2),onChange:d})]})}function Jn({}){return p(r.Group,{direction:"row",grow:!0,noWrap:!0,align:"stretch",sx:{height:"100%"},children:[t(r.Group,{grow:!0,direction:"column",noWrap:!0,sx:{width:"40%",flexShrink:0,flexGrow:0},children:t(Un,{})}),t(r.Box,{sx:{height:"100%",flexGrow:1,maxWidth:"60%"},children:t(vn,{})})]})}function Yn({opened:e,close:n}){const{freezeLayout:i}=c.default.useContext(j),{data:o,loading:l,viz:s,title:a}=c.default.useContext(M);return c.default.useEffect(()=>{i(e)},[e]),t(r.Modal,{size:"96vw",overflow:"inside",opened:e,onClose:n,title:a,trapFocus:!0,onDragStart:u=>{u.stopPropagation()},children:t(r.AppShell,{sx:{height:"90vh",maxHeight:"calc(100vh - 185px)",".mantine-AppShell-body":{height:"100%"},main:{height:"100%",width:"100%"}},padding:"md",children:p(r.Tabs,{initialTab:2,children:[p(r.Tabs.Tab,{label:"Data",children:[t(r.LoadingOverlay,{visible:l,exitTransitionDuration:0}),t(Et,{})]}),t(r.Tabs.Tab,{label:"Panel",children:t(kt,{})}),t(r.Tabs.Tab,{label:"Visualization",children:t(Jn,{})})]})})})}var Tr="";function Xn({}){const[e,n]=c.default.useState(!1),i=()=>n(!0),o=()=>n(!1),{title:l,refreshData:s}=c.default.useContext(M),{inEditMode:a}=c.default.useContext(j);return p(r.Box,{sx:{position:"relative"},children:[t(r.Box,{sx:{position:"absolute",left:0,top:0,height:28},children:t(ke,{})}),t(r.Group,{grow:!0,position:"center",px:20,className:"panel-title-wrapper",sx:{flexGrow:1},children:p(r.Menu,{control:t(r.Text,{lineClamp:1,weight:"bold",children:l}),placement:"center",children:[t(r.Menu.Item,{onClick:s,icon:t(C.Refresh,{size:14}),children:"Refresh"}),a&&t(r.Menu.Item,{onClick:i,icon:t(C.Settings,{size:14}),children:"Settings"}),t(r.Divider,{}),t(r.Menu.Item,{color:"red",disabled:!0,icon:t(C.Trash,{size:14}),children:"Delete"})]})}),a&&t(Yn,{opened:e,close:o})]})}var Gr="";function Ge({viz:e,queryID:n,title:i,description:o,update:l,layout:s,id:a}){const u=c.default.useContext(R),d=c.default.useContext(q),[f,x]=c.default.useState(i),[m,g]=c.default.useState(o),[b,S]=c.default.useState(n),[v,O]=c.default.useState(e),A=c.default.useMemo(()=>{if(!!b)return d.queries.find(Pe=>Pe.id===b)},[b,d.queries]);c.default.useEffect(()=>{l==null||l({id:a,layout:s,title:f,description:m,queryID:b,viz:v})},[f,m,A,v,a,s,b]);const{data:X=[],loading:pe,refresh:ne}=he.useRequest(Me({context:u,definitions:d,title:f,query:A}),{refreshDeps:[u,d,A]}),ze=ne;return t(M.Provider,{value:{data:X,loading:pe,title:f,setTitle:x,description:m,setDescription:g,queryID:b,setQueryID:S,viz:v,setViz:O,refreshData:ze},children:p(r.Container,{className:"panel-root",children:[t(Xn,{}),t(it,{viz:v,data:X,loading:pe})]})})}var _r="";const Kn=I.WidthProvider(Ae.default);function ut({panels:e,setPanels:n,className:i="layout",rowHeight:o=10,onRemoveItem:l,isDraggable:s,isResizable:a}){const u=c.default.useCallback(d=>{const f=new Map;d.forEach(b=>{var S=b,{i:m}=S,g=P(S,["i"]);f.set(m,g)});const x=e.map(m=>G(h({},m),{layout:f.get(m.id)}));n(x)},[e,n]);return t(Kn,{onLayoutChange:u,className:i,rowHeight:o,isDraggable:s,isResizable:a,children:e.map((m,x)=>{var g=m,{id:d}=g,f=P(g,["id"]);return t("div",{"data-grid":f.layout,children:t(Ge,G(h({id:d},f),{destroy:()=>l(d),update:b=>{n(S=>(S.splice(x,1,b),[...S]))}}))},d)})})}function _e(e,n){return p(r.Text,{sx:{svg:{verticalAlign:"text-bottom"}},children:[e," ",n]})}function Zn({mode:e,setMode:n}){return t(r.SegmentedControl,{value:e,onChange:n,data:[{label:_e(t(C.PlayerPlay,{size:20}),"Use"),value:D.Use},{label:_e(t(C.Resize,{size:20}),"Layout"),value:D.Layout},{label:_e(t(C.Paint,{size:20}),"Content"),value:D.Edit}]})}const Hn=`
 -- You may reference context data or SQL snippets *by name*
 -- in SQL or VizConfig.
 SELECT *
@@ -18,16 +18,16 @@ WHERE
   -- SQL snippets
   AND \${author_email_condition}
   \${order_by_clause}
-`;function er({}){const e=c.default.useContext(R),{sqlSnippets:n}=c.default.useContext(O),i=c.default.useMemo(()=>{const o=n.reduce((s,a)=>(s[a.key]=a.value,s),{});return JSON.stringify(o,null,2)},[n]),l=c.default.useMemo(()=>JSON.stringify(e,null,2),[e]);return p(r.Group,{direction:"column",grow:!0,sx:{border:"1px solid #eee",maxWidth:"40%",overflow:"hidden"},children:[t(r.Group,{position:"left",pl:"md",py:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef",flexGrow:0},children:t(r.Text,{weight:500,children:"Context"})}),p(r.Group,{direction:"column",px:"md",pb:"md",sx:{width:"100%"},children:[t(q.Prism,{language:"sql",sx:{width:"100%"},noCopy:!0,colorScheme:"dark",children:Hn}),t(r.Text,{weight:500,sx:{flexGrow:0},children:"Avaiable context"}),t(q.Prism,{language:"json",sx:{width:"100%"},noCopy:!0,colorScheme:"dark",children:l}),t(r.Text,{weight:500,sx:{flexGrow:0},children:"Avaiable SQL Snippets"}),t(q.Prism,{language:"json",sx:{width:"100%"},noCopy:!0,colorScheme:"dark",children:i})]})]})}function tr({value:e}){const n=c.default.useContext(R),i=c.default.useContext(O),l=c.default.useMemo(()=>wt(e,n,i),[e,n,i]);return t(q.Prism,{language:"sql",colorScheme:"light",children:l})}function nr({value:e,onChange:n}){const i=$.useForm({initialValues:e}),l=c.default.useCallback(f=>{n(f)},[n]),o=c.default.useMemo(()=>!D.default.isEqual(e,i.values),[e,i.values]);c.default.useEffect(()=>{i.reset()},[e]);const{data:s={},loading:a}=he.useRequest(vt,{refreshDeps:[]},[]),u=c.default.useMemo(()=>Object.keys(s).map(f=>({label:f,value:f})),[s]),d=c.default.useMemo(()=>{const f=s[i.values.type];return f?f.map(x=>({label:x,value:x})):[]},[s,i.values.type]);return t(r.Group,{direction:"column",grow:!0,sx:{border:"1px solid #eee",flexGrow:1},children:p("form",{onSubmit:i.onSubmit(l),children:[p(r.Group,{position:"left",py:"md",pl:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef"},children:[t(r.Text,{weight:500,children:"Data Source Configuration"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",disabled:!o||a,children:t(S.DeviceFloppy,{size:20})})]}),p(r.Group,{direction:"column",grow:!0,my:0,p:"md",pr:40,children:[p(r.Group,{grow:!0,children:[t(r.TextInput,h({placeholder:"An ID unique in this dashboard",label:"ID",required:!0,sx:{flex:1},disabled:a},i.getInputProps("id"))),t(r.Select,h({label:"Data Source Type",data:u,sx:{flex:1},disabled:a},i.getInputProps("type"))),t(r.Select,h({label:"Data Source Key",data:d,sx:{flex:1},disabled:a},i.getInputProps("key")))]}),p(r.Tabs,{children:[t(r.Tabs.Tab,{label:"SQL",children:t(r.Textarea,G(h({autosize:!0,minRows:12,maxRows:24},i.getInputProps("sql")),{className:"code-textarea"}))}),t(r.Tabs.Tab,{label:"Preview",children:t(tr,{value:i.values.sql})})]})]})]})})}function rr({id:e,setID:n}){const{dataSources:i,setDataSources:l}=c.default.useContext(O),o=c.default.useMemo(()=>i.find(a=>a.id===e),[i,e]),s=c.default.useCallback(a=>{if(i.findIndex(d=>d.id===e)===-1){console.error(new Error("Invalid data source id when updating by id"));return}l(d=>{const f=d.findIndex(x=>x.id===e);return d.splice(f,1,a),[...d]}),n(a.id)},[e,i,l,n]);return e?o?t(nr,{value:o,onChange:s}):t("span",{children:"Invalid Data Source ID"}):null}function ir({id:e,setID:n}){const{dataSources:i,setDataSources:l}=c.default.useContext(O),o=c.default.useCallback(()=>{var u,d;n((d=(u=i[0])==null?void 0:u.id)!=null?d:"")},[n,i]);c.default.useEffect(()=>{if(!e){o();return}i.findIndex(d=>d.id===e)===-1&&o()},[e,i,o]);const s=c.default.useMemo(()=>i.map(u=>({value:u.id,label:u.id})),[i]),a=c.default.useCallback(()=>{const u={id:E.randomId(),type:"postgresql",key:"",sql:""};l(d=>[...d,u]),n(u.id)},[l,n]);return t(r.Group,{pb:"xl",children:p(r.Group,{position:"left",sx:{maxWidth:"600px",alignItems:"baseline"},children:[t(r.Text,{children:"Select a Data Source"}),t(r.Select,{data:s,value:e,onChange:n,allowDeselect:!1,clearable:!1,sx:{flexGrow:1}}),t(r.Text,{children:"or"}),t(r.Group,{position:"center",mt:"md",children:t(r.Button,{onClick:a,children:"Add a Data Source"})})]})})}function or({}){const[e,n]=c.default.useState("");return p(r.AppShell,{sx:{height:"90vh",maxHeight:"calc(100vh - 225px)",".mantine-AppShell-body":{height:"100%"},main:{height:"100%",width:"100%",padding:0,margin:0}},padding:"md",children:[p(r.Group,{direction:"row",position:"apart",grow:!0,align:"stretch",noWrap:!0,children:[p(r.Group,{direction:"column",grow:!0,sx:{flexGrow:1,maxWidth:"calc(60% - 16px)"},children:[t(ir,{id:e,setID:n}),t(rr,{id:e,setID:n})]}),t(er,{})]}),t($e,{id:e})]})}function lr({}){const e=c.default.useContext(R),n="SELECT *\nFROM commit\nWHERE author_time BETWEEN '${timeRange?.[0].toISOString()}' AND '${timeRange?.[1].toISOString()}'";return p(r.Group,{direction:"column",grow:!0,sx:{border:"1px solid #eee",overflow:"hidden"},children:[t(r.Group,{position:"left",pl:"md",py:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef",flexGrow:0},children:t(r.Text,{weight:500,children:"Context"})}),p(r.Group,{direction:"column",px:"md",pb:"md",sx:{width:"100%"},children:[t(q.Prism,{language:"sql",sx:{width:"100%"},noCopy:!0,colorScheme:"dark",children:`-- You may refer context data *by name*
+`;function er({}){const e=c.default.useContext(R),{sqlSnippets:n}=c.default.useContext(q),i=c.default.useMemo(()=>{const l=n.reduce((s,a)=>(s[a.key]=a.value,s),{});return JSON.stringify(l,null,2)},[n]),o=c.default.useMemo(()=>JSON.stringify(e,null,2),[e]);return p(r.Group,{direction:"column",grow:!0,sx:{border:"1px solid #eee",maxWidth:"40%",overflow:"hidden"},children:[t(r.Group,{position:"left",pl:"md",py:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef",flexGrow:0},children:t(r.Text,{weight:500,children:"Context"})}),p(r.Group,{direction:"column",px:"md",pb:"md",sx:{width:"100%"},children:[t(k.Prism,{language:"sql",sx:{width:"100%"},noCopy:!0,colorScheme:"dark",children:Hn}),t(r.Text,{weight:500,sx:{flexGrow:0},children:"Avaiable context"}),t(k.Prism,{language:"json",sx:{width:"100%"},noCopy:!0,colorScheme:"dark",children:o}),t(r.Text,{weight:500,sx:{flexGrow:0},children:"Avaiable SQL Snippets"}),t(k.Prism,{language:"json",sx:{width:"100%"},noCopy:!0,colorScheme:"dark",children:i})]})]})}function tr({value:e}){const n=c.default.useContext(R),i=c.default.useContext(q),o=c.default.useMemo(()=>wt(e,n,i),[e,n,i]);return t(k.Prism,{language:"sql",colorScheme:"light",children:o})}function nr({value:e,onChange:n}){const i=$.useForm({initialValues:e}),o=c.default.useCallback(f=>{n(f)},[n]),l=c.default.useMemo(()=>!z.default.isEqual(e,i.values),[e,i.values]);c.default.useEffect(()=>{i.reset()},[e]);const{data:s={},loading:a}=he.useRequest(vt,{refreshDeps:[]},[]),u=c.default.useMemo(()=>Object.keys(s).map(f=>({label:f,value:f})),[s]),d=c.default.useMemo(()=>{const f=s[i.values.type];return f?f.map(x=>({label:x,value:x})):[]},[s,i.values.type]);return t(r.Group,{direction:"column",grow:!0,sx:{border:"1px solid #eee",flexGrow:1},children:p("form",{onSubmit:i.onSubmit(o),children:[p(r.Group,{position:"left",py:"md",pl:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef"},children:[t(r.Text,{weight:500,children:"Edit Query"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",disabled:!l||a,children:t(C.DeviceFloppy,{size:20})})]}),p(r.Group,{direction:"column",grow:!0,my:0,p:"md",pr:40,children:[p(r.Group,{grow:!0,children:[t(r.TextInput,h({placeholder:"An ID unique in this dashboard",label:"ID",required:!0,sx:{flex:1},disabled:a},i.getInputProps("id"))),t(r.Select,h({label:"Data Source Type",data:u,sx:{flex:1},disabled:a},i.getInputProps("type"))),t(r.Select,h({label:"Data Source Key",data:d,sx:{flex:1},disabled:a},i.getInputProps("key")))]}),p(r.Tabs,{children:[t(r.Tabs.Tab,{label:"SQL",children:t(r.Textarea,G(h({autosize:!0,minRows:12,maxRows:24},i.getInputProps("sql")),{className:"code-textarea"}))}),t(r.Tabs.Tab,{label:"Preview",children:t(tr,{value:i.values.sql})})]})]})]})})}function rr({id:e,setID:n}){const{queries:i,setQueries:o}=c.default.useContext(q),l=c.default.useMemo(()=>i.find(a=>a.id===e),[i,e]),s=c.default.useCallback(a=>{if(i.findIndex(d=>d.id===e)===-1){console.error(new Error("Invalid data source id when updating by id"));return}o(d=>{const f=d.findIndex(x=>x.id===e);return d.splice(f,1,a),[...d]}),n(a.id)},[e,i,o,n]);return e?l?t(nr,{value:l,onChange:s}):t("span",{children:"Invalid Data Source ID"}):null}function ir({id:e,setID:n}){const{queries:i,setQueries:o}=c.default.useContext(q),l=c.default.useCallback(()=>{var u,d;n((d=(u=i[0])==null?void 0:u.id)!=null?d:"")},[n,i]);c.default.useEffect(()=>{if(!e){l();return}i.findIndex(d=>d.id===e)===-1&&l()},[e,i,l]);const s=c.default.useMemo(()=>i.map(u=>({value:u.id,label:u.id})),[i]),a=c.default.useCallback(()=>{const u={id:E.randomId(),type:"postgresql",key:"",sql:""};o(d=>[...d,u]),n(u.id)},[o,n]);return t(r.Group,{pb:"xl",children:p(r.Group,{position:"left",sx:{maxWidth:"600px",alignItems:"baseline"},children:[t(r.Text,{children:"Select a Query"}),t(r.Select,{data:s,value:e,onChange:n,allowDeselect:!1,clearable:!1,sx:{flexGrow:1}}),t(r.Text,{children:"or"}),t(r.Group,{position:"center",mt:"md",children:t(r.Button,{onClick:a,children:"Add a Query"})})]})})}function lr({}){const[e,n]=c.default.useState("");return p(r.AppShell,{sx:{height:"90vh",maxHeight:"calc(100vh - 225px)",".mantine-AppShell-body":{height:"100%"},main:{height:"100%",width:"100%",padding:0,margin:0}},padding:"md",children:[p(r.Group,{direction:"row",position:"apart",grow:!0,align:"stretch",noWrap:!0,children:[p(r.Group,{direction:"column",grow:!0,sx:{flexGrow:1,maxWidth:"calc(60% - 16px)"},children:[t(ir,{id:e,setID:n}),t(rr,{id:e,setID:n})]}),t(er,{})]}),t($e,{id:e})]})}function or({}){const e=c.default.useContext(R),n="SELECT *\nFROM commit\nWHERE author_time BETWEEN '${timeRange?.[0].toISOString()}' AND '${timeRange?.[1].toISOString()}'";return p(r.Group,{direction:"column",grow:!0,sx:{border:"1px solid #eee",overflow:"hidden"},children:[t(r.Group,{position:"left",pl:"md",py:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef",flexGrow:0},children:t(r.Text,{weight:500,children:"Context"})}),p(r.Group,{direction:"column",px:"md",pb:"md",sx:{width:"100%"},children:[t(k.Prism,{language:"sql",sx:{width:"100%"},noCopy:!0,colorScheme:"dark",children:`-- You may refer context data *by name*
 -- in SQL or VizConfig.
 
-${n}`}),t(r.Text,{weight:500,sx:{flexGrow:0},children:"Avaiable context entries"}),t(q.Prism,{language:"json",sx:{width:"100%"},noCopy:!0,colorScheme:"dark",children:JSON.stringify(e,null,2)})]})]})}function ar({value:e}){const n=c.default.useContext(R),i=c.default.useMemo(()=>Ct(e,n),[e,n]);return p(r.Group,{direction:"column",noWrap:!0,grow:!0,children:[t(r.Text,{children:"Preview"}),t(q.Prism,{language:"sql",noCopy:!0,colorScheme:"dark",children:i})]})}function sr({}){const{sqlSnippets:e,setSQLSnippets:n}=c.default.useContext(O),i=c.default.useMemo(()=>({snippets:$.formList(e!=null?e:[])}),[e]),l=$.useForm({initialValues:i}),o=()=>l.addListItem("snippets",{key:E.randomId(),value:""}),s=c.default.useMemo(()=>!D.default.isEqual(l.values,i),[l.values,i]),a=({snippets:u})=>{n(u)};return t(r.Group,{direction:"column",grow:!0,sx:{border:"1px solid #eee",flexGrow:1},children:p("form",{onSubmit:l.onSubmit(a),children:[p(r.Group,{position:"left",pl:"md",py:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef",flexGrow:0},children:[t(r.Text,{weight:500,children:"SQL Snippets"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",disabled:!s,children:t(S.DeviceFloppy,{size:20})})]}),t(r.Group,{px:"md",pb:"md",pt:"md",children:p(r.Group,{direction:"column",sx:{width:"100%",position:"relative"},grow:!0,children:[l.values.snippets.map((u,d)=>p(r.Group,{direction:"column",grow:!0,my:0,p:"md",pr:40,sx:{border:"1px solid #eee",position:"relative"},children:[t(r.TextInput,h({label:"Key",required:!0},l.getListInputProps("snippets",d,"key"))),t(r.Textarea,G(h({minRows:3,label:"Value",required:!0},l.getListInputProps("snippets",d,"value")),{className:"code-textarea"})),t(ar,{value:l.values.snippets[d].value}),t(r.ActionIcon,{color:"red",variant:"hover",onClick:()=>l.removeListItem("snippets",d),sx:{position:"absolute",top:15,right:5},children:t(S.Trash,{size:16})})]},d)),t(r.Group,{position:"center",mt:"xl",grow:!0,sx:{width:"40%"},mx:"auto",children:t(r.Button,{variant:"default",onClick:o,children:"Add a snippet"})})]})})]})})}const ur=`SELECT *
+${n}`}),t(r.Text,{weight:500,sx:{flexGrow:0},children:"Avaiable context entries"}),t(k.Prism,{language:"json",sx:{width:"100%"},noCopy:!0,colorScheme:"dark",children:JSON.stringify(e,null,2)})]})]})}function ar({value:e}){const n=c.default.useContext(R),i=c.default.useMemo(()=>St(e,n),[e,n]);return p(r.Group,{direction:"column",noWrap:!0,grow:!0,children:[t(r.Text,{children:"Preview"}),t(k.Prism,{language:"sql",noCopy:!0,colorScheme:"dark",children:i})]})}function sr({}){const{sqlSnippets:e,setSQLSnippets:n}=c.default.useContext(q),i=c.default.useMemo(()=>({snippets:$.formList(e!=null?e:[])}),[e]),o=$.useForm({initialValues:i}),l=()=>o.addListItem("snippets",{key:E.randomId(),value:""}),s=c.default.useMemo(()=>!z.default.isEqual(o.values,i),[o.values,i]),a=({snippets:u})=>{n(u)};return t(r.Group,{direction:"column",grow:!0,sx:{border:"1px solid #eee",flexGrow:1},children:p("form",{onSubmit:o.onSubmit(a),children:[p(r.Group,{position:"left",pl:"md",py:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef",flexGrow:0},children:[t(r.Text,{weight:500,children:"SQL Snippets"}),t(r.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",disabled:!s,children:t(C.DeviceFloppy,{size:20})})]}),t(r.Group,{px:"md",pb:"md",pt:"md",children:p(r.Group,{direction:"column",sx:{width:"100%",position:"relative"},grow:!0,children:[o.values.snippets.map((u,d)=>p(r.Group,{direction:"column",grow:!0,my:0,p:"md",pr:40,sx:{border:"1px solid #eee",position:"relative"},children:[t(r.TextInput,h({label:"Key",required:!0},o.getListInputProps("snippets",d,"key"))),t(r.Textarea,G(h({minRows:3,label:"Value",required:!0},o.getListInputProps("snippets",d,"value")),{className:"code-textarea"})),t(ar,{value:o.values.snippets[d].value}),t(r.ActionIcon,{color:"red",variant:"hover",onClick:()=>o.removeListItem("snippets",d),sx:{position:"absolute",top:15,right:5},children:t(C.Trash,{size:16})})]},d)),t(r.Group,{position:"center",mt:"xl",grow:!0,sx:{width:"40%"},mx:"auto",children:t(r.Button,{variant:"default",onClick:l,children:"Add a snippet"})})]})})]})})}const ur=`SELECT *
 FROM commit
-WHERE \${author_time_condition}`;function dr(){return p(r.Group,{direction:"column",grow:!0,sx:{border:"1px solid #eee",overflow:"hidden"},children:[t(r.Group,{position:"left",pl:"md",py:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef",flexGrow:0},children:t(r.Text,{weight:500,children:"Guide"})}),t(r.Group,{direction:"column",px:"md",pb:"md",sx:{width:"100%"},children:t(q.Prism,{language:"sql",sx:{width:"100%"},noCopy:!0,trim:!1,colorScheme:"dark",children:`-- You may refer context data *by name*
+WHERE \${author_time_condition}`;function dr(){return p(r.Group,{direction:"column",grow:!0,sx:{border:"1px solid #eee",overflow:"hidden"},children:[t(r.Group,{position:"left",pl:"md",py:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef",flexGrow:0},children:t(r.Text,{weight:500,children:"Guide"})}),t(r.Group,{direction:"column",px:"md",pb:"md",sx:{width:"100%"},children:t(k.Prism,{language:"sql",sx:{width:"100%"},noCopy:!0,trim:!1,colorScheme:"dark",children:`-- You may refer context data *by name*
 -- in SQL or VizConfig.
 
 ${ur}
 
 -- where author_time_condition is:
 author_time BETWEEN '\${timeRange?.[0].toISOString()}' AND '\${timeRange?.[1].toISOString()}'
- `})})]})}function cr({}){return t(r.AppShell,{sx:{height:"90vh",maxHeight:"calc(100vh - 225px)",".mantine-AppShell-body":{height:"100%"},main:{height:"100%",width:"100%",padding:0,margin:0}},padding:"md",children:p(r.Group,{direction:"row",position:"apart",grow:!0,align:"stretch",noWrap:!0,children:[t(sr,{}),p(r.Group,{direction:"column",grow:!0,noWrap:!0,sx:{maxWidth:"40%"},children:[t(dr,{}),t(lr,{})]})]})})}function pr({opened:e,close:n}){const{freezeLayout:i}=c.default.useContext(j);return c.default.useEffect(()=>{i(e)},[e]),t(r.Modal,{size:"96vw",overflow:"inside",opened:e,onClose:n,title:"Data Settings",trapFocus:!0,onDragStart:l=>{l.stopPropagation()},children:p(r.Tabs,{children:[t(r.Tabs.Tab,{label:"SQL Snippet",children:t(cr,{})}),t(r.Tabs.Tab,{label:"Data Source",children:t(or,{})})]})})}function fr({mode:e,setMode:n,hasChanges:i,addPanel:l,saveChanges:o}){const{inLayoutMode:s,inEditMode:a,inUseMode:u}=c.default.useContext(j),[d,f]=c.default.useState(!1),x=()=>f(!0),m=()=>f(!1);return p(r.Group,{position:"apart",pt:"sm",pb:"xs",children:[t(r.Group,{position:"left",children:t(Zn,{mode:e,setMode:n})}),p(r.Group,{position:"right",children:[!u&&t(r.Button,{variant:"default",size:"sm",onClick:l,leftIcon:t(S.PlaylistAdd,{size:20}),children:"Add a Panel"}),a&&t(r.Button,{variant:"default",size:"sm",onClick:x,leftIcon:t(S.Database,{size:20}),children:"Data Settings"}),!u&&t(r.Button,{variant:"default",size:"sm",onClick:o,disabled:!i,leftIcon:t(S.DeviceFloppy,{size:20}),children:"Save Changes"}),!u&&t(r.Button,{color:"red",size:"sm",disabled:!i,leftIcon:t(S.Recycle,{size:20}),children:"Revert Changes"})]}),t(pr,{opened:d,close:m}),u&&t(r.Button,{variant:"default",size:"sm",disabled:!0,leftIcon:t(S.Share,{size:20}),children:"Share"})]})}function mr({context:e,dashboard:n,update:i,className:l="dashboard",config:o}){Y.baseURL!==o.apiBaseURL&&(Y.baseURL=o.apiBaseURL);const[s,a]=c.default.useState(!1),[u,d]=c.default.useState(n.panels),[f,x]=c.default.useState(n.definition.sqlSnippets),[m,g]=c.default.useState(n.definition.dataSources),[b,C]=c.default.useState(A.Edit),v=c.default.useMemo(()=>{const F=W=>JSON.parse(JSON.stringify(W));return!D.default.isEqual(F(u),F(n.panels))||!D.default.isEqual(f,n.definition.sqlSnippets)?!0:!D.default.isEqual(m,n.definition.dataSources)},[n,u,f,m]),k=async()=>{const F=G(h({},n),{panels:u,definition:{sqlSnippets:f,dataSources:m}});await i(F)},L=()=>{const F=E.randomId(),fe={id:F,layout:{x:0,y:1/0,w:3,h:15},title:`New Panel - ${F}`,description:"",dataSourceID:"",viz:{type:"text",conf:{}}};d(W=>[...W,fe])},X=F=>{const fe=u.findIndex(W=>W.id===F);d(W=>(W.splice(fe,1),[...W]))},pe=b===A.Edit,ne=b===A.Layout,De=b===A.Use,ze=c.default.useMemo(()=>({sqlSnippets:f,setSQLSnippets:x,dataSources:m,setDataSources:g}),[f,x,m,g]);return t(R.Provider,{value:e,children:t("div",{className:l,children:t(O.Provider,{value:ze,children:p(j.Provider,{value:{layoutFrozen:s,freezeLayout:a,mode:b,inEditMode:pe,inLayoutMode:ne,inUseMode:De},children:[t(fr,{mode:b,setMode:C,hasChanges:v,addPanel:L,saveChanges:k}),t(ut,{panels:u,setPanels:d,isDraggable:ne,isResizable:ne,onRemoveItem:X})]})})})})}const hr=P.WidthProvider(Le.default);function xr({panels:e,className:n="layout",rowHeight:i=10}){return t(hr,{className:n,rowHeight:i,isDraggable:!1,isResizable:!1,children:e.map(s=>{var a=s,{id:l}=a,o=z(a,["id"]);return t("div",{"data-grid":o.layout,children:t(Ge,h({id:l},o))},l)})})}function gr({context:e,dashboard:n,className:i="dashboard",config:l}){Y.baseURL!==l.apiBaseURL&&(Y.baseURL=l.apiBaseURL);const o=c.default.useMemo(()=>G(h({},n.definition),{setSQLSnippets:()=>{},setDataSources:()=>{}}),[n]);return t(R.Provider,{value:e,children:t("div",{className:i,children:t(O.Provider,{value:o,children:t(j.Provider,{value:{layoutFrozen:!0,freezeLayout:()=>{},mode:A.Use,inEditMode:!1,inLayoutMode:!1,inUseMode:!0},children:t(xr,{panels:n.panels})})})})})}y.ContextInfoContext=R,y.Dashboard=mr,y.DashboardLayout=ut,y.DashboardMode=A,y.DefinitionContext=O,y.LayoutStateContext=j,y.Panel=Ge,y.PanelContext=M,y.ReadOnlyDashboard=gr,y.initialContextInfoContext=Tt,Object.defineProperties(y,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
+ `})})]})}function cr({}){return t(r.AppShell,{sx:{height:"90vh",maxHeight:"calc(100vh - 225px)",".mantine-AppShell-body":{height:"100%"},main:{height:"100%",width:"100%",padding:0,margin:0}},padding:"md",children:p(r.Group,{direction:"row",position:"apart",grow:!0,align:"stretch",noWrap:!0,children:[t(sr,{}),p(r.Group,{direction:"column",grow:!0,noWrap:!0,sx:{maxWidth:"40%"},children:[t(dr,{}),t(or,{})]})]})})}function pr({opened:e,close:n}){const{freezeLayout:i}=c.default.useContext(j);return c.default.useEffect(()=>{i(e)},[e]),t(r.Modal,{size:"96vw",overflow:"inside",opened:e,onClose:n,title:"Data Settings",trapFocus:!0,onDragStart:o=>{o.stopPropagation()},children:p(r.Tabs,{children:[t(r.Tabs.Tab,{label:"SQL Snippet",children:t(cr,{})}),t(r.Tabs.Tab,{label:"Queries",children:t(lr,{})})]})})}function fr({mode:e,setMode:n,hasChanges:i,addPanel:o,saveChanges:l}){const{inLayoutMode:s,inEditMode:a,inUseMode:u}=c.default.useContext(j),[d,f]=c.default.useState(!1),x=()=>f(!0),m=()=>f(!1);return p(r.Group,{position:"apart",pt:"sm",pb:"xs",children:[t(r.Group,{position:"left",children:t(Zn,{mode:e,setMode:n})}),p(r.Group,{position:"right",children:[!u&&t(r.Button,{variant:"default",size:"sm",onClick:o,leftIcon:t(C.PlaylistAdd,{size:20}),children:"Add a Panel"}),a&&t(r.Button,{variant:"default",size:"sm",onClick:x,leftIcon:t(C.Database,{size:20}),children:"Data Settings"}),!u&&t(r.Button,{variant:"default",size:"sm",onClick:l,disabled:!i,leftIcon:t(C.DeviceFloppy,{size:20}),children:"Save Changes"}),!u&&t(r.Button,{color:"red",size:"sm",disabled:!i,leftIcon:t(C.Recycle,{size:20}),children:"Revert Changes"})]}),t(pr,{opened:d,close:m}),u&&t(r.Button,{variant:"default",size:"sm",disabled:!0,leftIcon:t(C.Share,{size:20}),children:"Share"})]})}function mr({context:e,dashboard:n,update:i,className:o="dashboard",config:l}){Y.baseURL!==l.apiBaseURL&&(Y.baseURL=l.apiBaseURL);const[s,a]=c.default.useState(!1),[u,d]=c.default.useState(n.panels),[f,x]=c.default.useState(n.definition.sqlSnippets),[m,g]=c.default.useState(n.definition.queries),[b,S]=c.default.useState(D.Edit),v=c.default.useMemo(()=>{const F=Q=>JSON.parse(JSON.stringify(Q));return!z.default.isEqual(F(u),F(n.panels))||!z.default.isEqual(f,n.definition.sqlSnippets)?!0:!z.default.isEqual(m,n.definition.queries)},[n,u,f,m]),O=async()=>{const F=G(h({},n),{panels:u,definition:{sqlSnippets:f,queries:m}});await i(F)},A=()=>{const F=E.randomId(),fe={id:F,layout:{x:0,y:1/0,w:3,h:15},title:`Panel - ${F}`,description:"<p><br></p>",queryID:"",viz:{type:"text",conf:{}}};d(Q=>[...Q,fe])},X=F=>{const fe=u.findIndex(Q=>Q.id===F);d(Q=>(Q.splice(fe,1),[...Q]))},pe=b===D.Edit,ne=b===D.Layout,ze=b===D.Use,Pe=c.default.useMemo(()=>({sqlSnippets:f,setSQLSnippets:x,queries:m,setQueries:g}),[f,x,m,g]);return t(R.Provider,{value:e,children:t("div",{className:o,children:t(q.Provider,{value:Pe,children:p(j.Provider,{value:{layoutFrozen:s,freezeLayout:a,mode:b,inEditMode:pe,inLayoutMode:ne,inUseMode:ze},children:[t(fr,{mode:b,setMode:S,hasChanges:v,addPanel:A,saveChanges:O}),t(ut,{panels:u,setPanels:d,isDraggable:ne,isResizable:ne,onRemoveItem:X})]})})})})}const hr=I.WidthProvider(Ae.default);function xr({panels:e,className:n="layout",rowHeight:i=10}){return t(hr,{className:n,rowHeight:i,isDraggable:!1,isResizable:!1,children:e.map(s=>{var a=s,{id:o}=a,l=P(a,["id"]);return t("div",{"data-grid":l.layout,children:t(Ge,h({id:o},l))},o)})})}function gr({context:e,dashboard:n,className:i="dashboard",config:o}){Y.baseURL!==o.apiBaseURL&&(Y.baseURL=o.apiBaseURL);const l=c.default.useMemo(()=>G(h({},n.definition),{setSQLSnippets:()=>{},setQueries:()=>{}}),[n]);return t(R.Provider,{value:e,children:t("div",{className:i,children:t(q.Provider,{value:l,children:t(j.Provider,{value:{layoutFrozen:!0,freezeLayout:()=>{},mode:D.Use,inEditMode:!1,inLayoutMode:!1,inUseMode:!0},children:t(xr,{panels:n.panels})})})})})}y.ContextInfoContext=R,y.Dashboard=mr,y.DashboardLayout=ut,y.DashboardMode=D,y.DefinitionContext=q,y.LayoutStateContext=j,y.Panel=Ge,y.PanelContext=M,y.ReadOnlyDashboard=gr,y.initialContextInfoContext=Tt,Object.defineProperties(y,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});

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

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

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

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

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

@@ -0,0 +1,7 @@
+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/panel/index.d.ts

@@ -4,5 +4,5 @@ interface IPanel extends IDashboardPanel {
     destroy?: () => void;
     update?: (panel: IDashboardPanel) => void;
 }
-export declare function Panel({ viz: initialViz, dataSourceID: initialDataSourceID, title: initialTitle, description: initialDesc, update, layout, id, }: IPanel): JSX.Element;
+export declare function Panel({ viz: initialViz, queryID: initialQueryID, title: initialTitle, description: initialDesc, update, layout, id, }: IPanel): JSX.Element;
 export {};

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

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

package/dist/style.css

@@ -1 +1 @@
-.viz-root{width:100%;overflow:scroll;padding-top:10px;height:calc(100% - 30px);background-color:#fff}.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}.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}.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%}.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}.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}.code-textarea textarea{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace}

package/dist/types/dashboard.d.ts

@@ -2,7 +2,7 @@ export interface IVizConfig {
     type: string;
     conf: Record<string, any>;
 }
-export interface IDataSource {
+export interface IQuery {
     type: 'postgresql';
     key: string;
     sql: string;
@@ -20,7 +20,7 @@ export interface IDashboardPanel {
         moved?: boolean;
         static?: boolean;
     };
-    dataSourceID: string;
+    queryID: string;
     viz: IVizConfig;
 }
 export declare enum DashboardMode {
@@ -34,7 +34,7 @@ export interface ISQLSnippet {
 }
 export interface IDashboardDefinition {
     sqlSnippets: ISQLSnippet[];
-    dataSources: IDataSource[];
+    queries: IQuery[];
 }
 export interface IDashboard {
     id: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devtable/dashboard",
-  "version": "1.18.0",
+  "version": "1.19.0",
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org/"

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

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

package/dist/definition-editor/data-source-editor/form.d.ts

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

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

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

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

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

package/dist/panel/settings/pick-data-source/index.d.ts

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