@devtable/dashboard 1.6.0 → 1.9.0

package/dist/dashboard.umd.js

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

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

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

package/dist/panel/settings/common/color-array-input.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+interface IColorArrayInput {
+    label: React.ReactNode;
+    value: string[];
+    onChange: (value: string[]) => void;
+}
+export declare function ColorArrayInput({ label, value, onChange }: IColorArrayInput): JSX.Element;
+export {};

package/dist/panel/settings/common/text-array-input.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+interface ITextArrayInput {
+    label: React.ReactNode;
+    value: string[] | number[];
+    onChange: (value: string[] | number[]) => void;
+}
+export declare function TextArrayInput({ label, value, onChange }: ITextArrayInput): JSX.Element;
+export {};

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

@@ -3,11 +3,15 @@ export interface ILineBarChartSeriesItem {
     name: string;
     showSymbol: false;
     y_axis_data_key: string;
+    y_axis_data_formatter?: string;
+    label_position?: string;
     stack: string;
     color?: string;
 }
 export interface ILineBarChartConf {
     x_axis_data_key: string;
+    x_axis_name: string;
+    y_axis_name: string;
     series: ILineBarChartSeriesItem[];
 }
 export interface IVizLineBarChartPanel {

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

@@ -0,0 +1,9 @@
+/// <reference types="react" />
+interface IVizStats {
+    conf: any;
+    data: any;
+    width: number;
+    height: number;
+}
+export declare function VizStats({ conf: { template, size, color, ...rest }, data }: IVizStats): JSX.Element;
+export {};

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

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

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

@@ -0,0 +1,17 @@
+export declare type ColorConf = {
+    type: 'static';
+    value: string;
+} | {
+    type: 'continuous';
+    valueRange: number[];
+    colorRange: string[];
+} | {
+    type: 'piecewise';
+};
+export interface IVizStatsConf {
+    color: ColorConf;
+    size: string;
+    weight: string;
+    template: string;
+    value_field: string;
+}

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

@@ -13,7 +13,7 @@ export interface ITableConf {
     id_field: string;
     use_raw_columns: boolean;
     columns: IColumnConf[];
-    size: string;
+    fontSize: string;
     horizontalSpacing: string;
     verticalSpacing: string;
     striped: boolean;

package/dist/types/dashboard.d.ts

@@ -25,6 +25,7 @@ export interface IDashboardPanel {
 }
 export declare enum DashboardMode {
     Use = "use",
+    Layout = "layout",
     Edit = "edit"
 }
 export interface ISQLSnippet {

package/dist/utils/color-mapping.d.ts

@@ -0,0 +1,10 @@
+interface InterpolateColorOption {
+    valueRange: number[];
+    colorRange: string[];
+}
+export declare class InterpolateColor {
+    mapper: (v: number) => string;
+    constructor({ valueRange, colorRange }: InterpolateColorOption);
+    getColor(value: number): string;
+}
+export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@devtable/dashboard",
-  "version": "1.6.0",
+  "version": "1.9.0",
   "publishConfig": {
     "access": "public",
     "registry": "https://registry.npmjs.org/"
@@ -26,7 +26,9 @@
     "build": "tsc && vite build",
     "preview": "vite preview"
   },
-  "dependencies": {},
+  "dependencies": {
+    "popmotion": "^11.0.3"
+  },
   "devDependencies": {
     "@mantine/core": "^4.2.5",
     "@mantine/dates": "^4.2.5",