datajunction-ui/dist/MetricFlowGraph-B4VECq74.cjs

DataJunction UI

"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("react/jsx-runtime"),f=require("react"),d=require("./index-h1A5IisM.cjs");function R({data:e,selected:s}){var i,p;const a=((i=e.components)==null?void 0:i.length)||0;return n.jsxs("div",{className:`compact-node compact-node-preagg ${s?"selected":""}`,children:[n.jsx("div",{className:"compact-node-icon",children:"◫"}),n.jsxs("div",{className:"compact-node-content",children:[n.jsx("div",{className:"compact-node-name",children:e.name}),n.jsxs("div",{className:"compact-node-meta",children:[n.jsxs("span",{className:"meta-item",children:[a," components"]}),((p=e.grain)==null?void 0:p.length)>0&&n.jsxs("span",{className:"meta-item grain-count",children:[e.grain.length," grain cols"]})]})]}),n.jsx(d.Handle$1,{type:"source",position:d.Position.Right})]})}function T({data:e,selected:s}){return n.jsxs("div",{className:`compact-node compact-node-metric ${e.isDerived?"compact-node-derived":""} ${s?"selected":""}`,children:[n.jsx(d.Handle$1,{type:"target",position:d.Position.Left}),n.jsx("div",{className:"compact-node-icon",children:e.isDerived?"◇":"◈"}),n.jsxs("div",{className:"compact-node-content",children:[n.jsx("div",{className:"compact-node-name",children:e.shortName}),e.isDerived&&n.jsx("div",{className:"compact-node-badge",children:"Derived"})]})]})}function L({data:e,selected:s}){return n.jsxs("div",{className:`compact-node compact-node-component ${s?"selected":""}`,children:[n.jsx(d.Handle$1,{type:"target",position:d.Position.Left}),n.jsx("div",{className:"compact-node-icon",children:"●"}),n.jsxs("div",{className:"compact-node-content",children:[n.jsx("div",{className:"compact-node-name",children:e.shortName}),n.jsx("div",{className:"compact-node-meta",children:n.jsx("span",{className:"meta-item",children:e.aggregation||"RAW"})})]}),n.jsx(d.Handle$1,{type:"source",position:d.Position.Right})]})}const O={preagg:R,component:L,metric:T},b=200,I=50;function W(e,s){const a=new d.dagre.graphlib.Graph;return a.setDefaultEdgeLabel(()=>({})),a.setGraph({rankdir:"LR",nodesep:60,ranksep:150,marginx:40,marginy:40}),e.forEach(p=>{a.setNode(p.id,{width:b,height:I})}),s.forEach(p=>{a.setEdge(p.source,p.target)}),d.dagre.layout(a),{nodes:e.map(p=>{const g=a.node(p.id);return{...p,position:{x:g.x-b/2,y:g.y-I/2}}}),edges:s}}function k({grainGroups:e,metricFormulas:s,selectedNode:a,onNodeSelect:i}){const{nodes:p,edges:g}=f.useMemo(()=>{if(!(e!=null&&e.length)||!(s!=null&&s.length))return{nodes:[],edges:[]};const l=[],m=[],E=new Map,j=new Map,A=new Map;let H=0;const v=()=>`node-${H++}`;e.forEach((t,r)=>{var o;(o=t.components)==null||o.forEach(c=>{A.set(c.name,r)})}),e.forEach((t,r)=>{var h;const o=v();E.set(r,o);const c=((h=t.parent_name)==null?void 0:h.split(".").pop())||`preagg_${r}`;l.push({id:o,type:"preagg",position:{x:0,y:0},data:{name:c,fullName:t.parent_name,grain:t.grain||[],components:t.components||[],grainGroupIndex:r},selected:(a==null?void 0:a.type)==="preagg"&&(a==null?void 0:a.index)===r})}),e.forEach((t,r)=>{var o;(o=t.components)==null||o.forEach(c=>{if(!j.has(c.name)){const h=v();j.set(c.name,h);const x=c.name.length>40?"..."+c.name.split("_").slice(-2).join("_"):c.name;l.push({id:h,type:"component",position:{x:0,y:0},data:{name:c.name,shortName:x,aggregation:c.aggregation,merge:c.merge,grainGroupIndex:r},selected:(a==null?void 0:a.type)==="component"&&(a==null?void 0:a.name)===c.name})}})});const w=new Map;return s.forEach((t,r)=>{const o=v();w.set(t.name,o),l.push({id:o,type:"metric",position:{x:0,y:0},data:{name:t.name,shortName:t.short_name,combiner:t.combiner,isDerived:t.is_derived,components:t.components,metricIndex:r},selected:(a==null?void 0:a.type)==="metric"&&(a==null?void 0:a.index)===r})}),e.forEach((t,r)=>{var c;const o=E.get(r);(c=t.components)==null||c.forEach(h=>{const x=j.get(h.name);o&&x&&m.push({id:`edge-preagg-${o}-${x}`,source:o,target:x,style:{stroke:"#64748b",strokeWidth:2},markerEnd:{type:d.MarkerType.ArrowClosed,color:"#64748b",width:16,height:16}})})}),s.forEach(t=>{var o;const r=w.get(t.name);(o=t.components)==null||o.forEach(c=>{const h=j.get(c);h&&r&&m.push({id:`edge-comp-${h}-${r}`,source:h,target:r,style:{stroke:"#64748b",strokeWidth:2},markerEnd:{type:d.MarkerType.ArrowClosed,color:"#64748b",width:16,height:16}})})}),W(l,m)},[e,s,a]),[$,y,C]=d.useNodesState(p),[M,u,P]=d.useEdgesState(g);f.useEffect(()=>{y(p),u(g)},[p,g,y,u]);const D=f.useCallback((l,m)=>{m.type==="preagg"?i==null||i({type:"preagg",index:m.data.grainGroupIndex,data:e[m.data.grainGroupIndex]}):m.type==="component"?i==null||i({type:"component",name:m.data.name,data:m.data}):m.type==="metric"&&(i==null||i({type:"metric",index:m.data.metricIndex,data:s[m.data.metricIndex]}))},[i,e,s]),_=f.useCallback(()=>{i==null||i(null)},[i]);return!(e!=null&&e.length)||!(s!=null&&s.length)?n.jsxs("div",{className:"graph-empty-state",children:[n.jsx("div",{className:"empty-icon",children:"◎"}),n.jsx("p",{children:"Select metrics and dimensions above to visualize the data flow"})]}):n.jsxs("div",{className:"compact-flow-container",children:[n.jsxs(d.ReactFlow,{nodes:$,edges:M,onNodesChange:C,onEdgesChange:P,nodeTypes:O,onNodeClick:D,onPaneClick:_,fitView:!0,fitViewOptions:{padding:.2},minZoom:.5,maxZoom:1.5,attributionPosition:"bottom-left",proOptions:{hideAttribution:!0},children:[n.jsx(d.Background$1,{color:"#cbd5e1",gap:20,size:1}),n.jsx(d.Controls$1,{showInteractive:!1})]}),n.jsxs("div",{className:"graph-legend",children:[n.jsxs("div",{className:"legend-item",children:[n.jsx("span",{className:"legend-dot preagg"}),n.jsx("span",{children:"Pre-agg"})]}),n.jsxs("div",{className:"legend-item",children:[n.jsx("span",{className:"legend-dot component"}),n.jsx("span",{children:"Component"})]}),n.jsxs("div",{className:"legend-item",children:[n.jsx("span",{className:"legend-dot metric"}),n.jsx("span",{children:"Metric"})]}),n.jsxs("div",{className:"legend-item",children:[n.jsx("span",{className:"legend-dot derived"}),n.jsx("span",{children:"Derived"})]})]})]})}exports.MetricFlowGraph=k;exports.default=k;
//# sourceMappingURL=MetricFlowGraph-B4VECq74.cjs.map