@devtable/dashboard 10.46.0 → 10.47.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (6) hide show
  1. package/dist/components/plugins/viz-components/cartesian/option/x-axis.d.ts +1 -0
  2. package/dist/components/plugins/viz-components/scatter-chart/option/x-axis.d.ts +1 -0
  3. package/dist/dashboard.es.js +210 -208
  4. package/dist/dashboard.umd.js +3 -3
  5. package/dist/stats.html +1 -1
  6. package/package.json +7 -7
package/dist/dashboard.umd.js CHANGED
@@ -51,7 +51,7 @@ Check the top-level render call using <`+M+">.")}return I}}function rc(v,I){{if(
51
51
  ${tu.map(nu).join("")}
52
52
  </tbody>
53
53
  </table>
54
- `;function os(t,e){const n=Object.keys(e),r=Object.values(e);try{return new Function(...n,`return \`${t}\`;`)(...r)}catch(i){throw n.length===0&&t.includes("$")?new Error("[formatSQL] insufficient payload"):i}}function ls(t,e){try{return os(t,e)}catch(n){return console.error(n),n.message}}function ru({sql:t,pre_process:e}){if(!e.trim())return t;try{return new Function(`return ${e}`)()({sql:t},ft)}catch(n){return console.error(n),t}}function iu(t,e,n){if(!t.trim())return e;try{return new Function(`return ${t}`)()(e,ft,n)}catch(r){return console.error(r),e}}function au(t){t=t||{};const e=Object.keys(t).sort(),n=[];for(let r=0;r<e.length;r++){const i=e[r];if(i!="authentication"&&t[i])n.push(e[r]+"="+(typeof t[i]=="object"?JSON.stringify(t[i]):t[i]));else{const o=Object.keys(t[i]).sort();for(let l=0;l<o.length;l++){const c=o[l];c!="sign"&&t[i][c]&&n.push(o[l]+"="+(typeof t[i][c]=="object"?JSON.stringify(t[i][c]):t[i][c]))}}}return n.sort().join("&")}function ou(t,e){let n=au(t);return n+="&key="+e,Jc.MD5(n).toString().toUpperCase()}class xi{constructor(){this.type="default_api_client",this.baseURL="http://localhost:31200",this.app_id="",this.app_secret=""}getAuthentication(e){if(!this.app_id||!this.app_secret)return;const n=new Date().getTime().toString();return{app_id:this.app_id,nonce_str:n,sign:ou({app_id:this.app_id,nonce_str:n,...e},this.app_secret)}}getRequest(e,n){return(r,i,o,l)=>{const c=this.buildHeader(o),u=this.buildAxiosConfig(e,r,i,o,c,n);return et(u).then(d=>l?d:d.data).catch(d=>Promise.reject(d))}}get(e){return this.getRequest("GET",e)}post(e){return this.getRequest("POST",e)}put(e){return this.getRequest("PUT",e)}buildAxiosConfig(e,n,r,i,o,l){const c={baseURL:this.baseURL,method:e,url:n,params:e==="GET"?r:i.params,headers:o,signal:l};return["POST","PUT"].includes(e)&&(c.data=i.string?JSON.stringify(r):r,c.data.authentication=this.getAuthentication(c.data)),c}buildHeader(e){const n=window.localStorage.getItem("token");return{"X-Requested-With":"XMLHttpRequest","Content-Type":e.string?"application/x-www-form-urlencoded":"application/json",authorization:n?`bearer ${n}`:"",...e.headers}}}class lu{constructor(e){this.implementation=e}getRequest(e,n){return this.implementation.getRequest(e,n)}get(e){return this.getRequest("GET",e)}post(e){return this.getRequest("POST",e)}put(e){return this.getRequest("PUT",e)}}class fi extends xi{constructor(){super(...arguments);A(this,"makeQueryENV",null)}query(n){return async(r,i={})=>{var o;return r.env||(r.env=((o=this.makeQueryENV)==null?void 0:o.call(this))??{error:"failed to run makeQueryENV"}),this.post(n)("/query",r,i)}}httpDataSourceQuery(n){return async(r,i={})=>{var o;return r.env||(r.env=((o=this.makeQueryENV)==null?void 0:o.call(this))??{error:"failed to run makeQueryENV"}),this.getRequest("POST",n)("/query",r,i,!0)}}structure(n){return async(r,i={})=>this.post(n)("/query/structure",r,i)}}class gi{constructor(e){this.implementation=e}query(e){return this.implementation.query(e)}httpDataSourceQuery(e){return this.implementation.httpDataSourceQuery(e)}structure(e){return this.implementation.structure(e)}getRequest(e,n){return this.implementation.getRequest(e,n)}get(e){return this.getRequest("GET",e)}post(e){return this.getRequest("POST",e)}put(e){return this.getRequest("PUT",e)}}const Tt=new fi;function cs(t){Tt.baseURL!==t.apiBaseURL&&(Tt.baseURL=t.apiBaseURL),t.app_id&&(Tt.app_id=t.app_id),t.app_secret&&(Tt.app_secret=t.app_secret),t.makeQueryENV&&(Tt.makeQueryENV=t.makeQueryENV)}const mi=new gi(Tt),Ue=mi;function yi(){return{filters:{},context:{}}}function us(t){const e=yi();if(!t)return yi();const{filters:n=e.filters,context:r=e.context}=t;return{filters:n,context:r}}async function cu({query:t,name:e,payload:n,additionals:r},i){if(!t.sql)return[];const{type:o,key:l,sql:c,pre_process:u,post_process:d}=t,h=os(c,n),p=ru({sql:h,pre_process:u});let x=await Ue.query(i)({type:o,key:l,query:p,...r},{params:{name:e}});return x=iu(d,x,us(n)),x}async function uu({type:t,key:e,configString:n,name:r,additionals:i},o){try{return await Ue.httpDataSourceQuery(o)({type:t,key:e,query:n,...i},{params:{name:r}})}catch(l){if(et.isCancel(l))throw l;return console.error(l),l}}async function ds(){try{return(await Ue.post()("/datasource/list",{filter:{},sort:[{field:"create_time",order:"ASC"}],pagination:{page:1,pagesize:100}},{})).data}catch(t){return console.error(t),[]}}async function bi(){try{return(await Ue.post()("/sql_snippet/list",{filter:{},sort:[{field:"id",order:"ASC"}],pagination:{page:1,pagesize:1e3}},{})).data}catch(t){return console.error(t),[]}}class ji{constructor(e){A(this,"rootRef");this.rootRef=W.observable({current:e})}async deleteItem(e){W.runInAction(()=>{y.unset(this.rootRef.current,[e])})}getItem(e){const n=this.getValueFromRoot(e);return Promise.resolve(n)}getValueFromRoot(e){return e===null?W.toJS(this.rootRef.current):y.get(this.rootRef.current,[e])}setItem(e,n){if(e===null)if(y.isObject(n))W.runInAction(()=>{this.rootRef.current=n});else throw new Error("Cannot set root value to non-object");else W.runInAction(()=>{y.set(this.rootRef.current,[e],n)});return Promise.resolve(this.getItem(e))}watchItem(e,n,r){return W.reaction(()=>this.getValueFromRoot(e),(i,o)=>{n(i,o)},{requiresObservable:!0,fireImmediately:y.get(r,"fireImmediately",!1)})}}class du{constructor(){A(this,"channels",new Map);A(this,"globalChannel",new Ur)}getChannel(e){const n=this.channels.get(e);if(n)return n;const r=new Ur;return this.channels.set(e,r),r}}class pu{constructor(e){A(this,"instances",new Map);this.pluginManager=e}get availableVizList(){return this.pluginManager.installedPlugins.flatMap(e=>e.manifest.viz)}resolveComponent(e){return this.pluginManager.factory.viz(e)}getOrCreateInstance(e){const n=this.instances.get(e.id);if(n)return n;const r={id:e.id,name:e.viz.type,type:e.viz.type,messageChannels:new du,instanceData:new ji(e.viz.conf)};return this.instances.set(e.id,r),r}}function vi(t,e,n,r){return{vizManager:n,locale:"zh",msgChannels:t.messageChannels,instanceData:t.instanceData,pluginData:new ji({}),colorPalette:{getColor(){return()=>""}},data:e,variables:r}}const hu=t=>{const{panel:e,vizManager:n,data:r,variables:i}=t,o=n.resolveComponent(e.viz.type),l=n.getOrCreateInstance(e),c={...vi(l,r,n,i),viewport:{width:e.layout.w,height:e.layout.h}},u=o.viewRender;return s.jsx(u,{context:c,instance:l,...y.omit(t,["panel","vizManager","data"])})},xu=t=>{const{vizManager:e,panel:n,data:r,variables:i}=t,o=e.resolveComponent(n.viz.type),l=e.getOrCreateInstance(n),c={...vi(l,r,e,i)},u=o.configRender;return s.jsx(u,{context:c,instance:l,...y.omit(t,["panel","vizManager","data"])})},wi=(t,e)=>{const n=tt.bezier(t),r=tt.bezier(e);return function(i){return i<50?n(i*2/100).hex():r((i-50)*2/100).hex()}},cn=t=>{const e=tt.bezier(t);return function(n){return e(n/100).hex()}},fu={type:"interpolation",displayName:"Red / Green",getColor:wi(["darkred","deeppink","lightyellow"],["lightyellow","lightgreen","teal"]),name:"red-green",category:"diverging"},gu={type:"interpolation",displayName:"Yellow / Blue",getColor:wi(["#8f531d","#ffd347","#e3efe3"],["#eefaee","#4ecbbf","#003f94"]),name:"yellow-blue",category:"diverging"},mu={type:"interpolation",displayName:"Red",getColor:cn(["#fff7f1","darkred"]),name:"red",category:"sequential"},yu={type:"interpolation",displayName:"Green",getColor:cn(["#f0ffed","darkgreen"]),name:"green",category:"sequential"},bu={type:"interpolation",displayName:"Blue",getColor:cn(["#f9fcff","#48b3e9","darkblue"]),name:"blue",category:"sequential"},ju={type:"interpolation",displayName:"Orange",getColor:cn(["#fff7f1","darkorange","#b60000"]),name:"orange",category:"sequential"};class vu{constructor(e){A(this,"symbol");this.symbol=Symbol(e)}}function nt(t){return new vu(t)}class ps{constructor(){A(this,"parent");A(this,"factoryRegistry",new Map);A(this,"instanceRegistry",new Map)}createScoped(){const e=new ps;return e.parent=this,e}getRequired(e){return this.get(e)}get(e){if(this.instanceRegistry.has(e.symbol))return this.instanceRegistry.get(e.symbol);const n=this.factoryRegistry.get(e.symbol);if(n){const r=n(this);return this.instanceRegistry.set(e.symbol,r),r}if(this.parent)return this.parent.get(e)}provideFactory(e,n){return this.factoryRegistry.has(e.symbol)?console.warn(`Token ${e.symbol.toString()} is already registered`):this.factoryRegistry.set(e.symbol,n),this}provideValue(e,n){return this.factoryRegistry.has(e.symbol)?console.warn(`Token ${e.symbol.toString()} is already registered`):this.factoryRegistry.set(e.symbol,()=>n),this}dispose(){this.instanceRegistry.forEach(e=>{const n=y.get(e,"dispose");y.isFunction(n)&&n.bind(e)()}),this.instanceRegistry.clear(),this.factoryRegistry.clear()}}const Ci="10.46.0",wu=Object.freeze(Object.defineProperty({__proto__:null,version:Ci},Symbol.toStringTag,{value:"Module"}));class Cu{constructor(e){A(this,"staticColors",new Map);A(this,"interpolations",new Map);e.installedPlugins.forEach(n=>{n.manifest.color.forEach(r=>{this.register(r)})})}getStaticColors(){return Array.from(this.staticColors.values())}register(e){const n=this.encodeColor(e);e.type==="single"?(this.staticColors.has(n)&&console.warn(`the color '${e.name}' has been registered under '${e.category}', previous registered value will be overridden`),this.staticColors.set(n,e)):e.type==="interpolation"&&(this.interpolations.has(n)&&console.warn(`the interpolation '${e.name}' has been registered under '${e.category}', previous registered value will be overridden`,`the interpolation '${e.name}' has been registered under '${e.category}', previous registered value will be overridden`),this.interpolations.set(n,e))}decodeStaticColor(e){return this.staticColors.get(e)}encodeColor(e){return`\${${e.category}}.{${e.name}}`}decodeInterpolation(e){return this.interpolations.get(e)}getColorInterpolations(){return Array.from(this.interpolations.values())}}class Su{constructor(){A(this,"plugins",new Map);A(this,"vizComponents",new Map);A(this,"factory",{viz:e=>{const n=this.vizComponents.get(e);if(n)return n;throw new Error(`Viz Component (${e}) not found`)}})}install(e){if(this.plugins.has(e.id))throw new Error(`Plugin (${e.id}) has been installed before`);this.plugins.set(e.id,e);for(const n of e.manifest.viz){if(this.vizComponents.has(n.name))throw new Error(`Viz Component (${n.name}) has been installed before`);this.vizComponents.set(n.name,n)}}get installedPlugins(){return Array.from(this.plugins.values())}}class _u{constructor(){A(this,"migrations",[])}version(e,n){return this.migrations.push({version:e,handler:n}),this}run(e,n,r){var l;if(e.from===e.to)return n;if(e.from>e.to)throw new Error(`Can not downgrade from version '${e.from}' to (${e.to})`);const i=this.migrations.filter(c=>c.version>e.from&&c.version<=e.to),o=y.orderBy(i,"version","asc");if(((l=y.last(o))==null?void 0:l.version)!==e.to)throw new Error(`Migration to version ${e.to} not found`);return o.reduce((c,u)=>u.handler(c,r),n)}}class re extends _u{constructor(){super(),this.configVersions()}version(e,n){return super.version(e,(r,i)=>({version:e,...n(r,i)}))}async migrate({configData:e,panelModel:n}){const r=await e.getItem(null),i=y.get(r,"version",0),o=this.run({from:i,to:this.VERSION},r,{panelModel:n});await e.setItem(null,o)}async needMigration({configData:e}){const n=await e.getItem(null);return y.get(n,"version",0)<this.VERSION}}const O=(t,e)=>{const[n,{setFalse:r}]=$.useBoolean(!0),[i,o]=f.useState();f.useEffect(()=>(t.getItem(e).then(c=>{o(c),r()}),t.watchItem(e,c=>{o(c)})));const l=f.useCallback(async c=>{await t.setItem(e,c),o(c)},[t,e]);return{loading:n,value:i,set:l}},ke={top:16,right:16,bottom:16,left:16},Ge=t=>Math.max(0,t-ke.left-ke.right),We=t=>Math.max(0,t-ke.top-ke.bottom),Gt=(t,e)=>({width:Ge(t),height:We(e)}),Te=({width:t,height:e,children:n})=>s.jsx(a.Box,{pt:ke.top,pr:ke.right,pb:ke.bottom,pl:ke.left,sx:{width:t,height:e,overflow:"hidden",position:"relative"},children:n});function D(t){const[e,n]=t.split(".");return{queryID:e,columnKey:n}}function ku(t){return t.includes(".")?D(t):{queryID:"",columnKey:t}}function st(t,e){var i;const{queryID:n,columnKey:r}=D(e);return n?r?((i=t[n])==null?void 0:i.map(o=>o[r]))??[]:t[n]:[]}function Wt(t,e){const{queryID:n}=D(e);return n?t[n]:[]}function Tu(t){return Object.values(t)[0]}function un(t,e){const{queryID:n,columnKey:r}=D(e);return t[r]}const hs={x_axis_data_key:"",y_axis_data_key:"",z_axis_data_key:"",xAxis3D:{type:"value",name:"X Axis Name"},yAxis3D:{type:"value",name:"Y Axis Name"},zAxis3D:{type:"value",name:"Z Axis Name"}};K.use([P.GridComponent,P.VisualMapComponent,P.LegendComponent,P.TooltipComponent,we.CanvasRenderer]);function Iu({context:t}){const{value:e}=O(t.instanceData,"config"),n=t.data,{width:r,height:i}=t.viewport,{x_axis_data_key:o,y_axis_data_key:l,z_axis_data_key:c,xAxis3D:u,yAxis3D:d,zAxis3D:h}=y.defaults({},e,hs),p=f.useMemo(()=>Wt(n,o),[n,o]),{x,y:m,z:j}=f.useMemo(()=>({x:D(o),y:D(l),z:D(c)}),[o,l,c]),{min:C,max:T}=f.useMemo(()=>{const L=y.minBy(p,se=>se[j.columnKey]),J=y.maxBy(p,se=>se[j.columnKey]);return{min:y.get(L,j.columnKey),max:y.get(J,j.columnKey)}},[p,j]),z={tooltip:{},backgroundColor:"#fff",visualMap:{show:!0,dimension:2,min:C,max:T,inRange:{color:["#313695","#4575b4","#74add1","#abd9e9","#e0f3f8","#ffffbf","#fee090","#fdae61","#f46d43","#d73027","#a50026"]}},xAxis3D:u,yAxis3D:d,zAxis3D:h,grid3D:{viewControl:{projection:"orthographic",autoRotate:!1},light:{main:{shadow:!0,quality:"ultra",intensity:1.5}}},series:[{type:"bar3D",wireframe:{},data:p.map(L=>[L[x.columnKey],L[m.columnKey],L[j.columnKey]])}]};return e?s.jsx(Te,{width:r,height:i,children:s.jsx(ve,{echarts:K,option:z,style:Gt(r,i),notMerge:!0,theme:"merico-light"})}):null}const Si=f.createContext(null),xs=Si.Provider;function fs(){const t=f.useContext(Si);if(!t)throw new Error("Please use DashboardModelContextProvider");return t}const U=()=>fs(),gs=()=>fs(),_i=f.createContext({searchButtonProps:{}}),ms=_i.Provider;function ki(){return f.useContext(_i)}const Ti=f.createContext(null),ys=Ti.Provider;function Ii(){const t=f.useContext(Ti);if(!t)throw new Error("Please use ContentModelContextProvider");return t}const Y=()=>Ii(),oe=()=>Ii(),Du={inEditMode:!1},dn=f.createContext(Du),Di=f.createContext({panel:null,data:{},loading:!1,errors:[],downloadPanelScreenshot:()=>{}}),bs=Di.Provider;function Mi(){const t=f.useContext(Di);if(!t.panel)throw new Error("Please use PanelContextProvider");return t}const ct=()=>Mi(),Le=()=>Mi(),Mu={fullScreenPanelID:"",setFullScreenPanelID:y.noop},js=f.createContext(Mu);function zi(){const t=f.useContext(js);if(!t)throw new Error("Please use FullScreenPanelContext.Provider");return t}const B=S.observer(f.forwardRef(({label:t,required:e,value:n,onChange:r,clearable:i=!1,sx:o,...l},c)=>{const{panel:u}=Le(),d=f.useMemo(()=>{const h=[...u.dataFieldOptions];return i&&h.unshift({label:"unset",value:"",group:""}),h},[u.dataFieldOptions]);return s.jsx(a.Select,{ref:c,label:t,data:d,value:n,onChange:r,required:e,sx:o,maxDropdownHeight:500,...l})}));function zu({context:t}){const{value:e,set:n}=O(t.instanceData,"config"),r=y.defaults({},e,hs),{control:i,handleSubmit:o,reset:l}=b.useForm({defaultValues:r});return f.useEffect(()=>{l(r)},[e]),e?s.jsx(a.Stack,{spacing:"xs",children:s.jsxs("form",{onSubmit:o(n),children:[s.jsx(a.Text,{children:"X Axis"}),s.jsxs(a.Group,{position:"apart",grow:!0,p:"md",sx:{position:"relative",border:"1px solid #eee"},children:[s.jsx(b.Controller,{name:"x_axis_data_key",control:i,render:({field:c})=>s.jsx(B,{label:"Data Field",required:!0,...c})}),s.jsx(b.Controller,{name:"xAxis3D.name",control:i,render:({field:c})=>s.jsx(a.TextInput,{sx:{flexGrow:1},size:"md",label:"Name",...c})})]}),s.jsx(a.Text,{mt:"lg",children:"Y Axis"}),s.jsxs(a.Group,{position:"apart",grow:!0,p:"md",sx:{position:"relative",border:"1px solid #eee"},children:[s.jsx(b.Controller,{name:"y_axis_data_key",control:i,render:({field:c})=>s.jsx(B,{label:"Data Field",required:!0,...c})}),s.jsx(b.Controller,{name:"yAxis3D.name",control:i,render:({field:c})=>s.jsx(a.TextInput,{sx:{flexGrow:1},size:"md",label:"Name",...c})})]}),s.jsx(a.Text,{mt:"lg",children:"Z Axis"}),s.jsxs(a.Group,{position:"apart",grow:!0,p:"md",sx:{position:"relative",border:"1px solid #eee"},children:[s.jsx(b.Controller,{name:"z_axis_data_key",control:i,render:({field:c})=>s.jsx(B,{label:"Data Field",required:!0,...c})}),s.jsx(b.Controller,{name:"zAxis3D.name",control:i,render:({field:c})=>s.jsx(a.TextInput,{sx:{flexGrow:1},size:"md",label:"Name",...c})})]}),s.jsx(a.Group,{position:"center",mt:"xl",grow:!0,sx:{width:"60%"},mx:"auto",children:s.jsxs(a.Button,{color:"blue",type:"submit",children:[s.jsx(_.DeviceFloppy,{size:20}),s.jsx(a.Text,{ml:"md",children:"Save"})]})})]})}):null}function Au(t,{panelModel:e}){try{const n=e.queryIDs[0];if(!n)throw new Error("cannot migrate when queryID is empty");const r=u=>u&&`${n}.${u}`,{x_axis_data_key:i,y_axis_data_key:o,z_axis_data_key:l,...c}=t;return{...c,x_axis_data_key:r(i),y_axis_data_key:r(o),z_axis_data_key:r(l)}}catch(n){throw console.error("[Migration failed]",n),n}}class Eu extends re{constructor(){super(...arguments);A(this,"VERSION",2)}configVersions(){this.version(1,n=>({version:1,config:n})),this.version(2,(n,r)=>{const{config:i}=n;return{...n,version:2,config:Au(i,r)}})}}const Pu={displayName:"Bar Chart (3D)",displayGroup:"ECharts-based charts",migrator:new Eu,name:"bar-3d",viewRender:Iu,configRender:zu,createConfig(){return{version:2,config:y.cloneDeep(hs)}}};class Ce extends f.Component{constructor(e){super(e),this.state={error:null}}componentDidCatch(e){this.setState({error:e})}render(){var e;if(this.state.error){const n=()=>{this.setState({error:null})};return s.jsxs(a.Box,{children:[s.jsx(a.Text,{size:"xs",children:(e=this.state.error)==null?void 0:e.message}),s.jsx(a.Button,{variant:"subtle",size:"xs",mx:"auto",compact:!0,sx:{display:"block"},onClick:n,children:"Retry"})]})}return this.props.children}}const ye={mantissa:0,output:"number",trimMantissa:!1,average:!1};function Lu({value:t,onChange:e},n){const r=c=>{e({...t,output:c})},i=c=>{const u=c===0?!1:t.trimMantissa;e({...t,mantissa:c,trimMantissa:u})},o=c=>{e({...t,trimMantissa:c.currentTarget.checked})},l=c=>{e({...t,average:c.currentTarget.checked})};return s.jsxs(a.Stack,{ref:n,children:[s.jsxs(a.Group,{grow:!0,children:[s.jsx(a.Select,{label:"Format",data:[{label:"1234",value:"number"},{label:"99%",value:"percent"}],value:t.output,onChange:r,sx:{flexGrow:1}}),s.jsx(a.Switch,{label:s.jsxs(a.Stack,{spacing:0,children:[s.jsx(a.Text,{children:"Average"}),s.jsx(a.Text,{size:12,color:"gray",children:"like 1.234k, 1.234m"})]}),checked:t.average,onChange:l,disabled:t.output!=="number",sx:{flexGrow:1},styles:{root:{alignSelf:"flex-end"},body:{alignItems:"center"},label:{display:"block"}}})]}),s.jsxs(a.Group,{grow:!0,children:[s.jsx(a.NumberInput,{label:"Mantissa",defaultValue:0,min:0,step:1,max:4,value:t.mantissa,onChange:i}),s.jsx(a.Switch,{label:"Trim mantissa",checked:t.trimMantissa,onChange:o,disabled:t.mantissa===0,styles:{root:{alignSelf:"flex-end"},body:{alignItems:"center"}}})]}),s.jsxs(a.Stack,{spacing:0,children:[s.jsx(a.Text,{weight:"bold",children:"Preview"}),s.jsx(Ce,{children:s.jsxs(a.Group,{position:"apart",children:[s.jsxs(a.Text,{size:12,color:"gray",children:["123456789 ",s.jsx(_.ArrowRight,{size:9})," ",F(123456789).format(t)]}),s.jsxs(a.Text,{size:12,color:"gray",children:["1234 ",s.jsx(_.ArrowRight,{size:9})," ",F(1234).format(t)]}),s.jsxs(a.Text,{size:12,color:"gray",children:["0.1234 ",s.jsx(_.ArrowRight,{size:9})," ",F(.1234).format(t)]})]})})]})]})}const ze=f.forwardRef(Lu),Be={enabled:!1,func_content:["function label(value, index) {"," // your code goes here"," // return value","}"].join(`
54
+ `;function os(t,e){const n=Object.keys(e),r=Object.values(e);try{return new Function(...n,`return \`${t}\`;`)(...r)}catch(i){throw n.length===0&&t.includes("$")?new Error("[formatSQL] insufficient payload"):i}}function ls(t,e){try{return os(t,e)}catch(n){return console.error(n),n.message}}function ru({sql:t,pre_process:e}){if(!e.trim())return t;try{return new Function(`return ${e}`)()({sql:t},ft)}catch(n){return console.error(n),t}}function iu(t,e,n){if(!t.trim())return e;try{return new Function(`return ${t}`)()(e,ft,n)}catch(r){return console.error(r),e}}function au(t){t=t||{};const e=Object.keys(t).sort(),n=[];for(let r=0;r<e.length;r++){const i=e[r];if(i!="authentication"&&t[i])n.push(e[r]+"="+(typeof t[i]=="object"?JSON.stringify(t[i]):t[i]));else{const o=Object.keys(t[i]).sort();for(let l=0;l<o.length;l++){const c=o[l];c!="sign"&&t[i][c]&&n.push(o[l]+"="+(typeof t[i][c]=="object"?JSON.stringify(t[i][c]):t[i][c]))}}}return n.sort().join("&")}function ou(t,e){let n=au(t);return n+="&key="+e,Jc.MD5(n).toString().toUpperCase()}class xi{constructor(){this.type="default_api_client",this.baseURL="http://localhost:31200",this.app_id="",this.app_secret=""}getAuthentication(e){if(!this.app_id||!this.app_secret)return;const n=new Date().getTime().toString();return{app_id:this.app_id,nonce_str:n,sign:ou({app_id:this.app_id,nonce_str:n,...e},this.app_secret)}}getRequest(e,n){return(r,i,o,l)=>{const c=this.buildHeader(o),u=this.buildAxiosConfig(e,r,i,o,c,n);return et(u).then(d=>l?d:d.data).catch(d=>Promise.reject(d))}}get(e){return this.getRequest("GET",e)}post(e){return this.getRequest("POST",e)}put(e){return this.getRequest("PUT",e)}buildAxiosConfig(e,n,r,i,o,l){const c={baseURL:this.baseURL,method:e,url:n,params:e==="GET"?r:i.params,headers:o,signal:l};return["POST","PUT"].includes(e)&&(c.data=i.string?JSON.stringify(r):r,c.data.authentication=this.getAuthentication(c.data)),c}buildHeader(e){const n=window.localStorage.getItem("token");return{"X-Requested-With":"XMLHttpRequest","Content-Type":e.string?"application/x-www-form-urlencoded":"application/json",authorization:n?`bearer ${n}`:"",...e.headers}}}class lu{constructor(e){this.implementation=e}getRequest(e,n){return this.implementation.getRequest(e,n)}get(e){return this.getRequest("GET",e)}post(e){return this.getRequest("POST",e)}put(e){return this.getRequest("PUT",e)}}class fi extends xi{constructor(){super(...arguments);A(this,"makeQueryENV",null)}query(n){return async(r,i={})=>{var o;return r.env||(r.env=((o=this.makeQueryENV)==null?void 0:o.call(this))??{error:"failed to run makeQueryENV"}),this.post(n)("/query",r,i)}}httpDataSourceQuery(n){return async(r,i={})=>{var o;return r.env||(r.env=((o=this.makeQueryENV)==null?void 0:o.call(this))??{error:"failed to run makeQueryENV"}),this.getRequest("POST",n)("/query",r,i,!0)}}structure(n){return async(r,i={})=>this.post(n)("/query/structure",r,i)}}class gi{constructor(e){this.implementation=e}query(e){return this.implementation.query(e)}httpDataSourceQuery(e){return this.implementation.httpDataSourceQuery(e)}structure(e){return this.implementation.structure(e)}getRequest(e,n){return this.implementation.getRequest(e,n)}get(e){return this.getRequest("GET",e)}post(e){return this.getRequest("POST",e)}put(e){return this.getRequest("PUT",e)}}const Tt=new fi;function cs(t){Tt.baseURL!==t.apiBaseURL&&(Tt.baseURL=t.apiBaseURL),t.app_id&&(Tt.app_id=t.app_id),t.app_secret&&(Tt.app_secret=t.app_secret),t.makeQueryENV&&(Tt.makeQueryENV=t.makeQueryENV)}const mi=new gi(Tt),Ue=mi;function yi(){return{filters:{},context:{}}}function us(t){const e=yi();if(!t)return yi();const{filters:n=e.filters,context:r=e.context}=t;return{filters:n,context:r}}async function cu({query:t,name:e,payload:n,additionals:r},i){if(!t.sql)return[];const{type:o,key:l,sql:c,pre_process:u,post_process:d}=t,h=os(c,n),p=ru({sql:h,pre_process:u});let x=await Ue.query(i)({type:o,key:l,query:p,...r},{params:{name:e}});return x=iu(d,x,us(n)),x}async function uu({type:t,key:e,configString:n,name:r,additionals:i},o){try{return await Ue.httpDataSourceQuery(o)({type:t,key:e,query:n,...i},{params:{name:r}})}catch(l){if(et.isCancel(l))throw l;return console.error(l),l}}async function ds(){try{return(await Ue.post()("/datasource/list",{filter:{},sort:[{field:"create_time",order:"ASC"}],pagination:{page:1,pagesize:100}},{})).data}catch(t){return console.error(t),[]}}async function bi(){try{return(await Ue.post()("/sql_snippet/list",{filter:{},sort:[{field:"id",order:"ASC"}],pagination:{page:1,pagesize:1e3}},{})).data}catch(t){return console.error(t),[]}}class ji{constructor(e){A(this,"rootRef");this.rootRef=W.observable({current:e})}async deleteItem(e){W.runInAction(()=>{y.unset(this.rootRef.current,[e])})}getItem(e){const n=this.getValueFromRoot(e);return Promise.resolve(n)}getValueFromRoot(e){return e===null?W.toJS(this.rootRef.current):y.get(this.rootRef.current,[e])}setItem(e,n){if(e===null)if(y.isObject(n))W.runInAction(()=>{this.rootRef.current=n});else throw new Error("Cannot set root value to non-object");else W.runInAction(()=>{y.set(this.rootRef.current,[e],n)});return Promise.resolve(this.getItem(e))}watchItem(e,n,r){return W.reaction(()=>this.getValueFromRoot(e),(i,o)=>{n(i,o)},{requiresObservable:!0,fireImmediately:y.get(r,"fireImmediately",!1)})}}class du{constructor(){A(this,"channels",new Map);A(this,"globalChannel",new Ur)}getChannel(e){const n=this.channels.get(e);if(n)return n;const r=new Ur;return this.channels.set(e,r),r}}class pu{constructor(e){A(this,"instances",new Map);this.pluginManager=e}get availableVizList(){return this.pluginManager.installedPlugins.flatMap(e=>e.manifest.viz)}resolveComponent(e){return this.pluginManager.factory.viz(e)}getOrCreateInstance(e){const n=this.instances.get(e.id);if(n)return n;const r={id:e.id,name:e.viz.type,type:e.viz.type,messageChannels:new du,instanceData:new ji(e.viz.conf)};return this.instances.set(e.id,r),r}}function vi(t,e,n,r){return{vizManager:n,locale:"zh",msgChannels:t.messageChannels,instanceData:t.instanceData,pluginData:new ji({}),colorPalette:{getColor(){return()=>""}},data:e,variables:r}}const hu=t=>{const{panel:e,vizManager:n,data:r,variables:i}=t,o=n.resolveComponent(e.viz.type),l=n.getOrCreateInstance(e),c={...vi(l,r,n,i),viewport:{width:e.layout.w,height:e.layout.h}},u=o.viewRender;return s.jsx(u,{context:c,instance:l,...y.omit(t,["panel","vizManager","data"])})},xu=t=>{const{vizManager:e,panel:n,data:r,variables:i}=t,o=e.resolveComponent(n.viz.type),l=e.getOrCreateInstance(n),c={...vi(l,r,e,i)},u=o.configRender;return s.jsx(u,{context:c,instance:l,...y.omit(t,["panel","vizManager","data"])})},wi=(t,e)=>{const n=tt.bezier(t),r=tt.bezier(e);return function(i){return i<50?n(i*2/100).hex():r((i-50)*2/100).hex()}},cn=t=>{const e=tt.bezier(t);return function(n){return e(n/100).hex()}},fu={type:"interpolation",displayName:"Red / Green",getColor:wi(["darkred","deeppink","lightyellow"],["lightyellow","lightgreen","teal"]),name:"red-green",category:"diverging"},gu={type:"interpolation",displayName:"Yellow / Blue",getColor:wi(["#8f531d","#ffd347","#e3efe3"],["#eefaee","#4ecbbf","#003f94"]),name:"yellow-blue",category:"diverging"},mu={type:"interpolation",displayName:"Red",getColor:cn(["#fff7f1","darkred"]),name:"red",category:"sequential"},yu={type:"interpolation",displayName:"Green",getColor:cn(["#f0ffed","darkgreen"]),name:"green",category:"sequential"},bu={type:"interpolation",displayName:"Blue",getColor:cn(["#f9fcff","#48b3e9","darkblue"]),name:"blue",category:"sequential"},ju={type:"interpolation",displayName:"Orange",getColor:cn(["#fff7f1","darkorange","#b60000"]),name:"orange",category:"sequential"};class vu{constructor(e){A(this,"symbol");this.symbol=Symbol(e)}}function nt(t){return new vu(t)}class ps{constructor(){A(this,"parent");A(this,"factoryRegistry",new Map);A(this,"instanceRegistry",new Map)}createScoped(){const e=new ps;return e.parent=this,e}getRequired(e){return this.get(e)}get(e){if(this.instanceRegistry.has(e.symbol))return this.instanceRegistry.get(e.symbol);const n=this.factoryRegistry.get(e.symbol);if(n){const r=n(this);return this.instanceRegistry.set(e.symbol,r),r}if(this.parent)return this.parent.get(e)}provideFactory(e,n){return this.factoryRegistry.has(e.symbol)?console.warn(`Token ${e.symbol.toString()} is already registered`):this.factoryRegistry.set(e.symbol,n),this}provideValue(e,n){return this.factoryRegistry.has(e.symbol)?console.warn(`Token ${e.symbol.toString()} is already registered`):this.factoryRegistry.set(e.symbol,()=>n),this}dispose(){this.instanceRegistry.forEach(e=>{const n=y.get(e,"dispose");y.isFunction(n)&&n.bind(e)()}),this.instanceRegistry.clear(),this.factoryRegistry.clear()}}const Ci="10.47.0",wu=Object.freeze(Object.defineProperty({__proto__:null,version:Ci},Symbol.toStringTag,{value:"Module"}));class Cu{constructor(e){A(this,"staticColors",new Map);A(this,"interpolations",new Map);e.installedPlugins.forEach(n=>{n.manifest.color.forEach(r=>{this.register(r)})})}getStaticColors(){return Array.from(this.staticColors.values())}register(e){const n=this.encodeColor(e);e.type==="single"?(this.staticColors.has(n)&&console.warn(`the color '${e.name}' has been registered under '${e.category}', previous registered value will be overridden`),this.staticColors.set(n,e)):e.type==="interpolation"&&(this.interpolations.has(n)&&console.warn(`the interpolation '${e.name}' has been registered under '${e.category}', previous registered value will be overridden`,`the interpolation '${e.name}' has been registered under '${e.category}', previous registered value will be overridden`),this.interpolations.set(n,e))}decodeStaticColor(e){return this.staticColors.get(e)}encodeColor(e){return`\${${e.category}}.{${e.name}}`}decodeInterpolation(e){return this.interpolations.get(e)}getColorInterpolations(){return Array.from(this.interpolations.values())}}class Su{constructor(){A(this,"plugins",new Map);A(this,"vizComponents",new Map);A(this,"factory",{viz:e=>{const n=this.vizComponents.get(e);if(n)return n;throw new Error(`Viz Component (${e}) not found`)}})}install(e){if(this.plugins.has(e.id))throw new Error(`Plugin (${e.id}) has been installed before`);this.plugins.set(e.id,e);for(const n of e.manifest.viz){if(this.vizComponents.has(n.name))throw new Error(`Viz Component (${n.name}) has been installed before`);this.vizComponents.set(n.name,n)}}get installedPlugins(){return Array.from(this.plugins.values())}}class _u{constructor(){A(this,"migrations",[])}version(e,n){return this.migrations.push({version:e,handler:n}),this}run(e,n,r){var l;if(e.from===e.to)return n;if(e.from>e.to)throw new Error(`Can not downgrade from version '${e.from}' to (${e.to})`);const i=this.migrations.filter(c=>c.version>e.from&&c.version<=e.to),o=y.orderBy(i,"version","asc");if(((l=y.last(o))==null?void 0:l.version)!==e.to)throw new Error(`Migration to version ${e.to} not found`);return o.reduce((c,u)=>u.handler(c,r),n)}}class re extends _u{constructor(){super(),this.configVersions()}version(e,n){return super.version(e,(r,i)=>({version:e,...n(r,i)}))}async migrate({configData:e,panelModel:n}){const r=await e.getItem(null),i=y.get(r,"version",0),o=this.run({from:i,to:this.VERSION},r,{panelModel:n});await e.setItem(null,o)}async needMigration({configData:e}){const n=await e.getItem(null);return y.get(n,"version",0)<this.VERSION}}const O=(t,e)=>{const[n,{setFalse:r}]=$.useBoolean(!0),[i,o]=f.useState();f.useEffect(()=>(t.getItem(e).then(c=>{o(c),r()}),t.watchItem(e,c=>{o(c)})));const l=f.useCallback(async c=>{await t.setItem(e,c),o(c)},[t,e]);return{loading:n,value:i,set:l}},ke={top:16,right:16,bottom:16,left:16},Ge=t=>Math.max(0,t-ke.left-ke.right),We=t=>Math.max(0,t-ke.top-ke.bottom),Gt=(t,e)=>({width:Ge(t),height:We(e)}),Te=({width:t,height:e,children:n})=>s.jsx(a.Box,{pt:ke.top,pr:ke.right,pb:ke.bottom,pl:ke.left,sx:{width:t,height:e,overflow:"hidden",position:"relative"},children:n});function D(t){const[e,n]=t.split(".");return{queryID:e,columnKey:n}}function ku(t){return t.includes(".")?D(t):{queryID:"",columnKey:t}}function st(t,e){var i;const{queryID:n,columnKey:r}=D(e);return n?r?((i=t[n])==null?void 0:i.map(o=>o[r]))??[]:t[n]:[]}function Wt(t,e){const{queryID:n}=D(e);return n?t[n]:[]}function Tu(t){return Object.values(t)[0]}function un(t,e){const{queryID:n,columnKey:r}=D(e);return t[r]}const hs={x_axis_data_key:"",y_axis_data_key:"",z_axis_data_key:"",xAxis3D:{type:"value",name:"X Axis Name"},yAxis3D:{type:"value",name:"Y Axis Name"},zAxis3D:{type:"value",name:"Z Axis Name"}};K.use([P.GridComponent,P.VisualMapComponent,P.LegendComponent,P.TooltipComponent,we.CanvasRenderer]);function Iu({context:t}){const{value:e}=O(t.instanceData,"config"),n=t.data,{width:r,height:i}=t.viewport,{x_axis_data_key:o,y_axis_data_key:l,z_axis_data_key:c,xAxis3D:u,yAxis3D:d,zAxis3D:h}=y.defaults({},e,hs),p=f.useMemo(()=>Wt(n,o),[n,o]),{x,y:m,z:j}=f.useMemo(()=>({x:D(o),y:D(l),z:D(c)}),[o,l,c]),{min:C,max:T}=f.useMemo(()=>{const L=y.minBy(p,se=>se[j.columnKey]),J=y.maxBy(p,se=>se[j.columnKey]);return{min:y.get(L,j.columnKey),max:y.get(J,j.columnKey)}},[p,j]),z={tooltip:{},backgroundColor:"#fff",visualMap:{show:!0,dimension:2,min:C,max:T,inRange:{color:["#313695","#4575b4","#74add1","#abd9e9","#e0f3f8","#ffffbf","#fee090","#fdae61","#f46d43","#d73027","#a50026"]}},xAxis3D:u,yAxis3D:d,zAxis3D:h,grid3D:{viewControl:{projection:"orthographic",autoRotate:!1},light:{main:{shadow:!0,quality:"ultra",intensity:1.5}}},series:[{type:"bar3D",wireframe:{},data:p.map(L=>[L[x.columnKey],L[m.columnKey],L[j.columnKey]])}]};return e?s.jsx(Te,{width:r,height:i,children:s.jsx(ve,{echarts:K,option:z,style:Gt(r,i),notMerge:!0,theme:"merico-light"})}):null}const Si=f.createContext(null),xs=Si.Provider;function fs(){const t=f.useContext(Si);if(!t)throw new Error("Please use DashboardModelContextProvider");return t}const U=()=>fs(),gs=()=>fs(),_i=f.createContext({searchButtonProps:{}}),ms=_i.Provider;function ki(){return f.useContext(_i)}const Ti=f.createContext(null),ys=Ti.Provider;function Ii(){const t=f.useContext(Ti);if(!t)throw new Error("Please use ContentModelContextProvider");return t}const Y=()=>Ii(),oe=()=>Ii(),Du={inEditMode:!1},dn=f.createContext(Du),Di=f.createContext({panel:null,data:{},loading:!1,errors:[],downloadPanelScreenshot:()=>{}}),bs=Di.Provider;function Mi(){const t=f.useContext(Di);if(!t.panel)throw new Error("Please use PanelContextProvider");return t}const ct=()=>Mi(),Le=()=>Mi(),Mu={fullScreenPanelID:"",setFullScreenPanelID:y.noop},js=f.createContext(Mu);function zi(){const t=f.useContext(js);if(!t)throw new Error("Please use FullScreenPanelContext.Provider");return t}const B=S.observer(f.forwardRef(({label:t,required:e,value:n,onChange:r,clearable:i=!1,sx:o,...l},c)=>{const{panel:u}=Le(),d=f.useMemo(()=>{const h=[...u.dataFieldOptions];return i&&h.unshift({label:"unset",value:"",group:""}),h},[u.dataFieldOptions]);return s.jsx(a.Select,{ref:c,label:t,data:d,value:n,onChange:r,required:e,sx:o,maxDropdownHeight:500,...l})}));function zu({context:t}){const{value:e,set:n}=O(t.instanceData,"config"),r=y.defaults({},e,hs),{control:i,handleSubmit:o,reset:l}=b.useForm({defaultValues:r});return f.useEffect(()=>{l(r)},[e]),e?s.jsx(a.Stack,{spacing:"xs",children:s.jsxs("form",{onSubmit:o(n),children:[s.jsx(a.Text,{children:"X Axis"}),s.jsxs(a.Group,{position:"apart",grow:!0,p:"md",sx:{position:"relative",border:"1px solid #eee"},children:[s.jsx(b.Controller,{name:"x_axis_data_key",control:i,render:({field:c})=>s.jsx(B,{label:"Data Field",required:!0,...c})}),s.jsx(b.Controller,{name:"xAxis3D.name",control:i,render:({field:c})=>s.jsx(a.TextInput,{sx:{flexGrow:1},size:"md",label:"Name",...c})})]}),s.jsx(a.Text,{mt:"lg",children:"Y Axis"}),s.jsxs(a.Group,{position:"apart",grow:!0,p:"md",sx:{position:"relative",border:"1px solid #eee"},children:[s.jsx(b.Controller,{name:"y_axis_data_key",control:i,render:({field:c})=>s.jsx(B,{label:"Data Field",required:!0,...c})}),s.jsx(b.Controller,{name:"yAxis3D.name",control:i,render:({field:c})=>s.jsx(a.TextInput,{sx:{flexGrow:1},size:"md",label:"Name",...c})})]}),s.jsx(a.Text,{mt:"lg",children:"Z Axis"}),s.jsxs(a.Group,{position:"apart",grow:!0,p:"md",sx:{position:"relative",border:"1px solid #eee"},children:[s.jsx(b.Controller,{name:"z_axis_data_key",control:i,render:({field:c})=>s.jsx(B,{label:"Data Field",required:!0,...c})}),s.jsx(b.Controller,{name:"zAxis3D.name",control:i,render:({field:c})=>s.jsx(a.TextInput,{sx:{flexGrow:1},size:"md",label:"Name",...c})})]}),s.jsx(a.Group,{position:"center",mt:"xl",grow:!0,sx:{width:"60%"},mx:"auto",children:s.jsxs(a.Button,{color:"blue",type:"submit",children:[s.jsx(_.DeviceFloppy,{size:20}),s.jsx(a.Text,{ml:"md",children:"Save"})]})})]})}):null}function Au(t,{panelModel:e}){try{const n=e.queryIDs[0];if(!n)throw new Error("cannot migrate when queryID is empty");const r=u=>u&&`${n}.${u}`,{x_axis_data_key:i,y_axis_data_key:o,z_axis_data_key:l,...c}=t;return{...c,x_axis_data_key:r(i),y_axis_data_key:r(o),z_axis_data_key:r(l)}}catch(n){throw console.error("[Migration failed]",n),n}}class Eu extends re{constructor(){super(...arguments);A(this,"VERSION",2)}configVersions(){this.version(1,n=>({version:1,config:n})),this.version(2,(n,r)=>{const{config:i}=n;return{...n,version:2,config:Au(i,r)}})}}const Pu={displayName:"Bar Chart (3D)",displayGroup:"ECharts-based charts",migrator:new Eu,name:"bar-3d",viewRender:Iu,configRender:zu,createConfig(){return{version:2,config:y.cloneDeep(hs)}}};class Ce extends f.Component{constructor(e){super(e),this.state={error:null}}componentDidCatch(e){this.setState({error:e})}render(){var e;if(this.state.error){const n=()=>{this.setState({error:null})};return s.jsxs(a.Box,{children:[s.jsx(a.Text,{size:"xs",children:(e=this.state.error)==null?void 0:e.message}),s.jsx(a.Button,{variant:"subtle",size:"xs",mx:"auto",compact:!0,sx:{display:"block"},onClick:n,children:"Retry"})]})}return this.props.children}}const ye={mantissa:0,output:"number",trimMantissa:!1,average:!1};function Lu({value:t,onChange:e},n){const r=c=>{e({...t,output:c})},i=c=>{const u=c===0?!1:t.trimMantissa;e({...t,mantissa:c,trimMantissa:u})},o=c=>{e({...t,trimMantissa:c.currentTarget.checked})},l=c=>{e({...t,average:c.currentTarget.checked})};return s.jsxs(a.Stack,{ref:n,children:[s.jsxs(a.Group,{grow:!0,children:[s.jsx(a.Select,{label:"Format",data:[{label:"1234",value:"number"},{label:"99%",value:"percent"}],value:t.output,onChange:r,sx:{flexGrow:1}}),s.jsx(a.Switch,{label:s.jsxs(a.Stack,{spacing:0,children:[s.jsx(a.Text,{children:"Average"}),s.jsx(a.Text,{size:12,color:"gray",children:"like 1.234k, 1.234m"})]}),checked:t.average,onChange:l,disabled:t.output!=="number",sx:{flexGrow:1},styles:{root:{alignSelf:"flex-end"},body:{alignItems:"center"},label:{display:"block"}}})]}),s.jsxs(a.Group,{grow:!0,children:[s.jsx(a.NumberInput,{label:"Mantissa",defaultValue:0,min:0,step:1,max:4,value:t.mantissa,onChange:i}),s.jsx(a.Switch,{label:"Trim mantissa",checked:t.trimMantissa,onChange:o,disabled:t.mantissa===0,styles:{root:{alignSelf:"flex-end"},body:{alignItems:"center"}}})]}),s.jsxs(a.Stack,{spacing:0,children:[s.jsx(a.Text,{weight:"bold",children:"Preview"}),s.jsx(Ce,{children:s.jsxs(a.Group,{position:"apart",children:[s.jsxs(a.Text,{size:12,color:"gray",children:["123456789 ",s.jsx(_.ArrowRight,{size:9})," ",F(123456789).format(t)]}),s.jsxs(a.Text,{size:12,color:"gray",children:["1234 ",s.jsx(_.ArrowRight,{size:9})," ",F(1234).format(t)]}),s.jsxs(a.Text,{size:12,color:"gray",children:["0.1234 ",s.jsx(_.ArrowRight,{size:9})," ",F(.1234).format(t)]})]})})]})]})}const ze=f.forwardRef(Lu),Be={enabled:!1,func_content:["function label(value, index) {"," // your code goes here"," // return value","}"].join(`
55
55
  `)},Ai={id:"builtin:echarts:click-echart:series",displayName:"Click Chart Series",nameRender:Ou,configRender:Bu,payload:[{name:"type",description:"Always 'click'",valueType:"string"},{name:"seriesType",description:"'boxplot'",valueType:"string"},{name:"name",description:"Name of the series clicked",valueType:"string"},{name:"color",description:"Color",valueType:"string"},{name:"value",description:"Record of 'name', 'min', 'q1', 'median', 'q3', 'max'",valueType:"object"},{name:"rowData",description:"Data of the row",valueType:"object"}]};function Bu(t){return s.jsx(s.Fragment,{})}function Ou(t){return s.jsx(a.Text,{children:"Click chart's series"})}const $u=[{label:"Truncate",value:"truncate"},{label:"Break Line",value:"break"},{label:"Break Word",value:"breakAll"}],pn=f.forwardRef(({sectionTitle:t,value:e,onChange:n},r)=>{const i=o=>l=>{const c=y.cloneDeep(e);y.set(c,o,l),n(c)};return s.jsxs(a.Stack,{spacing:0,children:[t&&s.jsx(a.Divider,{mb:-5,mt:5,variant:"dotted",label:t,labelPosition:"right",labelProps:{color:"dimmed"}}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(a.NumberInput,{label:"Max Width",hideControls:!0,value:e.width,onChange:i("width")}),s.jsx(a.Select,{label:"Overflow",data:$u,value:e.overflow,onChange:i("overflow")}),s.jsx(a.TextInput,{label:"Ellipsis",value:e.ellipsis,disabled:!0})]})]})}),Ye=f.forwardRef(({value:t,onChange:e},n)=>{const r=o=>{e({...t,on_axis:o})},i=o=>{e({...t,in_tooltip:o})};return s.jsxs(a.Stack,{ref:n,spacing:0,children:[s.jsx(pn,{sectionTitle:"Overflow on Axis",value:t.on_axis,onChange:r}),s.jsx(pn,{sectionTitle:"Overflow in Tooltip",value:t.in_tooltip,onChange:i})]})}),Ae={on_axis:{width:80,overflow:"truncate",ellipsis:"..."},in_tooltip:{width:200,overflow:"break",ellipsis:"..."}};function Xe({overflow:t,width:e}){const n={truncate:"initial",break:"break-all",breakAll:"break-word"}[t],r=t==="truncate"?"nowrap":"initial",i={truncate:"ellipsis",break:"clip",breakAll:"clip"}[t];return`
56
56
  max-width: ${e}px;
57
57
  word-break: ${n};
@@ -118,7 +118,7 @@ Check the top-level render call using <`+M+">.")}return I}}function rc(v,I){{if(
118
118
  ${l.join("")}
119
119
  </tbody>
120
120
  </table>
121
- `}}}function Lx(t){return t.y_axes.reduce((n,{label_formatter:r},i)=>(n[i]=function(l){let c=l;if(typeof l=="object"&&(Array.isArray(l.value)&&l.value.length===2?c=l.value[1]:c=l.value),!r)return c;try{return F(c).format(r)}catch(u){return console.error(u),c}},n),{default:({value:n})=>n})}function ja(t,e){const n={};return e.map(r=>{const i=it(r,t);n[r.name]=qe(r,i)}),n}function Bx(t,e){const{overflow:n,...r}=t.x_axis.axisLabel,i=Re(n.on_axis);return[{data:e,name:t.x_axis_name??"",id:"main-x-axis",axisTick:{show:!0,alignWithLabel:!0},type:t.x_axis.type,axisLabel:{...r,...i,formatter:Dt(r.formatter)}}]}function Ox(t){var e;try{return Array.isArray(t[0])&&((e=t[0])==null?void 0:e.length)>=2?t.map(r=>Number(r[1])):[...t]}catch(n){return console.error(n),[...t]}}function $x(t){if(t.length===0)return{};const e={},n={};return t.forEach(r=>{const i=Ox(r.data);if(!n[r.yAxisIndex]){n[r.yAxisIndex]=i;return}n[r.yAxisIndex]=n[r.yAxisIndex].concat(i)}),Object.entries(n).forEach(([r,i])=>{const o=y.minBy(i)??0,l=y.maxBy(i)??0;o==0&&l==0&&(e[r]=1)}),e}function Vx(t,e,n){const r=$x(n);return t.y_axes.map(({nameAlignment:i,min:o,max:l,show:c,...u},d)=>{let h=u.position;return h||(h=d>0?"right":"left"),{...u,minInterval:r[d]??0,show:c,min:o||void 0,max:l||void 0,position:h,axisLabel:{show:c,formatter:e[d]??e.default},axisLine:{show:c},nameTextStyle:{fontWeight:"bold",align:i},nameLocation:"end",nameGap:c?15:0,splitLine:{show:!1}}})}const qx={xAxis:[{type:"category",nameGap:25,nameLocation:"center",nameTextStyle:{fontWeight:"bold"},splitLine:{show:!1},axisTick:{show:!0,alignWithLabel:!0}}]};function Nx(t,e,n){const r=ja(e,n),i=Lx(t),o=y.uniq(st(e,t.x_axis_data_key)),l=Ax(t,o,e,i,n,r),c=wx(t,e),u={xAxis:Bx(t,o),yAxis:Vx(t,i,l),series:[...l,...c],tooltip:Px(t,l,i),grid:mx(t),legend:jx(l),dataZoom:Qs(t.dataZoom)};return y.defaultsDeep({},u,qx)}function va(t){const e=t.getModel(),n=e.getSeries().map(r=>{if(!r.option.custom)return r.option;const i=e.getColorFromPalette(r.option.custom.targetSeries,null);return r.option.color=i,r.option});t.setOption({...t.getOption(),series:n})}K.use([P.DataZoomComponent,te.BarChart,te.LineChart,te.ScatterChart,P.GridComponent,P.LegendComponent,P.TooltipComponent,we.CanvasRenderer,P.MarkLineComponent,P.MarkAreaComponent]);function wa(t){return t.trim().length>0}function Fx({conf:t,data:e,width:n,height:r,interactionManager:i,variables:o}){const l=gt(e,t.x_axis_data_key),c=Oe(i.triggerManager,Ws.id),u=f.useCallback(m=>{const j=y.get(l,m.name,{error:"rowData is not found"});c.forEach(C=>{i.runInteraction(C.id,{...m,rowData:j})})},[l,c,i]),d=f.useMemo(()=>Nx(t,e,o),[t,e]),h=f.useRef(),p=f.useMemo(()=>({click:u}),[u]),x=m=>{h.current=m,va(m)};return f.useEffect(()=>{h.current&&va(h.current)},[d]),!n||!r?null:s.jsx(ve,{echarts:K,option:d,style:{width:n,height:r},onEvents:p,onChartReady:x,notMerge:!0,theme:"merico-light"})}function Gx({context:t,instance:e}){const n=$e({vizManager:t.vizManager,instance:e}),{value:r}=O(t.instanceData,"config"),{variables:i}=t,o=f.useMemo(()=>y.defaults({},r,Rs),[r]),l=t.data,{width:c,height:u}=t.viewport,{ref:d,height:h}=pe.useElementSize(),{ref:p,height:x}=pe.useElementSize(),m=f.useMemo(()=>{const{stats:{templates:T}}=o;return{top:Ht(T.top,i,l),bottom:Ht(T.bottom,i,l)}},[o,l]),j=Math.max(0,We(u)-h-x),C=Ge(c);return s.jsxs(Te,{width:c,height:u,children:[s.jsx(a.Text,{ref:d,align:"left",size:"xs",pl:"sm",sx:{display:wa(o.stats.templates.top)?"block":"none"},children:Object.values(m.top).map((T,z)=>s.jsx(f.Fragment,{children:T},z))}),s.jsx(Fx,{variables:i,width:C,height:j,data:l,conf:o,interactionManager:n}),s.jsx(a.Text,{ref:p,align:"left",size:"xs",pl:"sm",sx:{display:wa(o.stats.templates.bottom)?"block":"none"},children:Object.values(m.bottom).map((T,z)=>s.jsx(f.Fragment,{children:T},z))})]})}const Us=f.forwardRef(({value:t,onChange:e},n)=>{const r=i=>o=>{e({...t,[i]:o})};return s.jsxs(a.Stack,{children:[s.jsx(a.Divider,{variant:"dashed",label:"Scroll to Zoom",labelPosition:"center"}),s.jsxs(a.Group,{children:[s.jsx(a.Box,{sx:{flexGrow:1},children:s.jsx(a.Switch,{label:"Enable on X Axis",checked:t.x_axis_scroll,onChange:i=>r("x_axis_scroll")(i.currentTarget.checked)})}),s.jsx(a.Box,{sx:{flexGrow:1},children:s.jsx(a.Switch,{label:"Enable on Y Axis",checked:t.y_axis_scroll,onChange:i=>r("y_axis_scroll")(i.currentTarget.checked)})})]}),s.jsx(a.Divider,{variant:"dashed",label:"Slider for Zooming",labelPosition:"center"}),s.jsxs(a.Group,{children:[s.jsx(a.Box,{sx:{flexGrow:1},children:s.jsx(a.Switch,{label:"Slider for X Axis",checked:t.x_axis_slider,onChange:i=>r("x_axis_slider")(i.currentTarget.checked)})}),s.jsx(a.Tooltip,{label:"Not available for now, will overlap y-axis's label",children:s.jsx(a.Box,{sx:{flexGrow:1},children:s.jsx(a.Switch,{label:"Slider for Y Axis",disabled:!t.y_axis_slider,checked:t.y_axis_slider,onChange:i=>r("y_axis_slider")(i.currentTarget.checked)})})})]})]})}),Wx=[{label:"Rectangle",value:"rectangle"}],Rx=[{label:"Horizontal",value:"horizontal"}];function Qx({control:t,index:e,remove:n,variableOptions:r}){return s.jsxs(a.Stack,{my:0,p:0,sx:{position:"relative"},children:[s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`reference_areas.${e}.name`,control:t,render:({field:i})=>s.jsx(a.TextInput,{label:"Name",required:!0,sx:{flex:1},...i})}),s.jsx(b.Controller,{name:`reference_areas.${e}.color`,control:t,render:({field:i})=>s.jsx(a.TextInput,{label:"Color",required:!0,sx:{flex:1},...i})})]}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`reference_areas.${e}.type`,control:t,render:({field:i})=>s.jsx(a.Select,{label:"Type",required:!0,data:Wx,sx:{flex:1},...i})}),s.jsx(b.Controller,{name:`reference_areas.${e}.direction`,control:t,render:({field:i})=>s.jsx(a.Select,{label:"Direction",required:!0,data:Rx,sx:{flex:1},...i})})]}),s.jsx(a.Divider,{variant:"dashed",label:"Data",labelPosition:"center"}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`reference_areas.${e}.y_keys.upper`,control:t,render:({field:i})=>s.jsx(a.Select,{label:"Upper Boundary",required:!0,data:r,sx:{flex:1},...i})}),s.jsx(b.Controller,{name:`reference_areas.${e}.y_keys.lower`,control:t,render:({field:i})=>s.jsx(a.Select,{label:"Lower Boundary",required:!0,data:r,sx:{flex:1},...i})})]}),s.jsx(a.Button,{leftIcon:s.jsx(_.Trash,{size:16}),color:"red",variant:"light",onClick:()=>n(e),sx:{top:15,right:5},children:"Delete this Reference Area"})]})}function Kx({control:t,watch:e,variables:n}){const{fields:r,append:i,remove:o}=b.useFieldArray({control:t,name:"reference_areas"}),l=e("reference_areas"),c=r.map((h,p)=>({...h,...l[p]})),u=()=>i({name:"",color:"rgba(0,0,0,0.1)",type:"rectangle",direction:"horizontal",y_keys:{upper:"",lower:""}}),d=f.useMemo(()=>n.map(h=>({label:h.name,value:h.name})),[n]);return s.jsxs(a.Tabs,{defaultValue:"0",styles:{tab:{paddingTop:"0px",paddingBottom:"0px"},panel:{padding:"6px 0px 0px"}},children:[s.jsxs(a.Tabs.List,{children:[c.map((h,p)=>s.jsx(a.Tabs.Tab,{value:p.toString(),children:p+1},h.id)),s.jsx(a.Tabs.Tab,{onClick:u,value:"add",children:s.jsx(_.Plus,{size:18,color:"#228be6"})})]}),c.map((h,p)=>s.jsx(a.Tabs.Panel,{value:p.toString(),children:s.jsx(Qx,{control:t,index:p,remove:o,variableOptions:d})},h.id))]})}const Ux=[{label:"solid",value:"solid"},{label:"dashed",value:"dashed"},{label:"dotted",value:"dotted"}],Yx=[{label:"Horizontal",value:"horizontal"},{label:"Vertical",value:"vertical"}];function Xx({control:t,index:e,remove:n,watch:r,variableOptions:i,yAxisOptions:o}){const l=r(`reference_lines.${e}.orientation`);return s.jsxs(a.Stack,{my:0,p:0,sx:{position:"relative"},children:[s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`reference_lines.${e}.name`,control:t,render:({field:c})=>s.jsx(a.TextInput,{label:"Name",placeholder:"Average Reference Line",required:!0,sx:{flex:1},...c})}),s.jsx(b.Controller,{name:`reference_lines.${e}.variable_key`,control:t,render:({field:c})=>s.jsx(a.Select,{label:"Value",required:!0,data:i,sx:{flex:1},...c})})]}),s.jsx(b.Controller,{name:`reference_lines.${e}.template`,control:t,render:({field:c})=>s.jsx(a.TextInput,{label:"Content Template",placeholder:"Average: ${avg}",sx:{flex:1},...c})}),s.jsxs(a.Group,{grow:!0,children:[s.jsxs(a.Stack,{children:[s.jsx(b.Controller,{name:`reference_lines.${e}.orientation`,control:t,render:({field:c})=>s.jsx(a.Select,{label:"Orientation",data:Yx,required:!0,sx:{flex:1},...c})}),l==="vertical"&&s.jsx(a.Text,{mt:-10,color:"dimmed",size:12,children:"Works only when xAxis values are numbers"})]}),l==="horizontal"&&s.jsx(b.Controller,{name:`reference_lines.${e}.yAxisIndex`,control:t,render:({field:{value:c,onChange:u,...d}})=>s.jsx(a.Select,{label:"Y Axis",data:o,disabled:o.length===0,...d,value:(c==null?void 0:c.toString())??"",onChange:h=>{if(!h){u(0);return}u(Number(h))},sx:{flex:1}})})]}),s.jsx(a.Divider,{mb:-10,mt:10,variant:"dashed",label:"Style",labelPosition:"center"}),s.jsxs(a.Group,{grow:!0,children:[s.jsx(b.Controller,{name:`reference_lines.${e}.lineStyle.type`,control:t,render:({field:c})=>s.jsx(a.Select,{label:"Line Type",data:Ux,sx:{flexGrow:1},...c})}),s.jsx(b.Controller,{name:`reference_lines.${e}.lineStyle.width`,control:t,render:({field:c})=>s.jsx(a.NumberInput,{label:"Line Width",min:1,max:10,sx:{flexGrow:1},...c})})]}),s.jsxs(a.Stack,{spacing:4,children:[s.jsx(a.Text,{size:"sm",children:"Color"}),s.jsx(b.Controller,{name:`reference_lines.${e}.lineStyle.color`,control:t,render:({field:c})=>s.jsx(Se,{...c})})]}),s.jsx(a.Divider,{mb:-10,mt:10,variant:"dashed",label:"Behavior",labelPosition:"center"}),s.jsx(b.Controller,{name:`reference_lines.${e}.show_in_legend`,control:t,render:({field:c})=>s.jsx(a.Checkbox,{label:"Show in legend",checked:c.value,onChange:u=>c.onChange(u.currentTarget.checked)})}),s.jsx(a.Button,{leftIcon:s.jsx(_.Trash,{size:16}),color:"red",variant:"light",onClick:()=>n(e),sx:{top:15,right:5},children:"Delete this Reference Line"})]})}function Jx({control:t,watch:e,variables:n}){const{fields:r,append:i,remove:o}=b.useFieldArray({control:t,name:"reference_lines"}),l=e("reference_lines"),c=r.map((x,m)=>({...x,...l[m]})),u=()=>{i({name:"",template:"",variable_key:"",orientation:"horizontal",lineStyle:{type:"dashed",width:1,color:"#868E96"},show_in_legend:!1,yAxisIndex:0})},d=f.useMemo(()=>n.map(x=>({label:x.name,value:x.name})),[n]),h=e("y_axes"),p=f.useMemo(()=>h.map(({name:x},m)=>({label:x,value:m.toString()})),[h]);return s.jsxs(a.Tabs,{defaultValue:"0",styles:{tab:{paddingTop:"0px",paddingBottom:"0px"},panel:{padding:"0px"}},children:[s.jsxs(a.Tabs.List,{children:[c.map((x,m)=>s.jsx(a.Tabs.Tab,{value:m.toString(),children:m+1},x.id)),s.jsx(a.Tabs.Tab,{onClick:u,value:"add",children:s.jsx(_.Plus,{size:18,color:"#228be6"})})]}),c.map((x,m)=>s.jsx(a.Tabs.Panel,{value:m.toString(),children:s.jsx(Xx,{control:t,index:m,remove:o,watch:e,variableOptions:d,yAxisOptions:p})},x.id))]})}const Zx=[{label:"Linear",value:"linear"},{label:"Exponential",value:"exponential"},{label:"Logarithmic",value:"logarithmic"},{label:"Polynomial",value:"polynomial"}],Hx=[{label:"solid",value:"solid"},{label:"dashed",value:"dashed"},{label:"dotted",value:"dotted"}];function ef({control:t,regressionItem:e,index:n,remove:r,yAxisOptions:i}){const o=e.transform.config.method;return s.jsxs(a.Stack,{my:0,p:0,sx:{position:"relative"},children:[s.jsxs(a.Group,{grow:!0,children:[s.jsx(b.Controller,{name:`regressions.${n}.name`,control:t,render:({field:l})=>s.jsx(a.TextInput,{label:"Name",required:!0,sx:{flex:1},...l})}),s.jsx(b.Controller,{name:`regressions.${n}.group_by_key`,control:t,render:({field:l})=>s.jsx(B,{label:"Split into multiple regression lines by this key...",clearable:!0,sx:{flex:1},...l})})]}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`regressions.${n}.y_axis_data_key`,control:t,render:({field:l})=>s.jsx(B,{label:"Value Field",required:!0,sx:{flex:1},...l})}),s.jsx(b.Controller,{name:`regressions.${n}.plot.yAxisIndex`,control:t,render:({field:{value:l,onChange:c,...u}})=>s.jsx(a.Select,{label:"Y Axis",data:i,disabled:i.length===0,...u,value:(l==null?void 0:l.toString())??"",onChange:d=>{if(!d){c(0);return}c(Number(d))},sx:{flex:1}})})]}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`regressions.${n}.transform.config.method`,control:t,render:({field:l})=>s.jsx(a.Select,{label:"Method",data:Zx,sx:{flex:1},...l})}),o==="polynomial"&&s.jsx(b.Controller,{name:`regressions.${n}.transform.config.order`,control:t,render:({field:l})=>s.jsx(a.NumberInput,{label:"Order",sx:{flex:1},...l})})]}),s.jsx(a.Divider,{mb:-15,variant:"dashed",label:"Line Style",labelPosition:"center"}),s.jsxs(a.Group,{grow:!0,children:[s.jsx(b.Controller,{name:`regressions.${n}.plot.lineStyle.type`,control:t,render:({field:l})=>s.jsx(a.Select,{label:"Line Type",data:Hx,sx:{flexGrow:1},...l})}),s.jsx(b.Controller,{name:`regressions.${n}.plot.lineStyle.width`,control:t,render:({field:l})=>s.jsx(a.NumberInput,{label:"Line Width",min:1,max:10,sx:{flexGrow:1},...l})})]}),s.jsxs(a.Stack,{spacing:4,children:[s.jsx(a.Text,{size:"sm",children:"Color"}),s.jsx(b.Controller,{name:`regressions.${n}.plot.color`,control:t,render:({field:l})=>s.jsx(Se,{...l})})]}),s.jsx(a.Button,{leftIcon:s.jsx(_.Trash,{size:16}),color:"red",variant:"light",onClick:()=>r(n),sx:{top:15,right:5},children:"Delete this Regression Line"})]})}function tf({control:t,watch:e}){const{fields:n,append:r,remove:i}=b.useFieldArray({control:t,name:"regressions"}),o=e("regressions"),l=n.map((h,p)=>({...h,...o[p]})),c=e("y_axes"),u=f.useMemo(()=>c.map(({name:h},p)=>({label:h,value:p.toString()})),[c]),d=()=>r({transform:{type:"ecStat:regression",config:{method:"linear",order:1,formulaOn:"end"}},group_by_key:"",name:"",y_axis_data_key:"",plot:{type:"line",yAxisIndex:0,color:"#666666",lineStyle:{type:"solid",width:1}}});return s.jsxs(a.Tabs,{defaultValue:"0",styles:{tab:{paddingTop:"0px",paddingBottom:"0px"},panel:{padding:"0px",paddingTop:"6px"}},children:[s.jsxs(a.Tabs.List,{children:[l.map((h,p)=>s.jsx(a.Tabs.Tab,{value:p.toString(),children:p+1},h.id)),s.jsx(a.Tabs.Tab,{onClick:d,value:"add",children:s.jsx(_.Plus,{size:18,color:"#228be6"})})]}),l.map((h,p)=>s.jsx(a.Tabs.Panel,{value:p.toString(),children:s.jsx(ef,{regressionItem:h,control:t,index:p,remove:i,yAxisOptions:u})},h.id))]})}const Ys={static:{type:"static",size:10},dynamic:{type:"dynamic",func_content:["function getSize({ rowData, params, variables }, { lodash, interpolate }) {"," // your code goes here"," // return 10","}"].join(`
121
+ `}}}function Lx(t){return t.y_axes.reduce((n,{label_formatter:r},i)=>(n[i]=function(l){let c=l;if(typeof l=="object"&&(Array.isArray(l.value)&&l.value.length===2?c=l.value[1]:c=l.value),!r)return c;try{return F(c).format(r)}catch(u){return console.error(u),c}},n),{default:({value:n})=>n})}function ja(t,e){const n={};return e.map(r=>{const i=it(r,t);n[r.name]=qe(r,i)}),n}function Bx(t,e){const{overflow:n,...r}=t.x_axis.axisLabel,i=Re(n.on_axis),o=e.length===0;return[{data:e,name:t.x_axis_name??"",nameGap:o?5:void 0,id:"main-x-axis",axisTick:{show:!0,alignWithLabel:!0},type:t.x_axis.type,axisLabel:{...r,...i,formatter:Dt(r.formatter)}}]}function Ox(t){var e;try{return Array.isArray(t[0])&&((e=t[0])==null?void 0:e.length)>=2?t.map(r=>Number(r[1])):[...t]}catch(n){return console.error(n),[...t]}}function $x(t){if(t.length===0)return{};const e={},n={};return t.forEach(r=>{const i=Ox(r.data);if(!n[r.yAxisIndex]){n[r.yAxisIndex]=i;return}n[r.yAxisIndex]=n[r.yAxisIndex].concat(i)}),Object.entries(n).forEach(([r,i])=>{const o=y.minBy(i)??0,l=y.maxBy(i)??0;o==0&&l==0&&(e[r]=1)}),e}function Vx(t,e,n){const r=$x(n);return t.y_axes.map(({nameAlignment:i,min:o,max:l,show:c,...u},d)=>{let h=u.position;return h||(h=d>0?"right":"left"),{...u,minInterval:r[d]??0,show:c,min:o||void 0,max:l||void 0,position:h,axisLabel:{show:c,formatter:e[d]??e.default},axisLine:{show:c},nameTextStyle:{fontWeight:"bold",align:i},nameLocation:"end",nameGap:c?15:0,splitLine:{show:!1}}})}const qx={xAxis:[{type:"category",nameGap:25,nameLocation:"center",nameTextStyle:{fontWeight:"bold"},splitLine:{show:!1},axisTick:{show:!0,alignWithLabel:!0}}]};function Nx(t,e,n){const r=ja(e,n),i=Lx(t),o=y.uniq(st(e,t.x_axis_data_key)),l=Ax(t,o,e,i,n,r),c=wx(t,e),u={xAxis:Bx(t,o),yAxis:Vx(t,i,l),series:[...l,...c],tooltip:Px(t,l,i),grid:mx(t),legend:jx(l),dataZoom:Qs(t.dataZoom)};return y.defaultsDeep({},u,qx)}function va(t){const e=t.getModel(),n=e.getSeries().map(r=>{if(!r.option.custom)return r.option;const i=e.getColorFromPalette(r.option.custom.targetSeries,null);return r.option.color=i,r.option});t.setOption({...t.getOption(),series:n})}K.use([P.DataZoomComponent,te.BarChart,te.LineChart,te.ScatterChart,P.GridComponent,P.LegendComponent,P.TooltipComponent,we.CanvasRenderer,P.MarkLineComponent,P.MarkAreaComponent]);function wa(t){return t.trim().length>0}function Fx({conf:t,data:e,width:n,height:r,interactionManager:i,variables:o}){const l=gt(e,t.x_axis_data_key),c=Oe(i.triggerManager,Ws.id),u=f.useCallback(m=>{const j=y.get(l,m.name,{error:"rowData is not found"});c.forEach(C=>{i.runInteraction(C.id,{...m,rowData:j})})},[l,c,i]),d=f.useMemo(()=>Nx(t,e,o),[t,e]),h=f.useRef(),p=f.useMemo(()=>({click:u}),[u]),x=m=>{h.current=m,va(m)};return f.useEffect(()=>{h.current&&va(h.current)},[d]),!n||!r?null:s.jsx(ve,{echarts:K,option:d,style:{width:n,height:r},onEvents:p,onChartReady:x,notMerge:!0,theme:"merico-light"})}function Gx({context:t,instance:e}){const n=$e({vizManager:t.vizManager,instance:e}),{value:r}=O(t.instanceData,"config"),{variables:i}=t,o=f.useMemo(()=>y.defaults({},r,Rs),[r]),l=t.data,{width:c,height:u}=t.viewport,{ref:d,height:h}=pe.useElementSize(),{ref:p,height:x}=pe.useElementSize(),m=f.useMemo(()=>{const{stats:{templates:T}}=o;return{top:Ht(T.top,i,l),bottom:Ht(T.bottom,i,l)}},[o,l]),j=Math.max(0,We(u)-h-x),C=Ge(c);return s.jsxs(Te,{width:c,height:u,children:[s.jsx(a.Text,{ref:d,align:"left",size:"xs",pl:"sm",sx:{display:wa(o.stats.templates.top)?"block":"none"},children:Object.values(m.top).map((T,z)=>s.jsx(f.Fragment,{children:T},z))}),s.jsx(Fx,{variables:i,width:C,height:j,data:l,conf:o,interactionManager:n}),s.jsx(a.Text,{ref:p,align:"left",size:"xs",pl:"sm",sx:{display:wa(o.stats.templates.bottom)?"block":"none"},children:Object.values(m.bottom).map((T,z)=>s.jsx(f.Fragment,{children:T},z))})]})}const Us=f.forwardRef(({value:t,onChange:e},n)=>{const r=i=>o=>{e({...t,[i]:o})};return s.jsxs(a.Stack,{children:[s.jsx(a.Divider,{variant:"dashed",label:"Scroll to Zoom",labelPosition:"center"}),s.jsxs(a.Group,{children:[s.jsx(a.Box,{sx:{flexGrow:1},children:s.jsx(a.Switch,{label:"Enable on X Axis",checked:t.x_axis_scroll,onChange:i=>r("x_axis_scroll")(i.currentTarget.checked)})}),s.jsx(a.Box,{sx:{flexGrow:1},children:s.jsx(a.Switch,{label:"Enable on Y Axis",checked:t.y_axis_scroll,onChange:i=>r("y_axis_scroll")(i.currentTarget.checked)})})]}),s.jsx(a.Divider,{variant:"dashed",label:"Slider for Zooming",labelPosition:"center"}),s.jsxs(a.Group,{children:[s.jsx(a.Box,{sx:{flexGrow:1},children:s.jsx(a.Switch,{label:"Slider for X Axis",checked:t.x_axis_slider,onChange:i=>r("x_axis_slider")(i.currentTarget.checked)})}),s.jsx(a.Tooltip,{label:"Not available for now, will overlap y-axis's label",children:s.jsx(a.Box,{sx:{flexGrow:1},children:s.jsx(a.Switch,{label:"Slider for Y Axis",disabled:!t.y_axis_slider,checked:t.y_axis_slider,onChange:i=>r("y_axis_slider")(i.currentTarget.checked)})})})]})]})}),Wx=[{label:"Rectangle",value:"rectangle"}],Rx=[{label:"Horizontal",value:"horizontal"}];function Qx({control:t,index:e,remove:n,variableOptions:r}){return s.jsxs(a.Stack,{my:0,p:0,sx:{position:"relative"},children:[s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`reference_areas.${e}.name`,control:t,render:({field:i})=>s.jsx(a.TextInput,{label:"Name",required:!0,sx:{flex:1},...i})}),s.jsx(b.Controller,{name:`reference_areas.${e}.color`,control:t,render:({field:i})=>s.jsx(a.TextInput,{label:"Color",required:!0,sx:{flex:1},...i})})]}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`reference_areas.${e}.type`,control:t,render:({field:i})=>s.jsx(a.Select,{label:"Type",required:!0,data:Wx,sx:{flex:1},...i})}),s.jsx(b.Controller,{name:`reference_areas.${e}.direction`,control:t,render:({field:i})=>s.jsx(a.Select,{label:"Direction",required:!0,data:Rx,sx:{flex:1},...i})})]}),s.jsx(a.Divider,{variant:"dashed",label:"Data",labelPosition:"center"}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`reference_areas.${e}.y_keys.upper`,control:t,render:({field:i})=>s.jsx(a.Select,{label:"Upper Boundary",required:!0,data:r,sx:{flex:1},...i})}),s.jsx(b.Controller,{name:`reference_areas.${e}.y_keys.lower`,control:t,render:({field:i})=>s.jsx(a.Select,{label:"Lower Boundary",required:!0,data:r,sx:{flex:1},...i})})]}),s.jsx(a.Button,{leftIcon:s.jsx(_.Trash,{size:16}),color:"red",variant:"light",onClick:()=>n(e),sx:{top:15,right:5},children:"Delete this Reference Area"})]})}function Kx({control:t,watch:e,variables:n}){const{fields:r,append:i,remove:o}=b.useFieldArray({control:t,name:"reference_areas"}),l=e("reference_areas"),c=r.map((h,p)=>({...h,...l[p]})),u=()=>i({name:"",color:"rgba(0,0,0,0.1)",type:"rectangle",direction:"horizontal",y_keys:{upper:"",lower:""}}),d=f.useMemo(()=>n.map(h=>({label:h.name,value:h.name})),[n]);return s.jsxs(a.Tabs,{defaultValue:"0",styles:{tab:{paddingTop:"0px",paddingBottom:"0px"},panel:{padding:"6px 0px 0px"}},children:[s.jsxs(a.Tabs.List,{children:[c.map((h,p)=>s.jsx(a.Tabs.Tab,{value:p.toString(),children:p+1},h.id)),s.jsx(a.Tabs.Tab,{onClick:u,value:"add",children:s.jsx(_.Plus,{size:18,color:"#228be6"})})]}),c.map((h,p)=>s.jsx(a.Tabs.Panel,{value:p.toString(),children:s.jsx(Qx,{control:t,index:p,remove:o,variableOptions:d})},h.id))]})}const Ux=[{label:"solid",value:"solid"},{label:"dashed",value:"dashed"},{label:"dotted",value:"dotted"}],Yx=[{label:"Horizontal",value:"horizontal"},{label:"Vertical",value:"vertical"}];function Xx({control:t,index:e,remove:n,watch:r,variableOptions:i,yAxisOptions:o}){const l=r(`reference_lines.${e}.orientation`);return s.jsxs(a.Stack,{my:0,p:0,sx:{position:"relative"},children:[s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`reference_lines.${e}.name`,control:t,render:({field:c})=>s.jsx(a.TextInput,{label:"Name",placeholder:"Average Reference Line",required:!0,sx:{flex:1},...c})}),s.jsx(b.Controller,{name:`reference_lines.${e}.variable_key`,control:t,render:({field:c})=>s.jsx(a.Select,{label:"Value",required:!0,data:i,sx:{flex:1},...c})})]}),s.jsx(b.Controller,{name:`reference_lines.${e}.template`,control:t,render:({field:c})=>s.jsx(a.TextInput,{label:"Content Template",placeholder:"Average: ${avg}",sx:{flex:1},...c})}),s.jsxs(a.Group,{grow:!0,children:[s.jsxs(a.Stack,{children:[s.jsx(b.Controller,{name:`reference_lines.${e}.orientation`,control:t,render:({field:c})=>s.jsx(a.Select,{label:"Orientation",data:Yx,required:!0,sx:{flex:1},...c})}),l==="vertical"&&s.jsx(a.Text,{mt:-10,color:"dimmed",size:12,children:"Works only when xAxis values are numbers"})]}),l==="horizontal"&&s.jsx(b.Controller,{name:`reference_lines.${e}.yAxisIndex`,control:t,render:({field:{value:c,onChange:u,...d}})=>s.jsx(a.Select,{label:"Y Axis",data:o,disabled:o.length===0,...d,value:(c==null?void 0:c.toString())??"",onChange:h=>{if(!h){u(0);return}u(Number(h))},sx:{flex:1}})})]}),s.jsx(a.Divider,{mb:-10,mt:10,variant:"dashed",label:"Style",labelPosition:"center"}),s.jsxs(a.Group,{grow:!0,children:[s.jsx(b.Controller,{name:`reference_lines.${e}.lineStyle.type`,control:t,render:({field:c})=>s.jsx(a.Select,{label:"Line Type",data:Ux,sx:{flexGrow:1},...c})}),s.jsx(b.Controller,{name:`reference_lines.${e}.lineStyle.width`,control:t,render:({field:c})=>s.jsx(a.NumberInput,{label:"Line Width",min:1,max:10,sx:{flexGrow:1},...c})})]}),s.jsxs(a.Stack,{spacing:4,children:[s.jsx(a.Text,{size:"sm",children:"Color"}),s.jsx(b.Controller,{name:`reference_lines.${e}.lineStyle.color`,control:t,render:({field:c})=>s.jsx(Se,{...c})})]}),s.jsx(a.Divider,{mb:-10,mt:10,variant:"dashed",label:"Behavior",labelPosition:"center"}),s.jsx(b.Controller,{name:`reference_lines.${e}.show_in_legend`,control:t,render:({field:c})=>s.jsx(a.Checkbox,{label:"Show in legend",checked:c.value,onChange:u=>c.onChange(u.currentTarget.checked)})}),s.jsx(a.Button,{leftIcon:s.jsx(_.Trash,{size:16}),color:"red",variant:"light",onClick:()=>n(e),sx:{top:15,right:5},children:"Delete this Reference Line"})]})}function Jx({control:t,watch:e,variables:n}){const{fields:r,append:i,remove:o}=b.useFieldArray({control:t,name:"reference_lines"}),l=e("reference_lines"),c=r.map((x,m)=>({...x,...l[m]})),u=()=>{i({name:"",template:"",variable_key:"",orientation:"horizontal",lineStyle:{type:"dashed",width:1,color:"#868E96"},show_in_legend:!1,yAxisIndex:0})},d=f.useMemo(()=>n.map(x=>({label:x.name,value:x.name})),[n]),h=e("y_axes"),p=f.useMemo(()=>h.map(({name:x},m)=>({label:x,value:m.toString()})),[h]);return s.jsxs(a.Tabs,{defaultValue:"0",styles:{tab:{paddingTop:"0px",paddingBottom:"0px"},panel:{padding:"0px"}},children:[s.jsxs(a.Tabs.List,{children:[c.map((x,m)=>s.jsx(a.Tabs.Tab,{value:m.toString(),children:m+1},x.id)),s.jsx(a.Tabs.Tab,{onClick:u,value:"add",children:s.jsx(_.Plus,{size:18,color:"#228be6"})})]}),c.map((x,m)=>s.jsx(a.Tabs.Panel,{value:m.toString(),children:s.jsx(Xx,{control:t,index:m,remove:o,watch:e,variableOptions:d,yAxisOptions:p})},x.id))]})}const Zx=[{label:"Linear",value:"linear"},{label:"Exponential",value:"exponential"},{label:"Logarithmic",value:"logarithmic"},{label:"Polynomial",value:"polynomial"}],Hx=[{label:"solid",value:"solid"},{label:"dashed",value:"dashed"},{label:"dotted",value:"dotted"}];function ef({control:t,regressionItem:e,index:n,remove:r,yAxisOptions:i}){const o=e.transform.config.method;return s.jsxs(a.Stack,{my:0,p:0,sx:{position:"relative"},children:[s.jsxs(a.Group,{grow:!0,children:[s.jsx(b.Controller,{name:`regressions.${n}.name`,control:t,render:({field:l})=>s.jsx(a.TextInput,{label:"Name",required:!0,sx:{flex:1},...l})}),s.jsx(b.Controller,{name:`regressions.${n}.group_by_key`,control:t,render:({field:l})=>s.jsx(B,{label:"Split into multiple regression lines by this key...",clearable:!0,sx:{flex:1},...l})})]}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`regressions.${n}.y_axis_data_key`,control:t,render:({field:l})=>s.jsx(B,{label:"Value Field",required:!0,sx:{flex:1},...l})}),s.jsx(b.Controller,{name:`regressions.${n}.plot.yAxisIndex`,control:t,render:({field:{value:l,onChange:c,...u}})=>s.jsx(a.Select,{label:"Y Axis",data:i,disabled:i.length===0,...u,value:(l==null?void 0:l.toString())??"",onChange:d=>{if(!d){c(0);return}c(Number(d))},sx:{flex:1}})})]}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`regressions.${n}.transform.config.method`,control:t,render:({field:l})=>s.jsx(a.Select,{label:"Method",data:Zx,sx:{flex:1},...l})}),o==="polynomial"&&s.jsx(b.Controller,{name:`regressions.${n}.transform.config.order`,control:t,render:({field:l})=>s.jsx(a.NumberInput,{label:"Order",sx:{flex:1},...l})})]}),s.jsx(a.Divider,{mb:-15,variant:"dashed",label:"Line Style",labelPosition:"center"}),s.jsxs(a.Group,{grow:!0,children:[s.jsx(b.Controller,{name:`regressions.${n}.plot.lineStyle.type`,control:t,render:({field:l})=>s.jsx(a.Select,{label:"Line Type",data:Hx,sx:{flexGrow:1},...l})}),s.jsx(b.Controller,{name:`regressions.${n}.plot.lineStyle.width`,control:t,render:({field:l})=>s.jsx(a.NumberInput,{label:"Line Width",min:1,max:10,sx:{flexGrow:1},...l})})]}),s.jsxs(a.Stack,{spacing:4,children:[s.jsx(a.Text,{size:"sm",children:"Color"}),s.jsx(b.Controller,{name:`regressions.${n}.plot.color`,control:t,render:({field:l})=>s.jsx(Se,{...l})})]}),s.jsx(a.Button,{leftIcon:s.jsx(_.Trash,{size:16}),color:"red",variant:"light",onClick:()=>r(n),sx:{top:15,right:5},children:"Delete this Regression Line"})]})}function tf({control:t,watch:e}){const{fields:n,append:r,remove:i}=b.useFieldArray({control:t,name:"regressions"}),o=e("regressions"),l=n.map((h,p)=>({...h,...o[p]})),c=e("y_axes"),u=f.useMemo(()=>c.map(({name:h},p)=>({label:h,value:p.toString()})),[c]),d=()=>r({transform:{type:"ecStat:regression",config:{method:"linear",order:1,formulaOn:"end"}},group_by_key:"",name:"",y_axis_data_key:"",plot:{type:"line",yAxisIndex:0,color:"#666666",lineStyle:{type:"solid",width:1}}});return s.jsxs(a.Tabs,{defaultValue:"0",styles:{tab:{paddingTop:"0px",paddingBottom:"0px"},panel:{padding:"0px",paddingTop:"6px"}},children:[s.jsxs(a.Tabs.List,{children:[l.map((h,p)=>s.jsx(a.Tabs.Tab,{value:p.toString(),children:p+1},h.id)),s.jsx(a.Tabs.Tab,{onClick:d,value:"add",children:s.jsx(_.Plus,{size:18,color:"#228be6"})})]}),l.map((h,p)=>s.jsx(a.Tabs.Panel,{value:p.toString(),children:s.jsx(ef,{regressionItem:h,control:t,index:p,remove:i,yAxisOptions:u})},h.id))]})}const Ys={static:{type:"static",size:10},dynamic:{type:"dynamic",func_content:["function getSize({ rowData, params, variables }, { lodash, interpolate }) {"," // your code goes here"," // return 10","}"].join(`
122
122
  `)}},nf=[{label:"No gap between bars",value:"0%"},{label:"Bars overlapping on each other",value:"-100%"}];function sf({control:t,index:e,seriesItem:n}){const r=!!n.barWidth.trim();return s.jsxs(s.Fragment,{children:[s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`series.${e}.stack`,control:t,render:({field:i})=>s.jsx(a.TextInput,{label:"Stack",placeholder:"Stack bars by this ID",sx:{flexGrow:1},...i})}),s.jsx(b.Controller,{name:`series.${e}.barGap`,control:t,render:({field:i})=>s.jsx(a.Select,{label:"Bar Gap",data:nf,sx:{flexGrow:1},...i})})]}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`series.${e}.barMinWidth`,control:t,render:({field:i})=>s.jsx(a.TextInput,{label:"Bar Width(Min)",disabled:r,sx:{flexGrow:1},...i})}),s.jsx(b.Controller,{name:`series.${e}.barWidth`,control:t,render:({field:i})=>s.jsx(a.TextInput,{label:"Bar Width",sx:{flexGrow:1},...i})}),s.jsx(b.Controller,{name:`series.${e}.barMaxWidth`,control:t,render:({field:i})=>s.jsx(a.TextInput,{label:"Bar Width(Max)",disabled:r,sx:{flexGrow:1},...i})})]})]})}const rf=({value:t,onChange:e})=>{const n=r=>{r&&e(r)};return s.jsx(a.Box,{children:s.jsx(me,{height:"500px",defaultLanguage:"javascript",value:t,onChange:n,theme:"vs-dark",options:{minimap:{enabled:!1}}})})},af=({value:t,onChange:e})=>{const[n,{setTrue:r,setFalse:i}]=$.useBoolean(),[o,l]=f.useState(t),c=()=>{i();const{type:p,func_content:x}=o,m={type:p,func_content:x};l(m),e(m)},u=()=>{i(),l(t)},d=p=>{l(x=>({...x,func_content:p}))},h=()=>{d(Ys.dynamic.func_content)};return s.jsxs(s.Fragment,{children:[s.jsx(a.Box,{sx:{width:"50%"},children:s.jsx(a.Button,{variant:"filled",mt:24,onClick:r,sx:{flexGrow:0},children:"Setup"})}),s.jsx(a.Modal,{size:800,title:"Setup dynamic size",opened:n,onClose:i,closeOnClickOutside:!1,withCloseButton:!1,zIndex:320,children:n&&s.jsxs(a.Stack,{children:[s.jsx(a.Divider,{mt:10,mb:-10,label:"Dynamic by a custom function",labelPosition:"center",variant:"dashed"}),s.jsx(rf,{value:o.func_content,onChange:d}),s.jsxs(a.Group,{position:"apart",children:[s.jsx(a.Button,{onClick:h,color:"red",leftIcon:s.jsx(_.Recycle,{size:20}),children:"Reset"}),s.jsxs(a.Group,{position:"right",children:[s.jsx(a.Button,{onClick:u,variant:"subtle",children:"Cancel"}),s.jsx(a.Button,{onClick:c,children:"OK"})]})]})]})})]})},of=({value:t,onChange:e})=>t.type!=="dynamic"?null:s.jsx(af,{value:t,onChange:e}),lf=({value:t,onChange:e})=>{if(t.type!=="static")return null;const n=r=>{e({...t,size:r})};return s.jsx(s.Fragment,{children:s.jsx(a.NumberInput,{defaultValue:18,placeholder:"1 ~ 100",label:" ",hideControls:!0,value:t.size,onChange:n})})},cf=[{label:"Static",value:"static"},{label:"Dynamic",value:"dynamic"}],Ca=f.forwardRef(({label:t="Size",value:e,onChange:n},r)=>{const i=o=>{n({...Ys[o]})};return s.jsxs(a.SimpleGrid,{cols:2,children:[s.jsx(a.Select,{ref:r,label:t,data:cf,value:e.type,onChange:i,sx:{flexGrow:1}}),s.jsx(lf,{value:e,onChange:n}),s.jsx(of,{value:e,onChange:n})]})}),uf=[{label:"off",value:"false"},{label:"start",value:"start"},{label:"middle",value:"middle"},{label:"end",value:"end"}],df=[{label:"solid",value:"solid"},{label:"dashed",value:"dashed"},{label:"dotted",value:"dotted"}];function pf({control:t,index:e,seriesItem:n}){const r=n.showSymbol;return s.jsxs(s.Fragment,{children:[s.jsx(a.Divider,{mb:-15,variant:"dashed",label:"Line Settings",labelPosition:"center"}),s.jsxs(a.Group,{grow:!0,children:[s.jsx(b.Controller,{name:`series.${e}.lineStyle.type`,control:t,render:({field:i})=>s.jsx(a.Select,{label:"Line Type",data:df,sx:{flexGrow:1},...i})}),s.jsx(b.Controller,{name:`series.${e}.lineStyle.width`,control:t,render:({field:i})=>s.jsx(a.NumberInput,{label:"Line Width",min:1,max:10,sx:{flexGrow:1},...i})})]}),s.jsxs(a.Group,{grow:!0,align:"center",children:[s.jsx(b.Controller,{name:`series.${e}.step`,control:t,render:({field:i})=>s.jsx(a.Select,{label:"Step",data:uf,sx:{flexGrow:1,maxWidth:"48%"},...i,value:String(i.value),onChange:o=>{const l=o==="false"?!1:o;i.onChange(l)}})}),s.jsxs(a.Stack,{children:[s.jsx(b.Controller,{name:`series.${e}.smooth`,control:t,render:({field:i})=>s.jsx(a.Box,{sx:{flexGrow:1},children:s.jsx(a.Switch,{label:"Smooth Line",checked:i.value,onChange:o=>i.onChange(o.currentTarget.checked)})})}),s.jsx(b.Controller,{name:`series.${e}.display_name_on_line`,control:t,render:({field:i})=>s.jsx(a.Box,{sx:{flexGrow:1},children:s.jsx(a.Switch,{label:"Display Name on Line",checked:i.value??!1,onChange:o=>i.onChange(o.currentTarget.checked)})})})]})]}),s.jsxs(a.Stack,{children:[s.jsx(b.Controller,{name:`series.${e}.showSymbol`,control:t,render:({field:i})=>s.jsx(a.Box,{mt:10,mb:-10,sx:{flexGrow:1},children:s.jsx(a.Switch,{label:"Show Symbol on Line",checked:i.value,onChange:o=>i.onChange(o.currentTarget.checked)})})}),r&&s.jsx(b.Controller,{name:`series.${e}.symbolSize`,control:t,render:({field:i})=>s.jsx(Ca,{label:"Symbol Size",...i})})]})]})}function hf({control:t,index:e}){return s.jsx(b.Controller,{name:`series.${e}.symbolSize`,control:t,render:({field:n})=>s.jsx(Ca,{label:"Size",...n})})}const xf=[{label:"off",value:""},{label:"top",value:"top"},{label:"left",value:"left"},{label:"right",value:"right"},{label:"bottom",value:"bottom"},{label:"inside",value:"inside"},{label:"insideLeft",value:"insideLeft"},{label:"insideRight",value:"insideRight"},{label:"insideTop",value:"insideTop"},{label:"insideBottom",value:"insideBottom"},{label:"insideTopLeft",value:"insideTopLeft"},{label:"insideBottomLeft",value:"insideBottomLeft"},{label:"insideTopRight",value:"insideTopRight"},{label:"insideBottomRight",value:"insideBottomRight"}];function ff({control:t,index:e,remove:n,seriesItem:r,yAxisOptions:i}){const o=r.type;return s.jsxs(a.Stack,{my:0,p:0,sx:{position:"relative"},children:[s.jsx(a.Stack,{children:s.jsx(b.Controller,{name:`series.${e}.type`,control:t,render:({field:l})=>s.jsx(a.SegmentedControl,{data:[{label:"Line",value:"line"},{label:"Bar",value:"bar"},{label:"Scatter",value:"scatter"}],...l})})}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`series.${e}.name`,control:t,render:({field:l})=>s.jsx(a.TextInput,{label:"Name",required:!0,sx:{flex:1},...l})}),s.jsx(b.Controller,{name:`series.${e}.yAxisIndex`,control:t,render:({field:{value:l,onChange:c,...u}})=>s.jsx(a.Select,{label:"Y Axis",data:i,disabled:i.length===0,...u,value:(l==null?void 0:l.toString())??"",onChange:d=>{if(!d){c(0);return}c(Number(d))},sx:{flex:1}})})]}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`series.${e}.y_axis_data_key`,control:t,render:({field:l})=>s.jsx(B,{label:"Value Field",required:!0,sx:{flex:1},...l})}),s.jsx(b.Controller,{name:`series.${e}.aggregation_on_value`,control:t,render:({field:l})=>s.jsx(In,{label:"Aggregation on Value",value:l.value??At,onChange:l.onChange,pt:0})})]}),s.jsx(a.Group,{grow:!0,children:s.jsx(b.Controller,{name:`series.${e}.group_by_key`,control:t,render:({field:l})=>s.jsx(B,{label:"Split into multiple series by this key...",clearable:!0,sx:{flex:1},...l})})}),o==="line"&&s.jsx(pf,{index:e,control:t,seriesItem:r}),o==="bar"&&s.jsx(sf,{index:e,control:t,seriesItem:r}),o==="scatter"&&s.jsx(hf,{index:e,control:t}),s.jsx(a.Divider,{mb:-10,mt:10,variant:"dashed",label:"Style",labelPosition:"center"}),s.jsx(b.Controller,{name:`series.${e}.label_position`,control:t,render:({field:l})=>s.jsx(a.Select,{label:"Label Position",data:xf,...l})}),s.jsxs(a.Stack,{spacing:4,children:[s.jsx(a.Text,{size:"sm",children:"Color"}),s.jsx(b.Controller,{name:`series.${e}.color`,control:t,render:({field:l})=>s.jsx(Se,{...l})})]}),s.jsx(a.Divider,{mb:-10,mt:10,variant:"dashed",label:"Behavior",labelPosition:"center"}),s.jsx(b.Controller,{name:`series.${e}.hide_in_legend`,control:t,render:({field:l})=>s.jsx(a.Checkbox,{label:"Hide in legend",checked:l.value,onChange:c=>l.onChange(c.currentTarget.checked)})}),s.jsx(a.Divider,{mb:-10,mt:10,variant:"dashed"}),s.jsx(a.Button,{leftIcon:s.jsx(_.Trash,{size:16}),color:"red",variant:"light",onClick:()=>n(e),sx:{top:15,right:5},children:"Delete this Series"})]})}function gf({control:t,watch:e}){const{fields:n,append:r,remove:i}=b.useFieldArray({control:t,name:"series"}),o=e("series"),l=n.map((h,p)=>({...h,...o[p]})),c=()=>{const h={type:"bar",name:pe.randomId(),showSymbol:!1,symbolSize:Ys.static,y_axis_data_key:"value",yAxisIndex:0,label_position:"top",display_name_on_line:!1,stack:"",color:"#000",step:!1,smooth:!1,barMinWidth:"1",barWidth:"10%",barMaxWidth:"10",barGap:"0%",lineStyle:{type:"solid",width:1},hide_in_legend:!1,group_by_key:""};r(h)},u=e("y_axes"),d=f.useMemo(()=>u.map(({name:h},p)=>({label:h,value:p.toString()})),[u]);return s.jsxs(a.Tabs,{defaultValue:"0",styles:{tab:{paddingTop:"0px",paddingBottom:"0px"},panel:{padding:"0px",paddingTop:"6px"}},children:[s.jsxs(a.Tabs.List,{children:[l.map((h,p)=>s.jsx(a.Tabs.Tab,{value:p.toString(),children:p+1},h.id)),s.jsx(a.Tabs.Tab,{onClick:c,value:"add",children:s.jsx(_.Plus,{size:18,color:"#228be6"})})]}),l.map((h,p)=>s.jsx(a.Tabs.Panel,{value:p.toString(),children:s.jsx(ff,{control:t,index:p,remove:i,seriesItem:h,yAxisOptions:d},h.id)},h.id))]})}function mf({control:t,watch:e}){return e("stats"),s.jsx(a.Stack,{children:s.jsxs(a.Stack,{spacing:0,children:[s.jsx(b.Controller,{name:"stats.templates.top",control:t,render:({field:n})=>s.jsx(Rt,{label:"Template for stats above the chart",py:"md",sx:{flexGrow:1},...n})}),s.jsx(b.Controller,{name:"stats.templates.bottom",control:t,render:({field:n})=>s.jsx(Rt,{label:"Template for stats under the chart",py:"md",sx:{flexGrow:1},...n})})]})})}const yf=()=>s.jsxs(a.Group,{sx:{display:"inline-flex"},spacing:6,mr:14,children:[s.jsx(a.Text,{children:"X Axis Data Type"}),s.jsxs(a.HoverCard,{width:340,shadow:"md",position:"top",children:[s.jsx(a.HoverCard.Target,{children:s.jsx(a.ActionIcon,{size:"xs",sx:{transform:"none !important"},children:s.jsx(k.IconInfoCircle,{})})}),s.jsx(a.HoverCard.Dropdown,{children:s.jsxs(a.Text,{size:"sm",children:["Click",s.jsx(a.Anchor,{href:"https://echarts.apache.org/en/option.html#xAxis.type",target:"_blank",mx:4,children:"here"}),"to learn more about these options"]})})]})]}),bf=[{label:"Value",value:"value"},{label:"Category",value:"category"},{label:"Time",value:"time"},{label:"Log",value:"log"}];function jf({control:t,watch:e}){return e(["x_axis_data_key","x_axis_name","x_axis"]),s.jsxs(a.Stack,{children:[s.jsx(b.Controller,{name:"x_axis_name",control:t,render:({field:n})=>s.jsx(a.TextInput,{label:"X Axis Name",sx:{flex:1},...n})}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:"x_axis_data_key",control:t,render:({field:n})=>s.jsx(B,{label:"X Axis Data Field",required:!0,sx:{flex:1},...n})}),s.jsx(b.Controller,{name:"x_axis.type",control:t,render:({field:n})=>s.jsx(a.Select,{label:s.jsx(yf,{}),required:!0,data:bf,sx:{flex:1},...n})})]}),s.jsx(a.Divider,{mb:-15,label:"Tick Label",labelPosition:"center"}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:"x_axis.axisLabel.rotate",control:t,render:({field:n})=>s.jsx(a.NumberInput,{label:"Rotate",hideControls:!0,min:-90,max:90,rightSection:s.jsx(a.Text,{color:"dimmed",children:"degree"}),sx:{width:"48%"},styles:{rightSection:{width:"4em",justifyContent:"flex-end",paddingRight:"6px"}},...n})}),s.jsx(b.Controller,{name:"x_axis.axisLabel.formatter",control:t,render:({field:n})=>s.jsx(zn,{...n})})]}),s.jsx(b.Controller,{name:"x_axis.axisLabel.overflow",control:t,render:({field:n})=>s.jsx(Ye,{...n})})]})}const vf=[{label:"left",value:"left"},{label:"center",value:"center"},{label:"right",value:"right"}],wf=[{label:"left",value:"left"},{label:"right",value:"right"}];function Cf({control:t,index:e,remove:n}){return s.jsxs(a.Stack,{my:0,p:"0",sx:{position:"relative"},children:[s.jsx(a.Divider,{mb:-15,mt:15,variant:"dashed",label:"Name",labelPosition:"center"}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`y_axes.${e}.name`,control:t,render:({field:r})=>s.jsx(a.TextInput,{label:"Name",required:!0,sx:{flex:1},...r})}),s.jsx(b.Controller,{name:`y_axes.${e}.nameAlignment`,control:t,render:({field:r})=>s.jsx(a.Select,{label:"Name Anchor",required:!0,data:vf,sx:{flex:1},...r})})]}),s.jsx(a.Divider,{mb:-15,variant:"dashed",label:"Layout",labelPosition:"center"}),s.jsx(a.Group,{grow:!0,noWrap:!0,children:s.jsx(b.Controller,{name:`y_axes.${e}.position`,control:t,render:({field:r})=>s.jsx(a.Select,{label:"Position",required:!0,data:wf,sx:{flex:1},...r})})}),s.jsxs(a.Stack,{children:[s.jsx(a.Divider,{mb:-15,variant:"dashed",label:"Label Format",labelPosition:"center"}),s.jsx(b.Controller,{name:`y_axes.${e}.label_formatter`,control:t,render:({field:r})=>s.jsx(ze,{...r})})]}),s.jsxs(a.Stack,{children:[s.jsx(a.Divider,{mb:-15,variant:"dashed",label:"Value Range",labelPosition:"center"}),s.jsxs(a.Group,{grow:!0,children:[s.jsx(b.Controller,{name:`y_axes.${e}.min`,control:t,render:({field:r})=>s.jsx(a.TextInput,{label:"Min",...r})}),s.jsx(b.Controller,{name:`y_axes.${e}.max`,control:t,render:({field:r})=>s.jsx(a.TextInput,{label:"Max",...r})})]})]}),s.jsx(a.Divider,{mb:-10,mt:10,variant:"dashed",label:"Behavior",labelPosition:"center"}),s.jsx(b.Controller,{name:`y_axes.${e}.show`,control:t,render:({field:r})=>s.jsx(a.Checkbox,{label:"Visible",checked:r.value,onChange:i=>r.onChange(i.currentTarget.checked)})}),s.jsx(a.Button,{mt:20,leftIcon:s.jsx(_.Trash,{size:16}),color:"red",variant:"light",onClick:()=>n(e),disabled:e===0,children:"Delete this YAxis"})]})}function Sf({control:t,watch:e}){const{fields:n,append:r,remove:i}=b.useFieldArray({control:t,name:"y_axes"}),o=e("y_axes"),l=n.map((u,d)=>({...u,...o[d]})),c=()=>r({name:"",position:"left",nameAlignment:"left",label_formatter:ye,min:"",max:"",show:!0});return s.jsxs(a.Tabs,{defaultValue:"0",styles:{tab:{paddingTop:"0px",paddingBottom:"0px"},panel:{padding:"0px"}},children:[s.jsxs(a.Tabs.List,{children:[l.map((u,d)=>s.jsx(a.Tabs.Tab,{value:d.toString(),children:d+1},u.id)),s.jsx(a.Tabs.Tab,{onClick:c,value:"add",children:s.jsx(_.Plus,{size:18,color:"#228be6"})})]}),l.map((u,d)=>s.jsx(a.Tabs.Panel,{value:d.toString(),children:s.jsx(Cf,{control:t,index:d,remove:i})},u.id))]})}function _f({context:t}){const{value:e,set:n}=O(t.instanceData,"config"),{variables:r}=t,i=f.useMemo(()=>y.defaultsDeep({},e,Rs),[e]),{control:o,handleSubmit:l,watch:c,getValues:u,reset:d}=b.useForm({defaultValues:i});f.useEffect(()=>{d(i)},[i]);const h=u(),p=f.useMemo(()=>!y.isEqual(h,i),[h,i]);return c(["dataZoom"]),s.jsx(a.Stack,{spacing:"xs",children:s.jsxs("form",{onSubmit:l(n),children:[s.jsxs(a.Group,{position:"left",py:"md",pl:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef"},children:[s.jsx(a.Text,{children:"Chart Config"}),s.jsx(a.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",disabled:!p,children:s.jsx(_.DeviceFloppy,{size:20})})]}),s.jsxs(a.Tabs,{defaultValue:"Series",orientation:"vertical",styles:{tab:{paddingLeft:"6px",paddingRight:"6px"},panel:{paddingTop:"6px",paddingLeft:"12px"}},children:[s.jsxs(a.Tabs.List,{children:[s.jsx(a.Tabs.Tab,{value:"X Axis",children:"X Axis"}),s.jsx(a.Tabs.Tab,{value:"Y Axes",children:"Y Axes"}),s.jsx(a.Tabs.Tab,{value:"Series",children:"Series"}),s.jsx(a.Tabs.Tab,{value:"Regression Lines",children:"Regression Lines"}),s.jsx(a.Tabs.Tab,{value:"Stats",children:"Stats"}),s.jsx(a.Tabs.Tab,{value:"Reference Lines",children:"Reference Lines"}),s.jsx(a.Tabs.Tab,{value:"Reference Areas",children:"Reference Areas"}),s.jsx(a.Tabs.Tab,{value:"Zooming",children:"Zooming"})]}),s.jsx(a.Tabs.Panel,{value:"X Axis",children:s.jsx(jf,{control:o,watch:c})}),s.jsx(a.Tabs.Panel,{value:"Y Axes",children:s.jsx(Sf,{control:o,watch:c})}),s.jsx(a.Tabs.Panel,{value:"Series",children:s.jsx(gf,{control:o,watch:c})}),s.jsx(a.Tabs.Panel,{value:"Regression Lines",children:s.jsx(tf,{control:o,watch:c})}),s.jsx(a.Tabs.Panel,{value:"Stats",children:s.jsx(mf,{control:o,watch:c})}),s.jsx(a.Tabs.Panel,{value:"Reference Lines",children:s.jsx(Jx,{variables:r,control:o,watch:c})}),s.jsx(a.Tabs.Panel,{value:"Reference Areas",children:s.jsx(Kx,{variables:r,control:o,watch:c})}),s.jsx(a.Tabs.Panel,{value:"Zooming",children:s.jsx(b.Controller,{name:"dataZoom",control:o,render:({field:x})=>s.jsx(Us,{...x})})})]})]})})}function kf(t){const e=y.cloneDeep(y.omit(t,"variables"));return e.stats=y.omit(e.stats,"variables"),e}function Tf(t){const{rotate:e,formatter:n=Be}=t.x_axis.axisLabel;return{...t,x_axis:{...t.x_axis,axisLabel:{rotate:e,formatter:n}}}}function If(t){const{dataZoom:e=Et,...n}=t;return{...n,dataZoom:e}}function Df(t){const e={x_axis:{axisLabel:{overflow:{x_axis:{width:80,overflow:"truncate",ellipsis:"..."},tooltip:{width:200,overflow:"break",ellipsis:"..."}}}}};return y.defaultsDeep(e,t)}function Mf(t){const e=t.reference_lines.map(n=>{const{lineStyle:r={type:"dashed",width:1,color:tt.random().css()},show_in_legend:i=!1}=n;return{...n,lineStyle:r,show_in_legend:i}});return{...t,reference_lines:e}}function zf(t){const e=t.reference_lines.map(n=>{const{yAxisIndex:r=0}=n;return{...n,yAxisIndex:r}});return{...t,reference_lines:e}}function Af(t){const e=t.series.map(n=>{const{aggregation_on_group:r=At}=n;return{...n,aggregation_on_group:r}});return{...t,series:e}}function Ef(t){const e=t.series.map(n=>{const{aggregation_on_value:r=At}=n;return{...n,aggregation_on_value:r}});return{...t,series:e}}function Pf(t){delete t.config;const{x_axis:e,tooltip:n}=t.x_axis.axisLabel.overflow,r={x_axis:{axisLabel:{overflow:{on_axis:e,in_tooltip:n}}}};return y.defaultsDeep(r,t)}function Lf(t){const{series:e,...n}=t;return{...n,series:e.map(r=>{const{barMinWidth:i,barWidth:o,barMaxWidth:l}=r;return i?{...r,barMinWidth:i,barWidth:"",barMaxWidth:l??o}:{...r,barMinWidth:"",barWidth:o,barMaxWidth:""}})}}function Bf(t){const{y_axes:e,...n}=t;return{...n,y_axes:e.map(r=>{const{min:i="",max:o=""}=r;return{...r,min:i,max:o}})}}function Of(t){const{y_axes:e,...n}=t;return{...n,y_axes:e.map(r=>{const{nameAlignment:i="left"}=r;return{...r,nameAlignment:i}})}}function $f(t){const{y_axes:e,...n}=t;return{...n,y_axes:e.map(r=>{const{show:i=!0}=r;return{...r,show:i}})}}function Vf(t){const{regressions:e,...n}=t;return{...n,regressions:e.map(r=>{const{group_by_key:i=""}=r;return{...r,group_by_key:i}})}}function qf(t){const{series:e,y_axes:n,...r}=t;return{...r,series:e.map(i=>{const{hide_in_legend:o=!1,aggregation_on_value:l=At}=i;return{...i,hide_in_legend:o,aggregation_on_value:l}}),y_axes:n.map(i=>{const{min:o="",max:l="",show:c=!0}=i;return{...i,min:o,max:l,show:c}})}}function Nf(t){const{type:e="category",...n}=t.x_axis;return{...t,x_axis:{...n,type:e}}}function Ff(t,{panelModel:e}){try{const n=e.queryIDs[0];if(!n)throw new Error("cannot migrate when queryID is empty");const r=u=>u&&`${n}.${u}`,{x_axis_data_key:i,series:o,regressions:l,...c}=t;return{...c,x_axis_data_key:r(i),series:o.map(u=>({...u,y_axis_data_key:r(u.y_axis_data_key),group_by_key:r(u.group_by_key)})),regressions:l.map(u=>({...u,y_axis_data_key:r(u.y_axis_data_key),group_by_key:r(u.group_by_key)}))}}catch(n){throw console.error("[Migration failed]",n),n}}class Gf extends re{constructor(){super(...arguments);A(this,"VERSION",18)}configVersions(){this.version(1,n=>({version:1,config:n})),this.version(2,(n,{panelModel:r})=>{const{config:i}=n;return(i.variables||[]).forEach(c=>{r.variables.find(u=>u.name===c.name)||r.addVariable(c)}),(y.get(i,"stats.variables")||[]).forEach(c=>{r.variables.find(u=>u.name===c.name)||r.addVariable(c)}),{...n,version:2,config:kf(i)}}),this.version(3,n=>({...n,version:3,config:Tf(n.config)})),this.version(4,n=>({...n,version:4,config:If(n.config)})),this.version(5,n=>({...n,version:5,config:Df(n.config)})),this.version(6,n=>({...n,version:6,config:Mf(n.config)})),this.version(7,n=>({...n,version:7,config:zf(n.config)})),this.version(8,n=>({...n,version:8,config:Af(n.config)})),this.version(9,n=>({...n,version:9,config:Ef(n.config)})),this.version(10,n=>({...n,version:10,config:Pf(n.config)})),this.version(11,n=>({...n,version:11,config:Lf(n.config)})),this.version(12,n=>({...n,version:12,config:Bf(n.config)})),this.version(13,n=>({...n,version:13,config:Of(n.config)})),this.version(14,n=>({...n,version:14,config:$f(n.config)})),this.version(15,n=>({...n,version:15,config:Vf(n.config)})),this.version(16,n=>({...n,version:16,config:qf(n.config)})),this.version(17,n=>({...n,version:17,config:Nf(n.config)})),this.version(18,(n,r)=>({...n,version:18,config:Ff(n.config,r)}))}}const Wf={displayName:"Cartesian Chart",displayGroup:"ECharts-based charts",migrator:new Gf,name:"cartesian",viewRender:Gx,configRender:_f,createConfig(){return{version:18,config:y.cloneDeep(Rs)}},triggers:[Ws]};function Rf(t){if(t.enable_value)return t.value}function Qf(t){if(t.enable_value)return t.value}function Kf(t){const e=t.axisLabel.overflow.on_axis.width,n=t.axisLabel.position,r={top:5,left:5,right:5,bottom:5};return t.orient==="vertical"&&y.get(r,n)&&n===t.funnelAlign&&y.set(r,n,e),r}function Uf(t,e){return t.series.map(n=>{const{level_name_data_key:r,level_value_data_key:i,axisLabel:o,min:l,max:c,funnelAlign:u,orient:d,...h}=n;if(!r||!i)return{};const p=D(r),x=D(i),m=e[p.queryID].map(C=>({name:C[p.columnKey],value:C[x.columnKey]})),j=Re(o.overflow.on_axis);return{type:"funnel",...Kf(n),min:Rf(l),max:Qf(c),minSize:l.size,maxSize:c.size,...h,label:{show:!0,position:o.position,...j},orient:d,funnelAlign:d==="horizontal"?"center":u,data:m}})}function Yf({conf:t,params:e,max:n}){const{name:r,value:i}=e.data,o=F(i/n).format({output:"percent",mantissa:2,trimMantissa:!0});return[{label:`${e.marker} ${r}`,value:`${i} (${o})`,style:{label:"",value:""}}]}function Xf(t,e){var o;const n=D(t.series[0].level_name_data_key),r=D(t.series[0].level_value_data_key),i=(o=y.maxBy(e[n.queryID],r.columnKey))==null?void 0:o[r.columnKey];return l=>{const u=Yf({conf:t,params:l,max:i}).map(h=>`
123
123
  <tr>
124
124
  <th style="text-align: right;">
@@ -273,7 +273,7 @@ Check the top-level render call using <`+M+">.")}return I}}function rc(v,I){{if(
273
273
  <thead><tr>${d.join("")}</tr></thead>
274
274
  <tbody>${h.join("")}</tbody>
275
275
  </table>
276
- `}}}function pb(t,e){const n=e.every(i=>!Number.isNaN(Number(i))),{axisLabel:r}=t.x_axis;return[{data:e,name:t.x_axis.name??"",id:"main-x-axis",axisTick:{show:!0,alignWithLabel:!0},type:n?"value":"category",axisLabel:{...r,formatter:Wa(r.formatter)}}]}function hb(t,e){return t.y_axes.map(({nameAlignment:n,min:r,max:i,...o},l)=>{let c=o.position;return c||(c=l>0?"right":"left"),{...o,minInterval:1,min:r||void 0,max:i||void 0,position:c,axisLabel:{show:!0,formatter:e[l]??e.default},axisLine:{show:!0},nameTextStyle:{fontWeight:"bold",align:n},nameLocation:"end",nameGap:15,splitLine:{show:!1}}})}const xb={xAxis:[{type:"category",nameGap:25,nameLocation:"center",nameTextStyle:{fontWeight:"bold"},splitLine:{show:!1},axisTick:{show:!0,alignWithLabel:!0}}],grid:{top:10,left:20,right:15,bottom:25,containLabel:!0}};function fb(t,e,n){const r=n.reduce((u,d)=>{const h=it(d,e);return u[d.name]=qe(d,h),u},{}),i=t.y_axes.reduce((u,{label_formatter:d},h)=>(u[h]=function(x){let m=x;if(typeof x=="object"&&(Array.isArray(x.value)&&x.value.length===2?m=x.value[1]:m=x.value),!d)return m;try{return F(m).format(d)}catch(j){return console.error(j),m}},u),{default:({value:u})=>u}),o=y.uniq(st(e,t.x_axis.data_key)),l=lb(t,e,n,r),c={xAxis:pb(t,o),yAxis:hb(t,i),series:l,dataset:eb(t,e),tooltip:db(t,i),grid:tb(t),legend:nb(),dataZoom:Qs(t.dataZoom)};return y.defaultsDeep({},c,xb)}K.use([P.DataZoomComponent,te.BarChart,te.LineChart,te.ScatterChart,P.GridComponent,P.LegendComponent,P.TooltipComponent,we.CanvasRenderer,P.MarkLineComponent,P.MarkAreaComponent]);function Qa(t){return t.trim().length>0}function gb({conf:t,data:e,width:n,height:r,interactionManager:i,variables:o}){const l=gt(e,t.x_axis.data_key),c=Oe(i.triggerManager,Na.id),u=f.useCallback(p=>{const x=p.data;c.forEach(m=>{i.runInteraction(m.id,{...p,rowData:x})})},[l,c,i]),d=f.useMemo(()=>({click:u}),[u]),h=f.useMemo(()=>fb(t,e,o),[t,e]);return s.jsx(ve,{echarts:K,option:h,style:{width:n,height:r},onEvents:d,notMerge:!0,theme:"merico-light"})}function mb({context:t,instance:e}){const n=$e({vizManager:t.vizManager,instance:e}),{value:r}=O(t.instanceData,"config"),{variables:i}=t,o=f.useMemo(()=>y.defaults({},r,rr),[r]),l=t.data,{width:c,height:u}=t.viewport,{ref:d,height:h}=pe.useElementSize(),{ref:p,height:x}=pe.useElementSize(),m=f.useMemo(()=>{const{stats:{templates:C}}=o;return{top:Ht(C.top,i,l),bottom:Ht(C.bottom,i,l)}},[o,l]),j=Math.max(0,We(u)-h-x);return!c||!u?null:s.jsxs(Te,{width:c,height:u,children:[s.jsx(a.Text,{ref:d,align:"left",size:"xs",pl:"sm",sx:{display:Qa(o.stats.templates.top)?"block":"none"},children:Object.values(m.top).map(C=>C)}),s.jsx(gb,{variables:i,width:Ge(c),height:j,data:l,conf:o,interactionManager:n}),s.jsx(a.Text,{ref:p,align:"left",size:"xs",pl:"sm",sx:{display:Qa(o.stats.templates.bottom)?"block":"none"},children:Object.values(m.bottom).map(C=>C)})]})}const yb=f.forwardRef(({value:t,onChange:e,xAxisOptions:n,yAxisOptions:r,variableOptions:i},o)=>{const l=(c,u)=>{const d=y.cloneDeep(t);y.set(d,c,u),e(d)};return s.jsxs(a.Stack,{children:[s.jsx(a.Divider,{mb:-15,variant:"dashed",label:"Content",labelPosition:"right"}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(a.TextInput,{label:"Content Text",value:t.content.text,onChange:c=>l("content.text",c.currentTarget.value)}),s.jsx(Js,{label:"Text Position",value:t.label.position,onChange:c=>l("label.position",c)})]}),s.jsx(a.Divider,{mb:-15,variant:"dashed",label:"Endpoints",labelPosition:"right"}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[n&&s.jsx(a.Select,{label:"X Axis",data:n,value:t.xAxisIndex,onChange:c=>l("xAxisIndex",c)}),r&&s.jsx(a.Select,{label:"Y Axis",data:r,value:t.yAxisIndex,onChange:c=>l("xAxisIndex",c)})]}),s.jsxs(a.Stack,{spacing:0,children:[s.jsx(a.Text,{size:14,color:"#212529",fw:500,children:"Left-Bottom Point"}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(a.Select,{icon:s.jsx(a.Text,{children:"x"}),data:i,value:t.leftBottomPoint.x_data_key,onChange:c=>l("leftBottomPoint.x_data_key",c??""),clearable:!0}),s.jsx(a.Select,{icon:s.jsx(a.Text,{children:"y"}),data:i,value:t.leftBottomPoint.y_data_key,onChange:c=>l("leftBottomPoint.y_data_key",c??""),clearable:!0})]})]}),s.jsxs(a.Stack,{spacing:0,children:[s.jsx(a.Text,{size:14,color:"#212529",fw:500,children:"Right-Top Point"}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(a.Select,{icon:s.jsx(a.Text,{children:"x"}),data:i,value:t.rightTopPoint.x_data_key,onChange:c=>l("rightTopPoint.x_data_key",c??""),clearable:!0}),s.jsx(a.Select,{icon:s.jsx(a.Text,{children:"y"}),data:i,value:t.rightTopPoint.y_data_key,onChange:c=>l("rightTopPoint.y_data_key",c??""),clearable:!0})]})]}),s.jsx(a.Divider,{mb:-15,variant:"dashed",label:"Style",labelPosition:"right"}),s.jsxs(a.Stack,{spacing:4,children:[s.jsx(a.Text,{size:14,children:"Background Color"}),s.jsx(Se,{value:t.itemStyle.color,onChange:c=>l("itemStyle.color",c)})]}),s.jsxs(a.Stack,{spacing:4,children:[s.jsx(a.Text,{size:14,children:"Text Color"}),s.jsx(Se,{value:t.label.color,onChange:c=>l("label.color",c)})]})]})});function bb(){const t=new Date().getTime().toString();return{id:t,content:{text:t},itemStyle:{color:"rgba(0,0,0,0.05)"},label:{position:"inside",color:"rgba(0,0,0,0.5)"},leftBottomPoint:{x_data_key:"",y_data_key:""},rightTopPoint:{x_data_key:"",y_data_key:""},xAxisIndex:"0",yAxisIndex:"0"}}function jb({control:t,watch:e,variables:n}){const{fields:r,append:i,remove:o}=b.useFieldArray({control:t,name:"reference_areas"}),l=e("reference_areas"),c=r.map((x,m)=>({...x,...l[m]})),u=()=>{const x=bb();i(x)},d=f.useMemo(()=>n.map(x=>({label:x.name,value:x.name})),[n]),h=e("y_axes"),p=f.useMemo(()=>h.map(({name:x},m)=>({label:x,value:m.toString()})),[h]);return s.jsxs(a.Tabs,{defaultValue:"0",styles:{tab:{paddingTop:"0px",paddingBottom:"0px"},panel:{padding:"0px"}},children:[s.jsxs(a.Tabs.List,{children:[c.map((x,m)=>s.jsx(a.Tabs.Tab,{value:m.toString(),children:m+1},x.id)),s.jsx(a.Tabs.Tab,{onClick:u,value:"add",children:s.jsx(_.Plus,{size:18,color:"#228be6"})})]}),c.map((x,m)=>s.jsx(a.Tabs.Panel,{value:m.toString(),children:s.jsx(b.Controller,{name:`reference_areas.${m}`,control:t,render:({field:j})=>s.jsxs(a.Stack,{children:[s.jsx(yb,{variableOptions:d,yAxisOptions:p,...j}),s.jsx(a.Divider,{mb:-10,mt:10,variant:"dashed"}),s.jsx(a.Button,{leftIcon:s.jsx(k.IconTrash,{size:16}),color:"red",variant:"light",onClick:()=>o(m),children:"Delete this Reference Area"})]})})},x.id))]})}const vb=[{label:"solid",value:"solid"},{label:"dashed",value:"dashed"},{label:"dotted",value:"dotted"}],wb=[{label:"Horizontal",value:"horizontal"},{label:"Vertical",value:"vertical"}];function Cb({control:t,index:e,remove:n,watch:r,variableOptions:i,yAxisOptions:o}){const l=r(`reference_lines.${e}.orientation`);return s.jsxs(a.Stack,{my:0,p:0,sx:{position:"relative"},children:[s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`reference_lines.${e}.name`,control:t,render:({field:c})=>s.jsx(a.TextInput,{label:"Name",placeholder:"Average Reference Line",required:!0,sx:{flex:1},...c})}),s.jsx(b.Controller,{name:`reference_lines.${e}.variable_key`,control:t,render:({field:c})=>s.jsx(a.Select,{label:"Value",required:!0,data:i,sx:{flex:1},...c})})]}),s.jsx(b.Controller,{name:`reference_lines.${e}.template`,control:t,render:({field:c})=>s.jsx(a.TextInput,{label:"Content Template",placeholder:"Average: ${avg}",sx:{flex:1},...c})}),s.jsxs(a.Group,{grow:!0,children:[s.jsxs(a.Stack,{children:[s.jsx(b.Controller,{name:`reference_lines.${e}.orientation`,control:t,render:({field:c})=>s.jsx(a.Select,{label:"Orientation",data:wb,required:!0,sx:{flex:1},...c})}),l==="vertical"&&s.jsx(a.Text,{mt:-10,color:"dimmed",size:12,children:"Works only when xAxis values are numbers"})]}),l==="horizontal"&&s.jsx(b.Controller,{name:`reference_lines.${e}.yAxisIndex`,control:t,render:({field:{value:c,onChange:u,...d}})=>s.jsx(a.Select,{label:"Y Axis",data:o,disabled:o.length===0,...d,value:(c==null?void 0:c.toString())??"",onChange:h=>{if(!h){u(0);return}u(Number(h))},sx:{flex:1}})})]}),s.jsx(a.Divider,{mb:-10,mt:10,variant:"dashed",label:"Style",labelPosition:"center"}),s.jsxs(a.Group,{grow:!0,children:[s.jsx(b.Controller,{name:`reference_lines.${e}.lineStyle.type`,control:t,render:({field:c})=>s.jsx(a.Select,{label:"Line Type",data:vb,sx:{flexGrow:1},...c})}),s.jsx(b.Controller,{name:`reference_lines.${e}.lineStyle.width`,control:t,render:({field:c})=>s.jsx(a.NumberInput,{label:"Line Width",min:1,max:10,sx:{flexGrow:1},...c})})]}),s.jsxs(a.Stack,{spacing:4,children:[s.jsx(a.Text,{size:"sm",children:"Color"}),s.jsx(b.Controller,{name:`reference_lines.${e}.lineStyle.color`,control:t,render:({field:c})=>s.jsx(Se,{...c})})]}),s.jsx(a.Button,{leftIcon:s.jsx(_.Trash,{size:16}),color:"red",variant:"light",onClick:()=>n(e),sx:{top:15,right:5},children:"Delete this Reference Line"})]})}function Sb({control:t,watch:e,variables:n}){const{fields:r,append:i,remove:o}=b.useFieldArray({control:t,name:"reference_lines"}),l=e("reference_lines"),c=r.map((x,m)=>({...x,...l[m]})),u=()=>{const x={name:"",template:"",variable_key:"",orientation:"horizontal",lineStyle:{type:"dashed",width:1,color:tt.random().css()},show_in_legend:!1,yAxisIndex:0};i(x)},d=f.useMemo(()=>n.map(x=>({label:x.name,value:x.name})),[n]),h=e("y_axes"),p=f.useMemo(()=>h.map(({name:x},m)=>({label:x,value:m.toString()})),[h]);return s.jsxs(a.Tabs,{defaultValue:"0",styles:{tab:{paddingTop:"0px",paddingBottom:"0px"},panel:{padding:"0px"}},children:[s.jsxs(a.Tabs.List,{children:[c.map((x,m)=>s.jsx(a.Tabs.Tab,{value:m.toString(),children:m+1},x.id)),s.jsx(a.Tabs.Tab,{onClick:u,value:"add",children:s.jsx(_.Plus,{size:18,color:"#228be6"})})]}),c.map((x,m)=>s.jsx(a.Tabs.Panel,{value:m.toString(),children:s.jsx(Cb,{control:t,index:m,remove:o,watch:e,variableOptions:d,yAxisOptions:p})},x.id))]})}const _b=({value:t,onChange:e})=>{const n=r=>{r&&e(r)};return s.jsx(a.Box,{children:s.jsx(me,{height:"500px",defaultLanguage:"javascript",value:t,onChange:n,theme:"vs-dark",options:{minimap:{enabled:!1}}})})},kb=({value:t,onChange:e})=>{const[n,{setTrue:r,setFalse:i}]=$.useBoolean(),[o,l]=f.useState(t),c=()=>{i();const{type:p,func_content:x}=o,m={type:p,func_content:x};l(m),e(m)},u=()=>{i(),l(t)},d=p=>{l(x=>({...x,func_content:p}))},h=()=>{d(en.dynamic.func_content)};return s.jsxs(s.Fragment,{children:[s.jsx(a.Box,{sx:{width:"50%"},children:s.jsx(a.Button,{variant:"filled",mt:24,onClick:r,sx:{flexGrow:0},children:"Setup"})}),s.jsx(a.Modal,{size:800,title:"Setup dynamic color",opened:n,onClose:i,closeOnClickOutside:!1,withCloseButton:!1,zIndex:320,children:n&&s.jsxs(a.Stack,{children:[s.jsx(a.Divider,{mt:10,mb:-10,label:"Dynamic by a custom function",labelPosition:"center",variant:"dashed"}),s.jsx(_b,{value:o.func_content,onChange:d}),s.jsxs(a.Group,{position:"apart",children:[s.jsx(a.Button,{onClick:h,color:"red",leftIcon:s.jsx(_.Recycle,{size:20}),children:"Reset"}),s.jsxs(a.Group,{position:"right",children:[s.jsx(a.Button,{onClick:u,variant:"subtle",children:"Cancel"}),s.jsx(a.Button,{onClick:c,children:"OK"})]})]})]})})]})},Tb=({value:t,onChange:e})=>t.type!=="dynamic"?null:s.jsx(kb,{value:t,onChange:e}),Ib=({value:t,onChange:e})=>{if(t.type!=="static")return null;const n=r=>{e({...t,color:r})};return s.jsx(a.ColorInput,{label:" ",format:"rgb",value:t.color,onChange:n})},Db=[{label:"Static",value:"static"},{label:"Dynamic",value:"dynamic"}],Mb=f.forwardRef(({label:t="Color",value:e,onChange:n},r)=>{const i=o=>{n({...en[o]})};return s.jsxs(a.SimpleGrid,{cols:2,children:[s.jsx(a.Select,{ref:r,label:t,data:Db,value:e.type,onChange:i,sx:{flexGrow:1}}),s.jsx(Ib,{value:e,onChange:n}),s.jsx(Tb,{value:e,onChange:n})]})}),zb=f.forwardRef(({value:t,onChange:e},n)=>{const r=o=>{e({...t,label:o})},i=o=>{e({...t,tooltip:o})};return s.jsxs(a.Stack,{ref:n,spacing:0,children:[s.jsx(pn,{sectionTitle:"Overflow on Chart",value:t.label,onChange:r}),s.jsx(pn,{sectionTitle:"Overflow in Tooltip",value:t.tooltip,onChange:i})]})}),Ab=({value:t,onChange:e})=>{const n=r=>{r&&e(r)};return s.jsx(a.Box,{children:s.jsx(me,{height:"500px",defaultLanguage:"javascript",value:t,onChange:n,theme:"vs-dark",options:{minimap:{enabled:!1}}})})},Ka={static:{type:"static",size:10},dynamic:{type:"dynamic",func_content:["function getSize({ rowData, params, variables }, { lodash, interpolate }) {"," // your code goes here"," // return 10","}"].join(`
276
+ `}}}function pb(t,e){const n=e.every(o=>!Number.isNaN(Number(o))),{axisLabel:r}=t.x_axis,i=e.length===0;return[{data:e,name:t.x_axis.name??"",nameGap:i?5:void 0,id:"main-x-axis",axisTick:{show:!0,alignWithLabel:!0},type:n?"value":"category",axisLabel:{...r,formatter:Wa(r.formatter)}}]}function hb(t,e){return t.y_axes.map(({nameAlignment:n,min:r,max:i,...o},l)=>{let c=o.position;return c||(c=l>0?"right":"left"),{...o,minInterval:1,min:r||void 0,max:i||void 0,position:c,axisLabel:{show:!0,formatter:e[l]??e.default},axisLine:{show:!0},nameTextStyle:{fontWeight:"bold",align:n},nameLocation:"end",nameGap:15,splitLine:{show:!1}}})}const xb={xAxis:[{type:"category",nameGap:25,nameLocation:"center",nameTextStyle:{fontWeight:"bold"},splitLine:{show:!1},axisTick:{show:!0,alignWithLabel:!0}}],grid:{top:10,left:20,right:15,bottom:25,containLabel:!0}};function fb(t,e,n){const r=n.reduce((u,d)=>{const h=it(d,e);return u[d.name]=qe(d,h),u},{}),i=t.y_axes.reduce((u,{label_formatter:d},h)=>(u[h]=function(x){let m=x;if(typeof x=="object"&&(Array.isArray(x.value)&&x.value.length===2?m=x.value[1]:m=x.value),!d)return m;try{return F(m).format(d)}catch(j){return console.error(j),m}},u),{default:({value:u})=>u}),o=y.uniq(st(e,t.x_axis.data_key)),l=lb(t,e,n,r),c={xAxis:pb(t,o),yAxis:hb(t,i),series:l,dataset:eb(t,e),tooltip:db(t,i),grid:tb(t),legend:nb(),dataZoom:Qs(t.dataZoom)};return y.defaultsDeep({},c,xb)}K.use([P.DataZoomComponent,te.BarChart,te.LineChart,te.ScatterChart,P.GridComponent,P.LegendComponent,P.TooltipComponent,we.CanvasRenderer,P.MarkLineComponent,P.MarkAreaComponent]);function Qa(t){return t.trim().length>0}function gb({conf:t,data:e,width:n,height:r,interactionManager:i,variables:o}){const l=gt(e,t.x_axis.data_key),c=Oe(i.triggerManager,Na.id),u=f.useCallback(p=>{const x=p.data;c.forEach(m=>{i.runInteraction(m.id,{...p,rowData:x})})},[l,c,i]),d=f.useMemo(()=>({click:u}),[u]),h=f.useMemo(()=>fb(t,e,o),[t,e]);return s.jsx(ve,{echarts:K,option:h,style:{width:n,height:r},onEvents:d,notMerge:!0,theme:"merico-light"})}function mb({context:t,instance:e}){const n=$e({vizManager:t.vizManager,instance:e}),{value:r}=O(t.instanceData,"config"),{variables:i}=t,o=f.useMemo(()=>y.defaults({},r,rr),[r]),l=t.data,{width:c,height:u}=t.viewport,{ref:d,height:h}=pe.useElementSize(),{ref:p,height:x}=pe.useElementSize(),m=f.useMemo(()=>{const{stats:{templates:C}}=o;return{top:Ht(C.top,i,l),bottom:Ht(C.bottom,i,l)}},[o,l]),j=Math.max(0,We(u)-h-x);return!c||!u?null:s.jsxs(Te,{width:c,height:u,children:[s.jsx(a.Text,{ref:d,align:"left",size:"xs",pl:"sm",sx:{display:Qa(o.stats.templates.top)?"block":"none"},children:Object.values(m.top).map(C=>C)}),s.jsx(gb,{variables:i,width:Ge(c),height:j,data:l,conf:o,interactionManager:n}),s.jsx(a.Text,{ref:p,align:"left",size:"xs",pl:"sm",sx:{display:Qa(o.stats.templates.bottom)?"block":"none"},children:Object.values(m.bottom).map(C=>C)})]})}const yb=f.forwardRef(({value:t,onChange:e,xAxisOptions:n,yAxisOptions:r,variableOptions:i},o)=>{const l=(c,u)=>{const d=y.cloneDeep(t);y.set(d,c,u),e(d)};return s.jsxs(a.Stack,{children:[s.jsx(a.Divider,{mb:-15,variant:"dashed",label:"Content",labelPosition:"right"}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(a.TextInput,{label:"Content Text",value:t.content.text,onChange:c=>l("content.text",c.currentTarget.value)}),s.jsx(Js,{label:"Text Position",value:t.label.position,onChange:c=>l("label.position",c)})]}),s.jsx(a.Divider,{mb:-15,variant:"dashed",label:"Endpoints",labelPosition:"right"}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[n&&s.jsx(a.Select,{label:"X Axis",data:n,value:t.xAxisIndex,onChange:c=>l("xAxisIndex",c)}),r&&s.jsx(a.Select,{label:"Y Axis",data:r,value:t.yAxisIndex,onChange:c=>l("xAxisIndex",c)})]}),s.jsxs(a.Stack,{spacing:0,children:[s.jsx(a.Text,{size:14,color:"#212529",fw:500,children:"Left-Bottom Point"}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(a.Select,{icon:s.jsx(a.Text,{children:"x"}),data:i,value:t.leftBottomPoint.x_data_key,onChange:c=>l("leftBottomPoint.x_data_key",c??""),clearable:!0}),s.jsx(a.Select,{icon:s.jsx(a.Text,{children:"y"}),data:i,value:t.leftBottomPoint.y_data_key,onChange:c=>l("leftBottomPoint.y_data_key",c??""),clearable:!0})]})]}),s.jsxs(a.Stack,{spacing:0,children:[s.jsx(a.Text,{size:14,color:"#212529",fw:500,children:"Right-Top Point"}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(a.Select,{icon:s.jsx(a.Text,{children:"x"}),data:i,value:t.rightTopPoint.x_data_key,onChange:c=>l("rightTopPoint.x_data_key",c??""),clearable:!0}),s.jsx(a.Select,{icon:s.jsx(a.Text,{children:"y"}),data:i,value:t.rightTopPoint.y_data_key,onChange:c=>l("rightTopPoint.y_data_key",c??""),clearable:!0})]})]}),s.jsx(a.Divider,{mb:-15,variant:"dashed",label:"Style",labelPosition:"right"}),s.jsxs(a.Stack,{spacing:4,children:[s.jsx(a.Text,{size:14,children:"Background Color"}),s.jsx(Se,{value:t.itemStyle.color,onChange:c=>l("itemStyle.color",c)})]}),s.jsxs(a.Stack,{spacing:4,children:[s.jsx(a.Text,{size:14,children:"Text Color"}),s.jsx(Se,{value:t.label.color,onChange:c=>l("label.color",c)})]})]})});function bb(){const t=new Date().getTime().toString();return{id:t,content:{text:t},itemStyle:{color:"rgba(0,0,0,0.05)"},label:{position:"inside",color:"rgba(0,0,0,0.5)"},leftBottomPoint:{x_data_key:"",y_data_key:""},rightTopPoint:{x_data_key:"",y_data_key:""},xAxisIndex:"0",yAxisIndex:"0"}}function jb({control:t,watch:e,variables:n}){const{fields:r,append:i,remove:o}=b.useFieldArray({control:t,name:"reference_areas"}),l=e("reference_areas"),c=r.map((x,m)=>({...x,...l[m]})),u=()=>{const x=bb();i(x)},d=f.useMemo(()=>n.map(x=>({label:x.name,value:x.name})),[n]),h=e("y_axes"),p=f.useMemo(()=>h.map(({name:x},m)=>({label:x,value:m.toString()})),[h]);return s.jsxs(a.Tabs,{defaultValue:"0",styles:{tab:{paddingTop:"0px",paddingBottom:"0px"},panel:{padding:"0px"}},children:[s.jsxs(a.Tabs.List,{children:[c.map((x,m)=>s.jsx(a.Tabs.Tab,{value:m.toString(),children:m+1},x.id)),s.jsx(a.Tabs.Tab,{onClick:u,value:"add",children:s.jsx(_.Plus,{size:18,color:"#228be6"})})]}),c.map((x,m)=>s.jsx(a.Tabs.Panel,{value:m.toString(),children:s.jsx(b.Controller,{name:`reference_areas.${m}`,control:t,render:({field:j})=>s.jsxs(a.Stack,{children:[s.jsx(yb,{variableOptions:d,yAxisOptions:p,...j}),s.jsx(a.Divider,{mb:-10,mt:10,variant:"dashed"}),s.jsx(a.Button,{leftIcon:s.jsx(k.IconTrash,{size:16}),color:"red",variant:"light",onClick:()=>o(m),children:"Delete this Reference Area"})]})})},x.id))]})}const vb=[{label:"solid",value:"solid"},{label:"dashed",value:"dashed"},{label:"dotted",value:"dotted"}],wb=[{label:"Horizontal",value:"horizontal"},{label:"Vertical",value:"vertical"}];function Cb({control:t,index:e,remove:n,watch:r,variableOptions:i,yAxisOptions:o}){const l=r(`reference_lines.${e}.orientation`);return s.jsxs(a.Stack,{my:0,p:0,sx:{position:"relative"},children:[s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`reference_lines.${e}.name`,control:t,render:({field:c})=>s.jsx(a.TextInput,{label:"Name",placeholder:"Average Reference Line",required:!0,sx:{flex:1},...c})}),s.jsx(b.Controller,{name:`reference_lines.${e}.variable_key`,control:t,render:({field:c})=>s.jsx(a.Select,{label:"Value",required:!0,data:i,sx:{flex:1},...c})})]}),s.jsx(b.Controller,{name:`reference_lines.${e}.template`,control:t,render:({field:c})=>s.jsx(a.TextInput,{label:"Content Template",placeholder:"Average: ${avg}",sx:{flex:1},...c})}),s.jsxs(a.Group,{grow:!0,children:[s.jsxs(a.Stack,{children:[s.jsx(b.Controller,{name:`reference_lines.${e}.orientation`,control:t,render:({field:c})=>s.jsx(a.Select,{label:"Orientation",data:wb,required:!0,sx:{flex:1},...c})}),l==="vertical"&&s.jsx(a.Text,{mt:-10,color:"dimmed",size:12,children:"Works only when xAxis values are numbers"})]}),l==="horizontal"&&s.jsx(b.Controller,{name:`reference_lines.${e}.yAxisIndex`,control:t,render:({field:{value:c,onChange:u,...d}})=>s.jsx(a.Select,{label:"Y Axis",data:o,disabled:o.length===0,...d,value:(c==null?void 0:c.toString())??"",onChange:h=>{if(!h){u(0);return}u(Number(h))},sx:{flex:1}})})]}),s.jsx(a.Divider,{mb:-10,mt:10,variant:"dashed",label:"Style",labelPosition:"center"}),s.jsxs(a.Group,{grow:!0,children:[s.jsx(b.Controller,{name:`reference_lines.${e}.lineStyle.type`,control:t,render:({field:c})=>s.jsx(a.Select,{label:"Line Type",data:vb,sx:{flexGrow:1},...c})}),s.jsx(b.Controller,{name:`reference_lines.${e}.lineStyle.width`,control:t,render:({field:c})=>s.jsx(a.NumberInput,{label:"Line Width",min:1,max:10,sx:{flexGrow:1},...c})})]}),s.jsxs(a.Stack,{spacing:4,children:[s.jsx(a.Text,{size:"sm",children:"Color"}),s.jsx(b.Controller,{name:`reference_lines.${e}.lineStyle.color`,control:t,render:({field:c})=>s.jsx(Se,{...c})})]}),s.jsx(a.Button,{leftIcon:s.jsx(_.Trash,{size:16}),color:"red",variant:"light",onClick:()=>n(e),sx:{top:15,right:5},children:"Delete this Reference Line"})]})}function Sb({control:t,watch:e,variables:n}){const{fields:r,append:i,remove:o}=b.useFieldArray({control:t,name:"reference_lines"}),l=e("reference_lines"),c=r.map((x,m)=>({...x,...l[m]})),u=()=>{const x={name:"",template:"",variable_key:"",orientation:"horizontal",lineStyle:{type:"dashed",width:1,color:tt.random().css()},show_in_legend:!1,yAxisIndex:0};i(x)},d=f.useMemo(()=>n.map(x=>({label:x.name,value:x.name})),[n]),h=e("y_axes"),p=f.useMemo(()=>h.map(({name:x},m)=>({label:x,value:m.toString()})),[h]);return s.jsxs(a.Tabs,{defaultValue:"0",styles:{tab:{paddingTop:"0px",paddingBottom:"0px"},panel:{padding:"0px"}},children:[s.jsxs(a.Tabs.List,{children:[c.map((x,m)=>s.jsx(a.Tabs.Tab,{value:m.toString(),children:m+1},x.id)),s.jsx(a.Tabs.Tab,{onClick:u,value:"add",children:s.jsx(_.Plus,{size:18,color:"#228be6"})})]}),c.map((x,m)=>s.jsx(a.Tabs.Panel,{value:m.toString(),children:s.jsx(Cb,{control:t,index:m,remove:o,watch:e,variableOptions:d,yAxisOptions:p})},x.id))]})}const _b=({value:t,onChange:e})=>{const n=r=>{r&&e(r)};return s.jsx(a.Box,{children:s.jsx(me,{height:"500px",defaultLanguage:"javascript",value:t,onChange:n,theme:"vs-dark",options:{minimap:{enabled:!1}}})})},kb=({value:t,onChange:e})=>{const[n,{setTrue:r,setFalse:i}]=$.useBoolean(),[o,l]=f.useState(t),c=()=>{i();const{type:p,func_content:x}=o,m={type:p,func_content:x};l(m),e(m)},u=()=>{i(),l(t)},d=p=>{l(x=>({...x,func_content:p}))},h=()=>{d(en.dynamic.func_content)};return s.jsxs(s.Fragment,{children:[s.jsx(a.Box,{sx:{width:"50%"},children:s.jsx(a.Button,{variant:"filled",mt:24,onClick:r,sx:{flexGrow:0},children:"Setup"})}),s.jsx(a.Modal,{size:800,title:"Setup dynamic color",opened:n,onClose:i,closeOnClickOutside:!1,withCloseButton:!1,zIndex:320,children:n&&s.jsxs(a.Stack,{children:[s.jsx(a.Divider,{mt:10,mb:-10,label:"Dynamic by a custom function",labelPosition:"center",variant:"dashed"}),s.jsx(_b,{value:o.func_content,onChange:d}),s.jsxs(a.Group,{position:"apart",children:[s.jsx(a.Button,{onClick:h,color:"red",leftIcon:s.jsx(_.Recycle,{size:20}),children:"Reset"}),s.jsxs(a.Group,{position:"right",children:[s.jsx(a.Button,{onClick:u,variant:"subtle",children:"Cancel"}),s.jsx(a.Button,{onClick:c,children:"OK"})]})]})]})})]})},Tb=({value:t,onChange:e})=>t.type!=="dynamic"?null:s.jsx(kb,{value:t,onChange:e}),Ib=({value:t,onChange:e})=>{if(t.type!=="static")return null;const n=r=>{e({...t,color:r})};return s.jsx(a.ColorInput,{label:" ",format:"rgb",value:t.color,onChange:n})},Db=[{label:"Static",value:"static"},{label:"Dynamic",value:"dynamic"}],Mb=f.forwardRef(({label:t="Color",value:e,onChange:n},r)=>{const i=o=>{n({...en[o]})};return s.jsxs(a.SimpleGrid,{cols:2,children:[s.jsx(a.Select,{ref:r,label:t,data:Db,value:e.type,onChange:i,sx:{flexGrow:1}}),s.jsx(Ib,{value:e,onChange:n}),s.jsx(Tb,{value:e,onChange:n})]})}),zb=f.forwardRef(({value:t,onChange:e},n)=>{const r=o=>{e({...t,label:o})},i=o=>{e({...t,tooltip:o})};return s.jsxs(a.Stack,{ref:n,spacing:0,children:[s.jsx(pn,{sectionTitle:"Overflow on Chart",value:t.label,onChange:r}),s.jsx(pn,{sectionTitle:"Overflow in Tooltip",value:t.tooltip,onChange:i})]})}),Ab=({value:t,onChange:e})=>{const n=r=>{r&&e(r)};return s.jsx(a.Box,{children:s.jsx(me,{height:"500px",defaultLanguage:"javascript",value:t,onChange:n,theme:"vs-dark",options:{minimap:{enabled:!1}}})})},Ka={static:{type:"static",size:10},dynamic:{type:"dynamic",func_content:["function getSize({ rowData, params, variables }, { lodash, interpolate }) {"," // your code goes here"," // return 10","}"].join(`
277
277
  `)}},Eb=({value:t,onChange:e})=>{const[n,{setTrue:r,setFalse:i}]=$.useBoolean(),[o,l]=f.useState(t),c=()=>{i();const{type:p,func_content:x}=o,m={type:p,func_content:x};l(m),e(m)},u=()=>{i(),l(t)},d=p=>{l(x=>({...x,func_content:p}))},h=()=>{d(Ka.dynamic.func_content)};return s.jsxs(s.Fragment,{children:[s.jsx(a.Box,{sx:{width:"50%"},children:s.jsx(a.Button,{variant:"filled",mt:24,onClick:r,sx:{flexGrow:0},children:"Setup"})}),s.jsx(a.Modal,{size:800,title:"Setup dynamic size",opened:n,onClose:i,closeOnClickOutside:!1,withCloseButton:!1,zIndex:320,children:n&&s.jsxs(a.Stack,{children:[s.jsx(a.Divider,{mt:10,mb:-10,label:"Dynamic by a custom function",labelPosition:"center",variant:"dashed"}),s.jsx(Ab,{value:o.func_content,onChange:d}),s.jsxs(a.Group,{position:"apart",children:[s.jsx(a.Button,{onClick:h,color:"red",leftIcon:s.jsx(_.Recycle,{size:20}),children:"Reset"}),s.jsxs(a.Group,{position:"right",children:[s.jsx(a.Button,{onClick:u,variant:"subtle",children:"Cancel"}),s.jsx(a.Button,{onClick:c,children:"OK"})]})]})]})})]})},Pb=({value:t,onChange:e})=>t.type!=="dynamic"?null:s.jsx(Eb,{value:t,onChange:e}),Lb=({value:t,onChange:e})=>{if(t.type!=="static")return null;const n=r=>{e({...t,size:r})};return s.jsx(s.Fragment,{children:s.jsx(a.NumberInput,{defaultValue:18,placeholder:"1 ~ 100",label:" ",hideControls:!0,value:t.size,onChange:n})})},Bb=[{label:"Static",value:"static"},{label:"Dynamic",value:"dynamic"}],Ob=f.forwardRef(({label:t="Size",value:e,onChange:n},r)=>{const i=o=>{n({...Ka[o]})};return s.jsxs(a.SimpleGrid,{cols:2,children:[s.jsx(a.Select,{ref:r,label:t,data:Bb,value:e.type,onChange:i,sx:{flexGrow:1}}),s.jsx(Lb,{value:e,onChange:n}),s.jsx(Pb,{value:e,onChange:n})]})}),$b=[{label:"off",value:""},{label:"top",value:"top"},{label:"left",value:"left"},{label:"right",value:"right"},{label:"bottom",value:"bottom"},{label:"inside",value:"inside"},{label:"insideLeft",value:"insideLeft"},{label:"insideRight",value:"insideRight"},{label:"insideTop",value:"insideTop"},{label:"insideBottom",value:"insideBottom"},{label:"insideTopLeft",value:"insideTopLeft"},{label:"insideBottomLeft",value:"insideBottomLeft"},{label:"insideTopRight",value:"insideTopRight"},{label:"insideBottomRight",value:"insideBottomRight"}];function Vb({control:t,watch:e}){return e(["scatter"]),s.jsxs(a.Stack,{children:[s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:"scatter.name_data_key",control:t,render:({field:n})=>s.jsx(B,{label:"Name Data Field",required:!0,sx:{flex:1},...n})}),s.jsx(b.Controller,{name:"scatter.y_data_key",control:t,render:({field:n})=>s.jsx(B,{label:"Value Data Field",required:!0,sx:{flex:1},...n})})]}),s.jsx(a.Divider,{mb:-15,label:"Style",labelPosition:"center"}),s.jsx(b.Controller,{name:"scatter.symbolSize",control:t,render:({field:n})=>s.jsx(Ob,{label:"Size",...n})}),s.jsx(b.Controller,{name:"scatter.color",control:t,render:({field:n})=>s.jsx(Mb,{...n})}),s.jsx(a.Divider,{mb:-15,label:"Label",labelPosition:"center"}),s.jsx(a.Group,{grow:!0,noWrap:!0,children:s.jsx(b.Controller,{name:"scatter.label_position",control:t,render:({field:n})=>s.jsx(a.Select,{label:"Label Position",data:$b,...n})})}),s.jsx(b.Controller,{name:"scatter.label_overflow",control:t,render:({field:n})=>s.jsx(zb,{...n})})]})}function qb({control:t,watch:e}){return e("stats"),s.jsx(a.Stack,{children:s.jsxs(a.Stack,{spacing:0,children:[s.jsx(b.Controller,{name:"stats.templates.top",control:t,render:({field:n})=>s.jsx(Rt,{label:"Template for stats above the chart",py:"md",sx:{flexGrow:1},...n})}),s.jsx(b.Controller,{name:"stats.templates.bottom",control:t,render:({field:n})=>s.jsx(Rt,{label:"Template for stats under the chart",py:"md",sx:{flexGrow:1},...n})})]})})}const Nb=({control:t,index:e,remove:n})=>s.jsxs(a.Stack,{children:[s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`tooltip.metrics.${e}.name`,control:t,render:({field:r})=>s.jsx(a.TextInput,{label:"Name",required:!0,sx:{flex:1},...r})}),s.jsx(b.Controller,{name:`tooltip.metrics.${e}.data_key`,control:t,render:({field:r})=>s.jsx(B,{label:"Value Field",required:!0,sx:{flex:1},...r})})]}),s.jsx(a.Divider,{mb:-10,mt:10,variant:"dashed"}),s.jsx(a.Button,{leftIcon:s.jsx(_.Trash,{size:16}),color:"red",variant:"light",onClick:()=>n(e),sx:{top:15,right:5},children:"Delete this Metric"})]}),Fb=({control:t,watch:e})=>{const{fields:n,append:r,remove:i}=b.useFieldArray({control:t,name:"tooltip.metrics"}),o=e("tooltip.metrics"),l=n.map((p,x)=>({...p,...o[x]})),c=()=>r({id:Date.now().toString(),data_key:"",name:""}),u=e("tooltip.metrics.0.id"),[d,h]=f.useState(()=>u??null);return f.useEffect(()=>{u&&h(p=>p!==null?p:u)},[u]),s.jsxs(s.Fragment,{children:[s.jsxs(a.Group,{spacing:2,sx:{cursor:"default",userSelect:"none"},children:[s.jsx(_.InfoCircle,{size:14,color:"#888"}),s.jsx(a.Text,{size:14,color:"#888",children:"Configure additional metrics to show in tooltip"})]}),s.jsxs(a.Tabs,{value:d,onTabChange:p=>h(p),styles:{tab:{paddingTop:"0px",paddingBottom:"0px"},panel:{padding:"0px",paddingTop:"6px"}},children:[s.jsxs(a.Tabs.List,{children:[l.map((p,x)=>s.jsx(a.Tabs.Tab,{value:p.id,children:p.name?p.name:x},p.id)),s.jsx(a.Tabs.Tab,{onClick:c,value:"add",children:s.jsx(_.Plus,{size:18,color:"#228be6"})})]}),l.map((p,x)=>s.jsx(a.Tabs.Panel,{value:p.id,children:s.jsx(Nb,{control:t,index:x,remove:i},p.id)},p.id))]})]})},Gb=[{label:"Scatter Point",value:"item"},{label:"X Axis",value:"axis"}];function Wb({control:t,watch:e}){return e("tooltip.trigger"),s.jsxs(a.Stack,{children:[s.jsx(b.Controller,{name:"tooltip.trigger",control:t,render:({field:n})=>s.jsx(a.Select,{label:"Trigger",data:Gb,sx:{flexGrow:1},...n})}),s.jsx(a.Divider,{variant:"dashed"}),s.jsx(Fb,{control:t,watch:e})]})}const Rb=({disabled:t,value:e,onChange:n})=>{const r=i=>{i&&n(i)};return s.jsxs(a.Box,{sx:{position:"relative"},children:[t&&s.jsx(a.Overlay,{opacity:.6,color:"#fff",zIndex:5,blur:2}),s.jsx(me,{height:"500px",defaultLanguage:"javascript",value:e,onChange:r,theme:"vs-dark",options:{minimap:{enabled:!1},readOnly:t}})]})},Qb=f.forwardRef(({value:t,onChange:e},n)=>{const[r,{setTrue:i,setFalse:o}]=$.useBoolean(),[l,c]=f.useState(t);f.useEffect(()=>{c(t)},[t]);const u=m=>{c({...l,enabled:m})},d=()=>{o();const{enabled:m,func_content:j}=l,C={enabled:m,func_content:j};c(C),e(C)},h=()=>{o(),c(t)},p=m=>{c(j=>({...j,func_content:m}))},x=()=>{p(Fa.func_content)};return s.jsxs(s.Fragment,{children:[s.jsx(a.Button,{variant:"filled",mt:24,onClick:i,sx:{flexGrow:0},children:"Customize Label"}),s.jsx(a.Modal,{size:800,title:"Customize label content",opened:r,onClose:o,closeOnClickOutside:!1,withCloseButton:!1,zIndex:320,children:r&&s.jsxs(a.Stack,{children:[s.jsx(a.Checkbox,{mt:10,label:"Enabled",checked:l.enabled,onChange:m=>u(m.currentTarget.checked)}),s.jsx(Rb,{value:l.func_content,onChange:p,disabled:!l.enabled}),s.jsxs(a.Group,{position:"apart",children:[s.jsx(a.Button,{onClick:x,color:"red",leftIcon:s.jsx(_.Recycle,{size:20}),children:"Reset"}),s.jsxs(a.Group,{position:"right",children:[s.jsx(a.Button,{onClick:h,variant:"subtle",children:"Cancel"}),s.jsx(a.Button,{onClick:d,children:"OK"})]})]})]})})]})});function Kb({control:t,watch:e}){return e(["x_axis"]),s.jsxs(a.Stack,{children:[s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:"x_axis.data_key",control:t,render:({field:n})=>s.jsx(B,{label:"Data Field",required:!0,sx:{flex:1},...n})}),s.jsx(b.Controller,{name:"x_axis.name",control:t,render:({field:n})=>s.jsx(a.TextInput,{label:"Name",sx:{flex:1},...n})})]}),s.jsx(a.Divider,{mb:-15,label:"Tick Label",labelPosition:"center"}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:"x_axis.axisLabel.rotate",control:t,render:({field:n})=>s.jsx(a.NumberInput,{label:"Rotate",hideControls:!0,min:-90,max:90,rightSection:s.jsx(a.Text,{color:"dimmed",children:"degree"}),sx:{width:"48%"},styles:{rightSection:{width:"4em",justifyContent:"flex-end",paddingRight:"6px"}},...n})}),s.jsx(b.Controller,{name:"x_axis.axisLabel.formatter",control:t,render:({field:n})=>s.jsx(Qb,{...n})})]})]})}const Ub=[{label:"left",value:"left"},{label:"center",value:"center"},{label:"right",value:"right"}],Yb=[{label:"left",value:"left"},{label:"right",value:"right"}];function Xb({control:t,index:e,remove:n}){return s.jsxs(a.Stack,{my:0,p:"0",sx:{position:"relative"},children:[s.jsx(a.Divider,{mb:-15,mt:15,variant:"dashed",label:"Name",labelPosition:"center"}),s.jsxs(a.Group,{grow:!0,noWrap:!0,children:[s.jsx(b.Controller,{name:`y_axes.${e}.name`,control:t,render:({field:r})=>s.jsx(a.TextInput,{label:"Name",required:!0,sx:{flex:1},...r})}),s.jsx(b.Controller,{name:`y_axes.${e}.nameAlignment`,control:t,render:({field:r})=>s.jsx(a.Select,{label:"Align",required:!0,data:Ub,sx:{flex:1},...r})})]}),s.jsx(a.Divider,{mb:-15,variant:"dashed",label:"Layout",labelPosition:"center"}),s.jsx(a.Group,{grow:!0,noWrap:!0,children:s.jsx(b.Controller,{name:`y_axes.${e}.position`,control:t,render:({field:r})=>s.jsx(a.Select,{label:"Position",required:!0,data:Yb,sx:{flex:1},...r})})}),s.jsxs(a.Stack,{children:[s.jsx(a.Divider,{mb:-15,variant:"dashed",label:"Label Format",labelPosition:"center"}),s.jsx(b.Controller,{name:`y_axes.${e}.label_formatter`,control:t,render:({field:r})=>s.jsx(ze,{...r})})]}),s.jsxs(a.Stack,{children:[s.jsx(a.Divider,{mb:-15,variant:"dashed",label:"Value Range",labelPosition:"center"}),s.jsxs(a.Group,{grow:!0,children:[s.jsx(b.Controller,{name:`y_axes.${e}.min`,control:t,render:({field:r})=>s.jsx(a.TextInput,{label:"Min",...r})}),s.jsx(b.Controller,{name:`y_axes.${e}.max`,control:t,render:({field:r})=>s.jsx(a.TextInput,{label:"Max",...r})})]})]}),s.jsx(a.Button,{mt:20,leftIcon:s.jsx(_.Trash,{size:16}),color:"red",variant:"light",onClick:()=>n(e),disabled:e===0,children:"Delete this YAxis"})]})}function Jb({control:t,watch:e}){const{fields:n,append:r,remove:i}=b.useFieldArray({control:t,name:"y_axes"}),o=e("y_axes"),l=n.map((u,d)=>({...u,...o[d]})),c=()=>r({name:"",label_formatter:ye,min:"",max:"",show:!0,position:"right",nameAlignment:"right"});return s.jsxs(a.Tabs,{defaultValue:"0",styles:{tab:{paddingTop:"0px",paddingBottom:"0px"},panel:{padding:"0px"}},children:[s.jsxs(a.Tabs.List,{children:[l.map((u,d)=>s.jsx(a.Tabs.Tab,{value:d.toString(),children:d+1},u.id)),s.jsx(a.Tabs.Tab,{onClick:c,value:"add",children:s.jsx(_.Plus,{size:18,color:"#228be6"})})]}),l.map((u,d)=>s.jsx(a.Tabs.Panel,{value:d.toString(),children:s.jsx(Xb,{control:t,index:d,remove:i})},u.id))]})}function Zb(t){return t||{templates:{top:"",bottom:""}}}function Hb({reference_lines:t=[],stats:e,...n}){return{reference_lines:t,stats:Zb(e),...n}}function ej({context:t}){const{value:e,set:n}=O(t.instanceData,"config"),{variables:r}=t,i=f.useMemo(()=>y.defaultsDeep({},e,rr),[e]),o=f.useMemo(()=>Hb(i),[i]);f.useEffect(()=>{!y.isEqual(i,o)&&(console.log("config malformed, resetting to defaults",i,o),n(o))},[i,o]);const{control:l,handleSubmit:c,watch:u,getValues:d,reset:h}=b.useForm({defaultValues:o});f.useEffect(()=>{h(o)},[o]);const p=d(),x=f.useMemo(()=>!y.isEqual(p,i),[p,i]);return u(["dataZoom"]),s.jsx(a.Stack,{spacing:"xs",children:s.jsxs("form",{onSubmit:c(n),children:[s.jsxs(a.Group,{position:"left",py:"md",pl:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef"},children:[s.jsx(a.Text,{children:"Chart Config"}),s.jsx(a.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",disabled:!x,children:s.jsx(_.DeviceFloppy,{size:20})})]}),s.jsxs(a.Tabs,{defaultValue:"X Axis",orientation:"vertical",styles:{tab:{paddingLeft:"6px",paddingRight:"6px"},panel:{paddingTop:"6px",paddingLeft:"12px"}},children:[s.jsxs(a.Tabs.List,{children:[s.jsx(a.Tabs.Tab,{value:"X Axis",children:"X Axis"}),s.jsx(a.Tabs.Tab,{value:"Y Axes",children:"Y Axes"}),s.jsx(a.Tabs.Tab,{value:"Scatter",children:"Scatter"}),s.jsx(a.Tabs.Tab,{value:"Tooltip",children:"Tooltip"}),s.jsx(a.Tabs.Tab,{value:"Stats",children:"Stats"}),s.jsx(a.Tabs.Tab,{value:"Reference Lines",children:"Reference Lines"}),s.jsx(a.Tabs.Tab,{value:"Reference Areas",children:"Reference Areas"}),s.jsx(a.Tabs.Tab,{value:"Zooming",children:"Zooming"})]}),s.jsx(a.Tabs.Panel,{value:"X Axis",children:s.jsx(Kb,{control:l,watch:u})}),s.jsx(a.Tabs.Panel,{value:"Y Axes",children:s.jsx(Jb,{control:l,watch:u})}),s.jsx(a.Tabs.Panel,{value:"Scatter",children:s.jsx(Vb,{control:l,watch:u})}),s.jsx(a.Tabs.Panel,{value:"Tooltip",children:s.jsx(Wb,{control:l,watch:u})}),s.jsx(a.Tabs.Panel,{value:"Stats",children:s.jsx(qb,{control:l,watch:u})}),s.jsx(a.Tabs.Panel,{value:"Reference Lines",children:s.jsx(Sb,{variables:r,control:l,watch:u})}),s.jsx(a.Tabs.Panel,{value:"Reference Areas",children:s.jsx(jb,{variables:r,control:l,watch:u})}),s.jsx(a.Tabs.Panel,{value:"Zooming",children:s.jsx(b.Controller,{name:"dataZoom",control:l,render:({field:m})=>s.jsx(Us,{...m})})})]})]})})}function tj(t){const{dataZoom:e=Et,...n}=t;return{...n,dataZoom:e}}function nj(t){const e={scatter:{label_overflow:Ga}};return y.defaultsDeep(e,t)}function sj(t){const{color:e}=t.scatter;return typeof e=="string"?{...t,scatter:{...t.scatter,color:{...en.static,color:e}}}:t}function rj(t){const e=t.reference_lines.map(n=>{const{lineStyle:r={type:"dashed",width:1,color:tt.random().css()},show_in_legend:i=!1,yAxisIndex:o=0}=n;return{...n,lineStyle:r,show_in_legend:i,yAxisIndex:o}});return{...t,reference_lines:e}}function ij(t){const e={tooltip:{trigger:"item"}};return y.defaultsDeep({},t,e)}function aj(t,{panelModel:e}){try{const n=e.queryIDs[0];if(!n)throw new Error("cannot migrate when queryID is empty");const r=u=>u&&`${n}.${u}`,{x_axis:i,scatter:o,tooltip:l,...c}=t;return{...c,x_axis:{...i,data_key:r(i.data_key)},scatter:{...o,y_data_key:r(o.y_data_key),name_data_key:r(o.name_data_key)},tooltip:{...l,metrics:l.metrics.map(u=>({...u,data_key:r(u.data_key)}))}}}catch(n){throw console.error("[Migration failed]",n),n}}class oj extends re{constructor(){super(...arguments);A(this,"VERSION",9)}configVersions(){this.version(1,n=>({version:1,config:n})),this.version(2,n=>{const{tooltip:r={metrics:[]},...i}=n.config;return{...n,version:2,config:{...i,tooltip:r}}}),this.version(3,n=>({...n,version:3,config:tj(n.config)})),this.version(4,n=>{const{config:r}=n;return{...n,version:5,config:nj(r)}}),this.version(6,n=>{const{config:r}=n;return{...n,version:6,config:sj(r)}}),this.version(7,n=>{const{config:r}=n;return{...n,version:7,config:rj(r)}}),this.version(8,n=>{const{config:r}=n;return{...n,version:8,config:ij(r)}}),this.version(9,(n,r)=>{const{config:i}=n;return{...n,version:9,config:aj(i,r)}})}}const lj={displayName:"Scatter Chart",displayGroup:"ECharts-based charts",migrator:new oj,name:"scatterChart",viewRender:mb,configRender:ej,createConfig(){return{version:9,config:y.cloneDeep(rr)}},triggers:[Na]},ir={template:"The variable ${value} is defined in Variables section",vertical_align:"center",horizontal_align:"left"};function cj(t){if("variables"in t)return t;const{align:e,size:n,weight:r,color:i,content:{prefix:o="",data_field:l="value",formatter:c={output:"number",mantissa:0},postfix:u=""}={}}=t;return{align:e,template:`${o} \${value} ${u}`,variables:[{name:"value",data_field:l,aggregation:{type:"none",config:{}},formatter:c,color:i,weight:r,size:n}]}}function uj(t){return y.omit(t,["variables"])}function dj(t){const{align:e,...n}=t;return{horizontal_align:e,vertical_align:"center",...n}}function pj(t){const e=y.cloneDeep(t),n=y.get(e,"color.valueRange");return n!==void 0&&y.set(e,"color.valueRange",n.map(r=>Number(r))),e}class hj extends re{constructor(){super(...arguments);A(this,"VERSION",2)}configVersions(){this.version(1,n=>({version:1,config:cj(n)})),this.version(2,(n,{panelModel:r})=>{const{config:i}=n;return(i.variables||[]).forEach(l=>{r.variables.find(c=>c.name===l.name)||r.addVariable(pj(l))}),{...n,version:2,config:uj(i)}}),this.version(3,n=>{const{config:r}=n;return{...n,version:3,config:dj(r)}})}}const xj={left:"flex-start",center:"center",right:"flex-end"},fj={top:"flex-start",center:"center",bottom:"flex-end"},gj=S.observer(({context:t})=>{const e=oe(),{value:n=ir}=O(t.instanceData,"config"),{variables:r}=t,{template:i,horizontal_align:o,vertical_align:l}=n,{width:c,height:u}=t.viewport,d=f.useMemo(()=>{try{return y.template(i)(e.payloadForSQL)}catch{return i}},[e.payloadForSQL,i]),h=f.useMemo(()=>Ht(d,r,t.data),[d,r,t.data,t]);return s.jsx(a.Center,{sx:{width:c,height:u,justifyContent:xj[o],alignItems:fj[l]},children:s.jsx(a.Box,{children:Object.values(h).map((p,x)=>s.jsx(f.Fragment,{children:p},x))})})}),mj=[{label:"Left",value:"left"},{label:"Center",value:"center"},{label:"Right",value:"right"}],yj=[{label:"Top",value:"top"},{label:"Center",value:"center"},{label:"Bottom",value:"bottom"}];function bj({context:t}){const{value:e,set:n}=O(t.instanceData,"config"),r=f.useMemo(()=>y.defaultsDeep({},e,ir),[e]),{control:i,handleSubmit:o,watch:l,getValues:c,reset:u}=b.useForm({defaultValues:r});f.useEffect(()=>{u(r)},[r]),l(["template","horizontal_align","vertical_align"]);const d=c(),h=f.useMemo(()=>!y.isEqual(d,e),[d,e]);return s.jsx(a.Stack,{spacing:"xs",children:s.jsxs("form",{onSubmit:o(n),children:[s.jsxs(a.Group,{position:"left",py:"md",pl:"md",sx:{borderBottom:"1px solid #eee",background:"#efefef"},children:[s.jsx(a.Text,{weight:500,children:"Stats Configurations"}),s.jsx(a.ActionIcon,{type:"submit",mr:5,variant:"filled",color:"blue",disabled:!h,children:s.jsx(_.DeviceFloppy,{size:20})})]}),s.jsx(b.Controller,{name:"template",control:i,render:({field:p})=>s.jsx(Rt,{label:"Template",py:"md",sx:{flexGrow:1},...p})}),s.jsxs(a.SimpleGrid,{cols:2,children:[s.jsx(b.Controller,{name:"horizontal_align",control:i,render:({field:p})=>s.jsx(a.Select,{label:"Horizontal Alignment",data:mj,...p})}),s.jsx(b.Controller,{control:i,name:"vertical_align",render:({field:p})=>s.jsx(a.Select,{label:"Vertical Alignment",data:yj,...p})})]})]})})}const jj={createConfig(){return{version:3,config:ir}},displayName:"Stats",displayGroup:"Others",migrator:new hj,name:"stats",viewRender:gj,configRender:bj},ar={label_key:"",value_key:"",group_key:"",levels:[]};function vj(t){const e=new Set(t.map(r=>r.parent_id)),n=new Set(t.map(r=>r.id));return e.forEach(r=>{r===null||n.has(r)||t.push({id:r,name:r,parent_id:null})}),t}function wj(t){const e=vj(t).map(i=>({...i,children:[]})),n=y.keyBy(e,i=>i.id),r=[];return e.forEach(i=>{if(!i.parent_id||!n[i.parent_id]){r.push(i);return}n[i.parent_id].children.push(i)}),r}function Cj(t,e){const{label_key:n,value_key:r,group_key:i}=t;if(!n||!r)return[];const o=D(n),l=D(r),c=D(i),u=e[o.queryID].map(d=>({...d,id:d[o.columnKey],parent_id:d[c.columnKey],name:d[o.columnKey],value:d[l.columnKey]?Number(d[l.columnKey]):d[l.columnKey]}));return i?wj(u):u}const Sj=t=>({treePathInfo:e,name:n,value:r})=>{if(e.length===1||!t)return n;try{const i=e[e.length-2].value;if(r/i<t)return" "}catch{return n}};function _j(t){const{levels:e}=t;return e.map(n=>{const{show_label_tolerance:r,...i}=n.label;return{...n,label:{...i,formatter:Sj(r)}}})}function kj(){return({treePathInfo:t,name:e,value:n,color:r,marker:i,...o})=>{const l=t.slice(0,t.length-1),c=[`<tr>
278
278
  <th style="text-align: right; padding: 0 1em;">Value</th>
279
279
  <td style="text-align: left; padding: 0 1em;">${n}</td>