@omniviewdev/ui 0.1.10 → 0.2.0

package/dist/buttons.js

@@ -23,19 +23,19 @@ import F from "@mui/icons-material/Search";
 import { LuCaseSensitive as _, LuRegex as q, LuChevronUp as H, LuChevronDown as J } from "react-icons/lu";
 function P({
   onConfirm: n,
-  confirmMessage: e = "Are you sure?",
+  confirmMessage: r = "Are you sure?",
   children: c,
-  ...t
+  ...e
 }) {
-  const [i, a] = k(!1), l = B(null);
+  const [s, i] = k(!1), a = B(null);
   return /* @__PURE__ */ f(z, { children: [
-    /* @__PURE__ */ o(g, { component: "span", ref: l, sx: { display: "inline-flex" }, children: /* @__PURE__ */ o(b, { ...t, onClick: () => a(!0), children: c }) }),
+    /* @__PURE__ */ o(g, { component: "span", ref: a, sx: { display: "inline-flex" }, children: /* @__PURE__ */ o(b, { ...e, onClick: () => i(!0), children: c }) }),
     /* @__PURE__ */ f(
       G,
       {
-        open: i,
-        anchorEl: l.current,
-        onClose: () => a(!1),
+        open: s,
+        anchorEl: a.current,
+        onClose: () => i(!1),
         anchorOrigin: { vertical: "bottom", horizontal: "center" },
         transformOrigin: { vertical: "top", horizontal: "center" },
         slotProps: {
@@ -55,7 +55,7 @@ function P({
             {
               variant: "body2",
               sx: { color: "var(--ov-fg-default)", mb: 1.5 },
-              children: e
+              children: r
             }
           ),
           /* @__PURE__ */ f(g, { sx: { display: "flex", gap: 1, justifyContent: "flex-end" }, children: [
@@ -65,7 +65,7 @@ function P({
                 size: "xs",
                 emphasis: "ghost",
                 color: "neutral",
-                onClick: () => a(!1),
+                onClick: () => i(!1),
                 children: "Cancel"
               }
             ),
@@ -76,7 +76,7 @@ function P({
                 emphasis: "solid",
                 color: "danger",
                 onClick: () => {
-                  a(!1), n();
+                  i(!1), n();
                 },
                 children: "Confirm"
               }
@@ -90,27 +90,28 @@ function P({
 P.displayName = "ConfirmButton";
 function Q({
   items: n,
-  trigger: e,
-  size: c = "sm"
+  trigger: r,
+  size: c = "sm",
+  label: e = "Actions"
 }) {
-  const [t, i] = k(!1), a = B(null), l = () => i(!1);
+  const [s, i] = k(!1), a = B(null), p = () => i(!1);
   return /* @__PURE__ */ f(z, { children: [
-    /* @__PURE__ */ o("span", { ref: a, children: e ? /* @__PURE__ */ o("span", { onClick: () => i(!0), style: { cursor: "pointer" }, children: e }) : /* @__PURE__ */ o(
+    /* @__PURE__ */ o("span", { ref: a, children: r ? /* @__PURE__ */ o("span", { onClick: () => i(!0), style: { cursor: "pointer" }, children: r }) : /* @__PURE__ */ o(
       I,
       {
         size: c,
         color: "neutral",
         onClick: () => i(!0),
-        "aria-label": "Actions",
+        "aria-label": e,
         children: /* @__PURE__ */ o(E, { fontSize: "inherit" })
       }
     ) }),
     /* @__PURE__ */ o(
       R,
       {
-        open: t,
+        open: s,
         anchorEl: a.current,
-        onClose: l,
+        onClose: p,
         anchorOrigin: { vertical: "bottom", horizontal: "right" },
         transformOrigin: { vertical: "top", horizontal: "right" },
         slotProps: {
@@ -122,26 +123,26 @@ function Q({
             }
           }
         },
-        children: n.map((r) => [
+        children: n.map((t) => [
           /* @__PURE__ */ f(
             w,
             {
-              disabled: r.disabled,
+              disabled: t.disabled,
               onClick: () => {
-                l(), r.onClick();
+                p(), t.onClick();
               },
               sx: {
                 fontSize: "var(--ov-text-sm)",
-                color: r.color === "danger" || r.color === "error" ? "var(--ov-danger-default)" : "var(--ov-fg-default)"
+                color: t.color === "danger" || t.color === "error" ? "var(--ov-danger-default)" : "var(--ov-fg-default)"
               },
               children: [
-                r.icon && /* @__PURE__ */ o(L, { sx: { color: "inherit", minWidth: 28 }, children: r.icon }),
-                /* @__PURE__ */ o(N, { children: r.label })
+                t.icon && /* @__PURE__ */ o(L, { sx: { color: "inherit", minWidth: 28 }, children: t.icon }),
+                /* @__PURE__ */ o(N, { children: t.label })
               ]
             },
-            r.key
+            t.key
           ),
-          r.dividerAfter && /* @__PURE__ */ o(O, {}, `${r.key}-divider`)
+          t.dividerAfter && /* @__PURE__ */ o(O, {}, `${t.key}-divider`)
         ])
       }
     )
@@ -150,25 +151,25 @@ function Q({
 Q.displayName = "ActionMenu";
 function X({
   children: n,
-  emphasis: e = "outline",
+  emphasis: r = "outline",
   size: c = "sm",
-  color: t = "neutral",
-  fullWidth: i,
-  orientation: a = "horizontal",
-  disabled: l,
-  sx: r
+  color: e = "neutral",
+  fullWidth: s,
+  orientation: i = "horizontal",
+  disabled: a,
+  sx: p
 }) {
-  const u = D(t), p = K(e), s = C(c);
+  const t = D(e), u = K(r), l = C(c);
   return /* @__PURE__ */ o(
     $,
     {
-      color: u,
-      variant: p,
-      size: s,
-      fullWidth: i,
-      orientation: a,
-      disabled: l,
-      sx: r,
+      color: t,
+      variant: u,
+      size: l,
+      fullWidth: s,
+      orientation: i,
+      disabled: a,
+      sx: p,
       children: n
     }
   );
@@ -180,18 +181,18 @@ const Y = {
 };
 function Z({
   children: n,
-  variant: e = "default",
+  variant: r = "default",
   dividers: c = !1,
-  sx: t
+  sx: e
 }) {
-  const i = Y[e];
+  const s = Y[r];
   return /* @__PURE__ */ o(
     g,
     {
       sx: {
         display: "flex",
         alignItems: "center",
-        height: i,
+        height: s,
         gap: c ? 0 : 0.5,
         px: 0.5,
         bgcolor: "var(--ov-bg-surface)",
@@ -207,14 +208,14 @@ function Z({
             flexShrink: 0
           }
         },
-        ...typeof t == "object" && !Array.isArray(t) ? t : {}
+        ...typeof e == "object" && !Array.isArray(e) ? e : {}
       },
       children: n
     }
   );
 }
 Z.displayName = "Toolbar";
-function oo({ children: n, sx: e }) {
+function oo({ children: n, sx: r }) {
   return /* @__PURE__ */ o(
     g,
     {
@@ -222,7 +223,7 @@ function oo({ children: n, sx: e }) {
         display: "flex",
         alignItems: "center",
         gap: "2px",
-        ...typeof e == "object" && !Array.isArray(e) ? e : {}
+        ...typeof r == "object" && !Array.isArray(r) ? r : {}
       },
       children: n
     }
@@ -231,66 +232,66 @@ function oo({ children: n, sx: e }) {
 oo.displayName = "ToolbarGroup";
 function ro({
   selected: n,
-  onChange: e,
+  onChange: r,
   icon: c,
-  label: t,
-  size: i = "sm",
-  color: a = "primary",
-  disabled: l,
-  sx: r
+  label: e,
+  size: s = "sm",
+  color: i = "primary",
+  disabled: a,
+  sx: p
 }) {
-  const u = C(i), p = S(a), s = /* @__PURE__ */ o(
+  const t = C(s), u = S(i), l = /* @__PURE__ */ o(
     v,
     {
-      size: u,
-      disabled: l,
-      onClick: () => e(!n),
+      size: t,
+      disabled: a,
+      onClick: () => r(!n),
       sx: {
         borderRadius: "4px",
-        color: n ? p : "var(--ov-fg-muted)",
+        color: n ? u : "var(--ov-fg-muted)",
         bgcolor: n ? "var(--ov-state-hover)" : "transparent",
         "&:hover": {
           bgcolor: "var(--ov-state-hover)"
         },
-        ...typeof r == "object" && !Array.isArray(r) ? r : {}
+        ...typeof p == "object" && !Array.isArray(p) ? p : {}
       },
       children: c
     }
   );
-  return t ? /* @__PURE__ */ o(y, { title: t, children: s }) : s;
+  return e ? /* @__PURE__ */ o(y, { title: e, children: l }) : l;
 }
 ro.displayName = "ToggleButton";
 function eo({
   value: n,
-  onChange: e,
+  onChange: r,
   options: c,
-  exclusive: t = !0,
-  size: i = "sm",
-  color: a = "primary",
-  sx: l
+  exclusive: e = !0,
+  size: s = "sm",
+  color: i = "primary",
+  sx: a
 }) {
-  const r = C(i), u = S(a);
+  const p = C(s), t = S(i);
   return /* @__PURE__ */ o(
     U,
     {
       value: n,
-      exclusive: t,
-      onChange: (s, d) => {
-        d !== null && e(d);
+      exclusive: e,
+      onChange: (l, d) => {
+        d !== null && r(d);
       },
-      size: r,
+      size: p,
       sx: {
         "& .Mui-selected": {
-          color: `${u} !important`,
+          color: `${t} !important`,
           bgcolor: "var(--ov-state-hover) !important"
         },
-        ...typeof l == "object" && !Array.isArray(l) ? l : {}
+        ...typeof a == "object" && !Array.isArray(a) ? a : {}
       },
-      children: c.map((s) => /* @__PURE__ */ f(
+      children: c.map((l) => /* @__PURE__ */ f(
         W,
         {
-          value: s.key,
-          disabled: s.disabled,
+          value: l.key,
+          disabled: l.disabled,
           sx: {
             fontSize: "var(--ov-text-sm)",
             textTransform: "none",
@@ -298,11 +299,11 @@ function eo({
             gap: 0.5
           },
           children: [
-            s.icon,
-            s.label
+            l.icon,
+            l.label
           ]
         },
-        s.key
+        l.key
       ))
     }
   );
@@ -317,22 +318,22 @@ const to = {
 };
 function no({
   value: n,
-  onChange: e,
+  onChange: r,
   placeholder: c = "Search...",
-  regex: t,
-  caseSensitive: i,
-  onRegexChange: a,
-  onCaseSensitiveChange: l,
-  matchCount: r,
-  currentMatch: u,
-  onNext: p,
-  onPrev: s,
+  regex: e,
+  caseSensitive: s,
+  onRegexChange: i,
+  onCaseSensitiveChange: a,
+  matchCount: p,
+  currentMatch: t,
+  onNext: u,
+  onPrev: l,
   size: d = "sm",
   sx: x
 }) {
   const A = to[d], h = d === "xs" ? 12 : 14, T = j((m) => {
-    m.key === "Enter" && (m.shiftKey ? s?.() : p?.()), m.key === "Escape" && m.target.blur();
-  }, [p, s]);
+    m.key === "Enter" && (m.shiftKey ? l?.() : u?.()), m.key === "Escape" && m.target.blur();
+  }, [u, l]);
   return /* @__PURE__ */ f(
     g,
     {
@@ -356,7 +357,7 @@ function no({
           V,
           {
             value: n,
-            onChange: (m) => e(m.target.value),
+            onChange: (m) => r(m.target.value),
             onKeyDown: T,
             placeholder: c,
             sx: {
@@ -368,35 +369,35 @@ function no({
             }
           }
         ),
-        l && /* @__PURE__ */ o(y, { title: "Match Case", children: /* @__PURE__ */ o(
+        a && /* @__PURE__ */ o(y, { title: "Match Case", children: /* @__PURE__ */ o(
           v,
           {
             size: "small",
-            onClick: () => l(!i),
+            onClick: () => a(!s),
             sx: {
               borderRadius: "3px",
               p: "2px",
-              color: i ? "var(--ov-accent-fg)" : "var(--ov-fg-faint)",
-              bgcolor: i ? "var(--ov-accent-subtle)" : "transparent"
+              color: s ? "var(--ov-accent-fg)" : "var(--ov-fg-faint)",
+              bgcolor: s ? "var(--ov-accent-subtle)" : "transparent"
             },
             children: /* @__PURE__ */ o(_, { size: h })
           }
         ) }),
-        a && /* @__PURE__ */ o(y, { title: "Use Regular Expression", children: /* @__PURE__ */ o(
+        i && /* @__PURE__ */ o(y, { title: "Use Regular Expression", children: /* @__PURE__ */ o(
           v,
           {
             size: "small",
-            onClick: () => a(!t),
+            onClick: () => i(!e),
             sx: {
               borderRadius: "3px",
               p: "2px",
-              color: t ? "var(--ov-accent-fg)" : "var(--ov-fg-faint)",
-              bgcolor: t ? "var(--ov-accent-subtle)" : "transparent"
+              color: e ? "var(--ov-accent-fg)" : "var(--ov-fg-faint)",
+              bgcolor: e ? "var(--ov-accent-subtle)" : "transparent"
             },
             children: /* @__PURE__ */ o(q, { size: h })
           }
         ) }),
-        r !== void 0 && /* @__PURE__ */ o(
+        p !== void 0 && /* @__PURE__ */ o(
           M,
           {
             sx: {
@@ -405,11 +406,11 @@ function no({
               whiteSpace: "nowrap",
               px: 0.5
             },
-            children: r === 0 ? "No results" : `${(u ?? 0) + 1}/${r}`
+            children: p === 0 ? "No results" : `${(t ?? 0) + 1}/${p}`
           }
         ),
-        s && /* @__PURE__ */ o(v, { size: "small", onClick: s, sx: { p: "2px" }, children: /* @__PURE__ */ o(H, { size: h }) }),
-        p && /* @__PURE__ */ o(v, { size: "small", onClick: p, sx: { p: "2px" }, children: /* @__PURE__ */ o(J, { size: h }) })
+        l && /* @__PURE__ */ o(v, { size: "small", onClick: l, sx: { p: "2px" }, children: /* @__PURE__ */ o(H, { size: h }) }),
+        u && /* @__PURE__ */ o(v, { size: "small", onClick: u, sx: { p: "2px" }, children: /* @__PURE__ */ o(J, { size: h }) })
       ]
     }
   );

package/dist/charts.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react"),De=require("@mui/material/styles"),o=require("react/jsx-runtime"),Le=require("react-dom"),j=require("@mui/material/Box"),Te=require("@mui/material/Popper"),xe=require("@mui/x-charts/LineChart"),ie=require("@mui/x-charts/ChartsReferenceLine"),Z=require("@mui/x-charts/hooks"),se=require("react-icons/lu"),le=require("./Skeleton-CfdQWLQM.cjs"),fe=require("./ErrorState-Cwwem5yh.cjs"),Fe=require("@mui/x-charts/BarChart"),Pe=require("@mui/x-charts/PieChart"),qe=require("@mui/x-charts/ScatterChart"),Ee=require("@mui/x-charts/SparkLineChart"),ce=require("@mui/material/Typography"),Be=require("@mui/x-charts/Gauge"),me=require("@mui/material/IconButton"),Ne=require("@mui/material/MenuItem"),He=require("@mui/material/Menu"),Ge=require("./Select-CnRBSc5w.cjs"),ge={primary:"--ov-accent",secondary:"--ov-fg-muted",success:"--ov-success-default",warning:"--ov-warning-default",error:"--ov-danger-default",info:"--ov-info-default",neutral:"--ov-fg-default",accent:"--ov-accent",danger:"--ov-danger-default",muted:"--ov-fg-muted"},Ie=new Set(Object.keys(ge)),ue=new Map;function $(e){const t=ue.get(e);if(t!==void 0)return t;let a;if(Ie.has(e)){const r=ge[e];typeof document<"u"?a=getComputedStyle(document.documentElement).getPropertyValue(r).trim()||`var(${r})`:a=`var(${r})`}else a=e;return ue.set(e,a),a}function We(){ue.clear()}const Ve=["primary","success","warning","info","error","secondary","accent","neutral"];function N(e){return(e&&e.length>0?e:Ve).map($)}const w=new Intl.NumberFormat(void 0,{maximumFractionDigits:1}),Oe=new Intl.DateTimeFormat(void 0,{hour:"2-digit",minute:"2-digit"});function pe(e,t){const a=Math.abs(e);return a<1024?`${e} ${t??"B"}`:a<1024**2?`${w.format(e/1024)} ${t??"KiB"}`:a<1024**3?`${w.format(e/1024**2)} ${t??"MiB"}`:a<1024**4?`${w.format(e/1024**3)} ${t??"GiB"}`:`${w.format(e/1024**4)} ${t??"TiB"}`}function ve(e,t){return`${w.format(e)}${t??"%"}`}function ye(e,t){const a=Math.abs(e);return t?`${w.format(e)} ${t}`:a<1e3?`${w.format(e)} ms`:a<6e4?`${w.format(e/1e3)} s`:a<36e5?`${w.format(e/6e4)} m`:`${w.format(e/36e5)} h`}const Y=["","k","M","G","T","P"];function be(e,t){const a=Math.abs(e);let r=0,n=a;for(;n>=1e3&&r<Y.length-1;)n/=1e3,r++;return`${e<0?"-":""}${w.format(n)} ${Y[r]}${t??"/s"}`}function Ce(e,t){const a=Math.abs(e);let r=0,n=a;for(;n>=1e3&&r<Y.length-1;)n/=1e3,r++;const i=e<0?"-":"",s=t?` ${t}`:Y[r]?` ${Y[r]}`:"";return`${i}${w.format(n)}${s}`}function Se(e,t){const a=new Intl.NumberFormat(void 0).format(e);return t?`${a} ${t}`:a}function Re(e){return Oe.format(e)}function B(e,t){const a=(()=>{switch(e){case"bytes":return r=>pe(r,t);case"percent":return r=>ve(r,t);case"duration":return r=>ye(r,t);case"rate":return r=>be(r,t);case"si":return r=>Ce(r,t);case"number":return r=>Se(r,t)}})();return r=>r==null?"–":a(r)}const de=new Map;function R(e,t){if(typeof document>"u")return t;const a=de.get(e);if(a!==void 0)return a;const n=getComputedStyle(document.documentElement).getPropertyValue(e).trim()||t;return de.set(e,n),n}function K(){const e=De.useTheme(),t=e.palette.mode==="dark";return l.useEffect(()=>{de.clear(),We()},[t]),l.useMemo(()=>({axisLineColor:R("--ov-border-default",t?"#3a3a3a":"#d4d4d4"),gridColor:R("--ov-border-subtle",t?"#2a2a2a":"#e8e8e8"),tooltipBg:R("--ov-bg-surface",t?"#1e1e1e":"#ffffff"),tooltipFg:R("--ov-fg-default",t?"#e0e0e0":"#1a1a1a"),fontFamily:R("--ov-font-sans",e.typography.fontFamily??"sans-serif"),fontSize:11,areaOpacity:.15}),[t,e.typography.fontFamily])}function X({loading:e,error:t,onRetry:a,empty:r,width:n,height:i,children:s}){return e?o.jsx(j,{sx:{width:n??"100%",height:i},children:o.jsx(le.Skeleton,{variant:"rectangular",width:"100%",height:i})}):t?o.jsx(j,{sx:{width:n??"100%",height:i,display:"flex",alignItems:"center",justifyContent:"center"},children:o.jsx(fe.ErrorState,{message:t,onRetry:a,variant:"panel"})}):r?o.jsx(j,{sx:{width:n??"100%",height:i,display:"flex",alignItems:"center",justifyContent:"center"},children:o.jsx(fe.EmptyState,{icon:o.jsx(se.LuChartBar,{size:32}),title:"No data",description:"There is no data to display.",size:"sm"})}):o.jsx(o.Fragment,{children:s})}const Ye={xs:120,sm:180,md:260,lg:360,xl:480};function Ke({markers:e}){const t=Z.useXScale(),{top:a}=Z.useDrawingArea(),[r,n]=l.useState(null),i=l.useCallback((c,m)=>{const v=m.currentTarget.getBoundingClientRect();n({index:c,anchor:{getBoundingClientRect:()=>v}})},[]),s=l.useCallback(()=>n(null),[]),d=r!=null?e[r.index]:null;return o.jsxs("g",{children:[e.map((c,m)=>{const v=c.timestamp instanceof Date?c.timestamp:new Date(c.timestamp),x=t(v);if(x==null||isNaN(x))return null;const y=$(c.color??"muted"),f=!!c.tooltip;return o.jsxs("g",{style:f?{cursor:"pointer"}:void 0,onPointerEnter:f?h=>i(m,h):void 0,onPointerLeave:f?s:void 0,children:[f&&o.jsx("rect",{x:x-16,y:a-(c.label?20:12),width:32,height:c.label?20:12,fill:"transparent"}),o.jsx("text",{x,y:a-1,textAnchor:"middle",fill:y,fontSize:8,children:"▼"}),c.label&&o.jsx("text",{x,y:a-9,textAnchor:"middle",fill:y,fontSize:9,fontWeight:500,children:c.label})]},`evt-${m}`)}),r&&d?.tooltip&&Le.createPortal(o.jsx(Te,{open:!0,anchorEl:r.anchor,placement:"top",modifiers:[{name:"offset",options:{offset:[0,6]}}],sx:{zIndex:1500,pointerEvents:"none"},children:o.jsx(j,{sx:{bgcolor:"var(--ov-bg-elevated, #1e1e2e)",color:"var(--ov-fg-default, #cdd6f4)",border:"1px solid var(--ov-border-subtle, #45475a)",borderRadius:"6px",px:1.25,py:.75,fontSize:"0.75rem",lineHeight:1.4,maxWidth:260,boxShadow:"0 4px 12px rgba(0,0,0,0.4)"},children:d.tooltip})}),document.body)]})}function Xe({formatter:e,color:t,position:a="right"}){const r=Z.useYScale(),{left:n,top:i,width:s,height:d}=Z.useDrawingArea(),c=r.ticks?.()??[],m=a==="right",v=m?n+s-4:n+4,x=m?"end":"start";return o.jsx("g",{children:c.map(y=>{const f=r(y);if(f==null||isNaN(f)||f<i-2||f>i+d+2)return null;const h=e(y);return o.jsx("text",{x:v,y:f-4,textAnchor:x,fill:t,fontSize:10,opacity:.7,children:h},y)})})}function he({series:e,timeRange:t,yAxisLabel:a,valueFormat:r="number",unit:n,valueFormatter:i,annotations:s,area:d=!1,grid:c=!0,showLegend:m=!1,showMarks:v=!1,colors:x,yAxisPosition:y="left",xAxisPosition:f="bottom",compact:h=!1,margin:g,yAxisWidth:p,xAxisHeight:A,yAxisInline:k=!1,yAxisInlinePosition:D="right",eventMarkers:b,size:F="md",height:S,loading:C,error:q,onRetry:H,skipAnimation:_=!1,sx:ee}){const L=K(),J=S??Ye[F],G=l.useMemo(()=>N(x),[x]),P=l.useMemo(()=>i??B(r,n),[i,r,n]),I=e.length===0||e.every(u=>u.data.length===0),{xData:te,alignedValues:W}=l.useMemo(()=>{if(e.length===0||e.every(z=>z.data.length===0))return{xData:[],alignedValues:e.map(()=>[])};const u=new Set;for(const z of e)for(const E of z.data)u.add(E.timestamp);const T=Array.from(u).sort((z,E)=>z-E),M=T.map(z=>new Date(z)),ne=e.map(z=>{const E=new Map;for(const U of z.data)E.set(U.timestamp,U.value);return T.map(U=>E.get(U)??null)});return{xData:M,alignedValues:ne}},[e]),V=l.useMemo(()=>e.map((u,T)=>({id:u.id,label:u.label,data:W[T]??[],color:u.color?$(u.color):G[T%G.length],area:u.area??d,showMark:v,valueFormatter:P,...u.lineStyle==="dashed"?{strokeDasharray:"6 3"}:{},...u.lineStyle==="dotted"?{strokeDasharray:"2 2"}:{}})),[e,W,d,v,P,G]),Q=h?{top:4,right:2,bottom:2,left:2}:{top:8,right:8,bottom:8,left:8},re=b?.length?b.some(u=>u.label)?20:10:0,oe={...Q,...g,top:(g?.top??Q.top)+re},O=k?0:p??(h?30:40),ae=A??(h?20:24);return o.jsx(j,{sx:ee,children:o.jsx(X,{loading:C,error:q,onRetry:H,empty:I,height:J,children:o.jsxs(xe.LineChart,{height:J,series:V,xAxis:[{data:te,scaleType:"time",height:ae,position:f,...t&&{min:t.from,max:t.to}}],yAxis:[{label:a,valueFormatter:P,position:y,width:O}],grid:c?{horizontal:!0}:void 0,skipAnimation:_,hideLegend:!m,margin:oe,sx:{"& .MuiChartsAxis-line":h?{display:"none"}:{stroke:L.axisLineColor},"& .MuiChartsAxis-tick":h?{display:"none"}:{stroke:L.axisLineColor},"& .MuiChartsAxis-tickLabel":{fill:L.tooltipFg,fontSize:L.fontSize},...k&&{"& .MuiChartsAxis-left, & .MuiChartsAxis-right":{display:"none"}},"& .MuiChartsGrid-line":{stroke:L.gridColor,opacity:.5},"& .MuiAreaElement-root":{opacity:L.areaOpacity}},children:[s?.map((u,T)=>o.jsx(ie.ChartsReferenceLine,{y:u.value,label:u.label,lineStyle:{stroke:u.color?$(u.color):"var(--ov-fg-muted)",strokeDasharray:u.lineStyle==="dashed"?"6 3":void 0},labelStyle:{fill:L.tooltipFg,fontSize:L.fontSize}},`ann-${T}`)),b?.map((u,T)=>o.jsx(ie.ChartsReferenceLine,{x:u.timestamp instanceof Date?u.timestamp:new Date(u.timestamp),lineStyle:{stroke:$(u.color??"muted"),strokeDasharray:u.lineStyle==="solid"?void 0:"4 3",strokeWidth:1}},`evt-line-${T}`)),b?.length&&o.jsx(Ke,{markers:b}),k&&o.jsx(Xe,{formatter:P,color:L.tooltipFg,position:D})]})})})}he.displayName="TimeSeriesChart";const Je={xs:120,sm:180,md:260,lg:360,xl:480};function Me({data:e,horizontal:t=!1,valueFormat:a="number",unit:r,valueFormatter:n,showLabels:i=!1,colors:s,size:d="md",height:c,loading:m,error:v,onRetry:x,skipAnimation:y=!1,sx:f}){const h=K(),g=c??Je[d],p=l.useMemo(()=>N(s),[s]),A=l.useMemo(()=>n??B(a,r),[n,a,r]),k=e.length===0,D=l.useMemo(()=>e.map((S,C)=>S.color?$(S.color):p[C%p.length]),[e,p]),b=l.useMemo(()=>e.map(S=>S.label),[e]),F=l.useMemo(()=>e.map(S=>S.value),[e]);return o.jsx(j,{sx:f,children:o.jsx(X,{loading:m,error:v,onRetry:x,empty:k,height:g,children:o.jsx(Fe.BarChart,{height:g,layout:t?"horizontal":"vertical",series:[{data:F,valueFormatter:A,label:i?"Value":void 0}],xAxis:t?[{valueFormatter:A}]:[{data:b,scaleType:"band"}],yAxis:t?[{data:b,scaleType:"band"}]:[{valueFormatter:A}],colors:D,skipAnimation:y,hideLegend:!0,sx:{"& .MuiChartsAxis-line":{stroke:h.axisLineColor},"& .MuiChartsAxis-tick":{stroke:h.axisLineColor},"& .MuiChartsAxis-tickLabel":{fill:h.tooltipFg,fontSize:h.fontSize}}})})})}Me.displayName="BarChart";const Qe={xs:120,sm:180,md:260,lg:360,xl:480};function je({data:e,innerRadius:t,showLabels:a=!1,colors:r,size:n="md",height:i,loading:s,error:d,onRetry:c,skipAnimation:m=!1,sx:v}){const x=i??Qe[n],y=l.useMemo(()=>N(r),[r]),f=e.length===0,h=l.useMemo(()=>e.map((g,p)=>({id:g.id,value:g.value,label:g.label,color:g.color?$(g.color):y[p%y.length]})),[e,y]);return o.jsx(j,{sx:v,children:o.jsx(X,{loading:s,error:d,onRetry:c,empty:f,height:x,children:o.jsx(Pe.PieChart,{height:x,series:[{data:h,innerRadius:t??0,arcLabel:a?g=>g.label??"":void 0}],skipAnimation:m})})})}je.displayName="PieChart";const Ue={xs:120,sm:180,md:260,lg:360,xl:480};function ke({series:e,xAxisLabel:t,yAxisLabel:a,xFormat:r="number",yFormat:n="number",colors:i,size:s="md",height:d,loading:c,error:m,onRetry:v,skipAnimation:x=!1,sx:y}){const f=K(),h=d??Ue[s],g=l.useMemo(()=>N(i),[i]),p=e.length===0||e.every(b=>b.data.length===0),A=l.useMemo(()=>B(r),[r]),k=l.useMemo(()=>B(n),[n]),D=l.useMemo(()=>e.map((b,F)=>({id:b.id,label:b.label,data:b.data.map((S,C)=>({x:S.x,y:S.y,id:S.id??C})),color:b.color?$(b.color):g[F%g.length]})),[e,g]);return o.jsx(j,{sx:y,children:o.jsx(X,{loading:c,error:m,onRetry:v,empty:p,height:h,children:o.jsx(qe.ScatterChart,{height:h,series:D,xAxis:[{label:t,valueFormatter:A}],yAxis:[{label:a,valueFormatter:k}],skipAnimation:x,sx:{"& .MuiChartsAxis-line":{stroke:f.axisLineColor},"& .MuiChartsAxis-tick":{stroke:f.axisLineColor},"& .MuiChartsAxis-tickLabel":{fill:f.tooltipFg,fontSize:f.fontSize}}})})})}ke.displayName="ScatterChart";const Ze={top:2,bottom:2,left:2,right:2};function Ae({data:e,plotType:t="line",area:a=!1,color:r="primary",height:n=40,width:i="100%",showTooltip:s=!1,skipAnimation:d=!1}){const c=$(r);return o.jsx(Ee.SparkLineChart,{data:e,plotType:t,area:a,height:n,width:typeof i=="number"?i:void 0,color:c,curve:"natural",margin:Ze,showTooltip:s,skipAnimation:d,sx:typeof i=="string"?{width:i}:void 0})}Ae.displayName="Sparkline";const _e={xs:80,sm:100,md:140,lg:180,xl:220};function et(e,t,a,r){const n=(e-t)/(a-t)*100;return n<r[0]?"success":n<r[1]?"warning":"danger"}function $e({value:e,min:t=0,max:a=100,label:r,unit:n,color:i,thresholds:s=[60,85],size:d="md",loading:c=!1}){const m=_e[d],v=l.useMemo(()=>$(i??et(e,t,a,s)),[i,e,t,a,s]);return c?o.jsxs(j,{sx:{p:2,border:"1px solid var(--ov-border-default)",borderRadius:"8px",bgcolor:"var(--ov-bg-surface)",display:"flex",flexDirection:"column",alignItems:"center",gap:1},children:[o.jsx(le.Skeleton,{variant:"circular",width:m,height:m}),o.jsx(le.Skeleton,{variant:"text",width:"60%"})]}):o.jsxs(j,{sx:{p:2,border:"1px solid var(--ov-border-default)",borderRadius:"8px",bgcolor:"var(--ov-bg-surface)",display:"flex",flexDirection:"column",alignItems:"center",gap:.5},children:[o.jsx(Be.Gauge,{value:e,valueMin:t,valueMax:a,startAngle:-110,endAngle:110,width:m,height:m,sx:{"& .MuiGauge-valueArc":{fill:v},"& .MuiGauge-referenceArc":{fill:"var(--ov-bg-surface-inset)"}},text:n?`${e}${n}`:`${e}`}),o.jsx(ce,{variant:"caption",sx:{fontSize:"0.6875rem",fontWeight:600,color:"var(--ov-fg-muted)",textTransform:"uppercase",letterSpacing:"0.04em",textAlign:"center"},children:r})]})}$e.displayName="GaugeCard";const tt=[{label:"15m",duration:900*1e3},{label:"1h",duration:3600*1e3},{label:"6h",duration:360*60*1e3},{label:"24h",duration:1440*60*1e3},{label:"7d",duration:10080*60*1e3}];function rt(e,t){const a=e.to.getTime()-e.from.getTime();let r=t[0],n=Math.abs(a-r.duration);for(const i of t){const s=Math.abs(a-i.duration);s<n&&(r=i,n=s)}return String(r.duration)}function ze({title:e,icon:t,subtitle:a,series:r,timeRange:n,onTimeRangeChange:i,refreshInterval:s=0,onRefresh:d,valueFormat:c="number",unit:m,valueFormatter:v,annotations:x,eventMarkers:y,area:f=!1,presets:h=tt,colors:g,headerActions:p,toolbar:A,menuItems:k,yAxisPosition:D="none",xAxisPosition:b="none",margin:F,yAxisWidth:S,xAxisHeight:C,yAxisInline:q=!0,yAxisInlinePosition:H,variant:_="default",height:ee=260,loading:L,error:J,onRetry:G}){const P=l.useRef(null),[I,te]=l.useState(s>0),[W,V]=l.useState(null),Q=_==="compact",re=l.useMemo(()=>rt(n,h),[n,h]),oe=l.useMemo(()=>h.map(M=>({value:String(M.duration),label:M.label})),[h]),O=l.useCallback(()=>{P.current&&(clearInterval(P.current),P.current=null)},[]);l.useEffect(()=>(O(),I&&s>0&&d&&(P.current=setInterval(d,s)),O),[I,s,d,O]);const ae=M=>{if(!i)return;const ne=Number(Array.isArray(M)?M[0]:M),z=new Date;i({from:new Date(z.getTime()-ne),to:z})},u=i||A||p||d,T=k&&k.length>0;return o.jsxs(j,{sx:{display:"flex",flexDirection:"column",overflow:"hidden",...Q?{bgcolor:"transparent"}:{bgcolor:"var(--ov-bg-surface)",border:"1px solid var(--ov-border-default)",borderRadius:"8px"}},children:[o.jsxs(j,{sx:{display:"flex",alignItems:"center",gap:.75,px:1,py:.5,minHeight:32},children:[t&&o.jsx(j,{sx:{display:"flex",alignItems:"center",color:"var(--ov-fg-muted)",flexShrink:0},children:t}),o.jsxs(j,{sx:{minWidth:0,flex:1},children:[o.jsx(ce,{variant:"subtitle2",noWrap:!0,sx:{fontWeight:600,color:"var(--ov-fg-default)",fontSize:"0.75rem",lineHeight:1.2},children:e}),a&&o.jsx(ce,{variant:"caption",noWrap:!0,sx:{color:"var(--ov-fg-muted)",fontSize:"0.625rem",lineHeight:1.2,display:"block"},children:a})]}),u&&o.jsxs(j,{sx:{display:"flex",alignItems:"center",gap:.25,flexShrink:0},children:[i&&o.jsx(Ge.Select,{options:oe,value:re,onChange:ae,size:"xs"}),A,p,d&&o.jsx(me,{size:"small",onClick:()=>{s>0?te(M=>!M):d()},sx:{color:I?"var(--ov-accent)":"var(--ov-fg-muted)",p:.25},children:o.jsx(se.LuRefreshCw,{size:12})})]}),T&&o.jsxs(o.Fragment,{children:[o.jsx(me,{size:"small",onClick:M=>V(M.currentTarget),sx:{color:"var(--ov-fg-muted)",p:.25,flexShrink:0},children:o.jsx(se.LuEllipsisVertical,{size:13})}),o.jsx(He,{anchorEl:W,open:!!W,onClose:()=>V(null),anchorOrigin:{vertical:"bottom",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"right"},slotProps:{paper:{sx:{bgcolor:"var(--ov-bg-surface)",border:"1px solid var(--ov-border-subtle)",minWidth:140}}},children:k.map(M=>o.jsx(Ne,{onClick:()=>{V(null),M.onClick()},sx:{fontSize:"0.8125rem"},children:M.label},M.label))})]})]}),o.jsx(he,{series:r,timeRange:n,valueFormat:c,unit:m,valueFormatter:v,annotations:x,eventMarkers:y,area:f,colors:g,height:ee,loading:L,error:J,onRetry:G,skipAnimation:!0,yAxisPosition:D,xAxisPosition:b,margin:F,yAxisWidth:S,xAxisHeight:C,yAxisInline:q,yAxisInlinePosition:H,compact:!0,grid:!0})]})}ze.displayName="MetricsPanel";const ot={xs:120,sm:180,md:260,lg:360,xl:480};function we({series:e,capacity:t,timeRange:a,valueFormat:r="number",unit:n,valueFormatter:i,stacked:s=!0,colors:d,yAxisPosition:c="left",size:m="md",height:v,loading:x,error:y,onRetry:f,skipAnimation:h=!1,sx:g}){const p=K(),A=v??ot[m],k=l.useMemo(()=>N(d),[d]),D=l.useMemo(()=>i??B(r,n),[i,r,n]),b=e.length===0||e.every(C=>C.data.length===0),F=l.useMemo(()=>{for(const C of e)if(C.data.length>0)return C.data.map(q=>new Date(q.timestamp));return[]},[e]),S=l.useMemo(()=>e.map((C,q)=>({id:C.id,label:C.label,data:C.data.map(H=>H.value),color:C.color?$(C.color):k[q%k.length],area:!0,showMark:!1,stack:s?"total":void 0,valueFormatter:D})),[e,s,D,k]);return o.jsx(j,{sx:g,children:o.jsx(X,{loading:x,error:y,onRetry:f,empty:b,height:A,children:o.jsx(xe.LineChart,{height:A,series:S,xAxis:[{data:F,scaleType:"time",...a&&{min:a.from,max:a.to}}],yAxis:[{valueFormatter:D,position:c}],grid:{horizontal:!0},skipAnimation:h,hideLegend:!0,sx:{"& .MuiChartsAxis-line":{stroke:p.axisLineColor},"& .MuiChartsAxis-tick":{stroke:p.axisLineColor},"& .MuiChartsAxis-tickLabel":{fill:p.tooltipFg,fontSize:p.fontSize},"& .MuiChartsGrid-line":{stroke:p.gridColor},"& .MuiAreaElement-root":{opacity:p.areaOpacity}},children:t!=null&&o.jsx(ie.ChartsReferenceLine,{y:t,label:"Capacity",lineStyle:{stroke:$("danger"),strokeDasharray:"6 3"},labelStyle:{fill:p.tooltipFg,fontSize:p.fontSize}})})})})}we.displayName="StackedAreaChart";exports.BarChart=Me;exports.GaugeCard=$e;exports.MetricsPanel=ze;exports.PieChart=je;exports.ScatterChart=ke;exports.Sparkline=Ae;exports.StackedAreaChart=we;exports.TimeSeriesChart=he;exports.chartPalette=N;exports.formatBytes=pe;exports.formatDuration=ye;exports.formatNumber=Se;exports.formatPercent=ve;exports.formatRate=be;exports.formatSI=Ce;exports.formatTimeAxisTick=Re;exports.getValueFormatter=B;exports.resolveChartColor=$;exports.useChartTheme=K;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("react"),De=require("@mui/material/styles"),o=require("react/jsx-runtime"),Le=require("react-dom"),j=require("@mui/material/Box"),Te=require("@mui/material/Popper"),xe=require("@mui/x-charts/LineChart"),ie=require("@mui/x-charts/ChartsReferenceLine"),Z=require("@mui/x-charts/hooks"),se=require("react-icons/lu"),le=require("./Skeleton-CfdQWLQM.cjs"),fe=require("./ErrorState-Cwwem5yh.cjs"),Fe=require("@mui/x-charts/BarChart"),Pe=require("@mui/x-charts/PieChart"),qe=require("@mui/x-charts/ScatterChart"),Ee=require("@mui/x-charts/SparkLineChart"),ce=require("@mui/material/Typography"),Be=require("@mui/x-charts/Gauge"),me=require("@mui/material/IconButton"),Ne=require("@mui/material/MenuItem"),He=require("@mui/material/Menu"),Ge=require("./Select-mxLKNk8-.cjs"),ge={primary:"--ov-accent",secondary:"--ov-fg-muted",success:"--ov-success-default",warning:"--ov-warning-default",error:"--ov-danger-default",info:"--ov-info-default",neutral:"--ov-fg-default",accent:"--ov-accent",danger:"--ov-danger-default",muted:"--ov-fg-muted"},Ie=new Set(Object.keys(ge)),ue=new Map;function $(e){const t=ue.get(e);if(t!==void 0)return t;let a;if(Ie.has(e)){const r=ge[e];typeof document<"u"?a=getComputedStyle(document.documentElement).getPropertyValue(r).trim()||`var(${r})`:a=`var(${r})`}else a=e;return ue.set(e,a),a}function We(){ue.clear()}const Ve=["primary","success","warning","info","error","secondary","accent","neutral"];function N(e){return(e&&e.length>0?e:Ve).map($)}const w=new Intl.NumberFormat(void 0,{maximumFractionDigits:1}),Oe=new Intl.DateTimeFormat(void 0,{hour:"2-digit",minute:"2-digit"});function pe(e,t){const a=Math.abs(e);return a<1024?`${e} ${t??"B"}`:a<1024**2?`${w.format(e/1024)} ${t??"KiB"}`:a<1024**3?`${w.format(e/1024**2)} ${t??"MiB"}`:a<1024**4?`${w.format(e/1024**3)} ${t??"GiB"}`:`${w.format(e/1024**4)} ${t??"TiB"}`}function ve(e,t){return`${w.format(e)}${t??"%"}`}function ye(e,t){const a=Math.abs(e);return t?`${w.format(e)} ${t}`:a<1e3?`${w.format(e)} ms`:a<6e4?`${w.format(e/1e3)} s`:a<36e5?`${w.format(e/6e4)} m`:`${w.format(e/36e5)} h`}const Y=["","k","M","G","T","P"];function be(e,t){const a=Math.abs(e);let r=0,n=a;for(;n>=1e3&&r<Y.length-1;)n/=1e3,r++;return`${e<0?"-":""}${w.format(n)} ${Y[r]}${t??"/s"}`}function Ce(e,t){const a=Math.abs(e);let r=0,n=a;for(;n>=1e3&&r<Y.length-1;)n/=1e3,r++;const i=e<0?"-":"",s=t?` ${t}`:Y[r]?` ${Y[r]}`:"";return`${i}${w.format(n)}${s}`}function Se(e,t){const a=new Intl.NumberFormat(void 0).format(e);return t?`${a} ${t}`:a}function Re(e){return Oe.format(e)}function B(e,t){const a=(()=>{switch(e){case"bytes":return r=>pe(r,t);case"percent":return r=>ve(r,t);case"duration":return r=>ye(r,t);case"rate":return r=>be(r,t);case"si":return r=>Ce(r,t);case"number":return r=>Se(r,t)}})();return r=>r==null?"–":a(r)}const de=new Map;function R(e,t){if(typeof document>"u")return t;const a=de.get(e);if(a!==void 0)return a;const n=getComputedStyle(document.documentElement).getPropertyValue(e).trim()||t;return de.set(e,n),n}function K(){const e=De.useTheme(),t=e.palette.mode==="dark";return l.useEffect(()=>{de.clear(),We()},[t]),l.useMemo(()=>({axisLineColor:R("--ov-border-default",t?"#3a3a3a":"#d4d4d4"),gridColor:R("--ov-border-subtle",t?"#2a2a2a":"#e8e8e8"),tooltipBg:R("--ov-bg-surface",t?"#1e1e1e":"#ffffff"),tooltipFg:R("--ov-fg-default",t?"#e0e0e0":"#1a1a1a"),fontFamily:R("--ov-font-sans",e.typography.fontFamily??"sans-serif"),fontSize:11,areaOpacity:.15}),[t,e.typography.fontFamily])}function X({loading:e,error:t,onRetry:a,empty:r,width:n,height:i,children:s}){return e?o.jsx(j,{sx:{width:n??"100%",height:i},children:o.jsx(le.Skeleton,{variant:"rectangular",width:"100%",height:i})}):t?o.jsx(j,{sx:{width:n??"100%",height:i,display:"flex",alignItems:"center",justifyContent:"center"},children:o.jsx(fe.ErrorState,{message:t,onRetry:a,variant:"panel"})}):r?o.jsx(j,{sx:{width:n??"100%",height:i,display:"flex",alignItems:"center",justifyContent:"center"},children:o.jsx(fe.EmptyState,{icon:o.jsx(se.LuChartBar,{size:32}),title:"No data",description:"There is no data to display.",size:"sm"})}):o.jsx(o.Fragment,{children:s})}const Ye={xs:120,sm:180,md:260,lg:360,xl:480};function Ke({markers:e}){const t=Z.useXScale(),{top:a}=Z.useDrawingArea(),[r,n]=l.useState(null),i=l.useCallback((c,m)=>{const v=m.currentTarget.getBoundingClientRect();n({index:c,anchor:{getBoundingClientRect:()=>v}})},[]),s=l.useCallback(()=>n(null),[]),d=r!=null?e[r.index]:null;return o.jsxs("g",{children:[e.map((c,m)=>{const v=c.timestamp instanceof Date?c.timestamp:new Date(c.timestamp),x=t(v);if(x==null||isNaN(x))return null;const y=$(c.color??"muted"),f=!!c.tooltip;return o.jsxs("g",{style:f?{cursor:"pointer"}:void 0,onPointerEnter:f?h=>i(m,h):void 0,onPointerLeave:f?s:void 0,children:[f&&o.jsx("rect",{x:x-16,y:a-(c.label?20:12),width:32,height:c.label?20:12,fill:"transparent"}),o.jsx("text",{x,y:a-1,textAnchor:"middle",fill:y,fontSize:8,children:"▼"}),c.label&&o.jsx("text",{x,y:a-9,textAnchor:"middle",fill:y,fontSize:9,fontWeight:500,children:c.label})]},`evt-${m}`)}),r&&d?.tooltip&&Le.createPortal(o.jsx(Te,{open:!0,anchorEl:r.anchor,placement:"top",modifiers:[{name:"offset",options:{offset:[0,6]}}],sx:{zIndex:1500,pointerEvents:"none"},children:o.jsx(j,{sx:{bgcolor:"var(--ov-bg-elevated, #1e1e2e)",color:"var(--ov-fg-default, #cdd6f4)",border:"1px solid var(--ov-border-subtle, #45475a)",borderRadius:"6px",px:1.25,py:.75,fontSize:"0.75rem",lineHeight:1.4,maxWidth:260,boxShadow:"0 4px 12px rgba(0,0,0,0.4)"},children:d.tooltip})}),document.body)]})}function Xe({formatter:e,color:t,position:a="right"}){const r=Z.useYScale(),{left:n,top:i,width:s,height:d}=Z.useDrawingArea(),c=r.ticks?.()??[],m=a==="right",v=m?n+s-4:n+4,x=m?"end":"start";return o.jsx("g",{children:c.map(y=>{const f=r(y);if(f==null||isNaN(f)||f<i-2||f>i+d+2)return null;const h=e(y);return o.jsx("text",{x:v,y:f-4,textAnchor:x,fill:t,fontSize:10,opacity:.7,children:h},y)})})}function he({series:e,timeRange:t,yAxisLabel:a,valueFormat:r="number",unit:n,valueFormatter:i,annotations:s,area:d=!1,grid:c=!0,showLegend:m=!1,showMarks:v=!1,colors:x,yAxisPosition:y="left",xAxisPosition:f="bottom",compact:h=!1,margin:g,yAxisWidth:p,xAxisHeight:A,yAxisInline:k=!1,yAxisInlinePosition:D="right",eventMarkers:b,size:F="md",height:S,loading:C,error:q,onRetry:H,skipAnimation:_=!1,sx:ee}){const L=K(),J=S??Ye[F],G=l.useMemo(()=>N(x),[x]),P=l.useMemo(()=>i??B(r,n),[i,r,n]),I=e.length===0||e.every(u=>u.data.length===0),{xData:te,alignedValues:W}=l.useMemo(()=>{if(e.length===0||e.every(z=>z.data.length===0))return{xData:[],alignedValues:e.map(()=>[])};const u=new Set;for(const z of e)for(const E of z.data)u.add(E.timestamp);const T=Array.from(u).sort((z,E)=>z-E),M=T.map(z=>new Date(z)),ne=e.map(z=>{const E=new Map;for(const U of z.data)E.set(U.timestamp,U.value);return T.map(U=>E.get(U)??null)});return{xData:M,alignedValues:ne}},[e]),V=l.useMemo(()=>e.map((u,T)=>({id:u.id,label:u.label,data:W[T]??[],color:u.color?$(u.color):G[T%G.length],area:u.area??d,showMark:v,valueFormatter:P,...u.lineStyle==="dashed"?{strokeDasharray:"6 3"}:{},...u.lineStyle==="dotted"?{strokeDasharray:"2 2"}:{}})),[e,W,d,v,P,G]),Q=h?{top:4,right:2,bottom:2,left:2}:{top:8,right:8,bottom:8,left:8},re=b?.length?b.some(u=>u.label)?20:10:0,oe={...Q,...g,top:(g?.top??Q.top)+re},O=k?0:p??(h?30:40),ae=A??(h?20:24);return o.jsx(j,{sx:ee,children:o.jsx(X,{loading:C,error:q,onRetry:H,empty:I,height:J,children:o.jsxs(xe.LineChart,{height:J,series:V,xAxis:[{data:te,scaleType:"time",height:ae,position:f,...t&&{min:t.from,max:t.to}}],yAxis:[{label:a,valueFormatter:P,position:y,width:O}],grid:c?{horizontal:!0}:void 0,skipAnimation:_,hideLegend:!m,margin:oe,sx:{"& .MuiChartsAxis-line":h?{display:"none"}:{stroke:L.axisLineColor},"& .MuiChartsAxis-tick":h?{display:"none"}:{stroke:L.axisLineColor},"& .MuiChartsAxis-tickLabel":{fill:L.tooltipFg,fontSize:L.fontSize},...k&&{"& .MuiChartsAxis-left, & .MuiChartsAxis-right":{display:"none"}},"& .MuiChartsGrid-line":{stroke:L.gridColor,opacity:.5},"& .MuiAreaElement-root":{opacity:L.areaOpacity}},children:[s?.map((u,T)=>o.jsx(ie.ChartsReferenceLine,{y:u.value,label:u.label,lineStyle:{stroke:u.color?$(u.color):"var(--ov-fg-muted)",strokeDasharray:u.lineStyle==="dashed"?"6 3":void 0},labelStyle:{fill:L.tooltipFg,fontSize:L.fontSize}},`ann-${T}`)),b?.map((u,T)=>o.jsx(ie.ChartsReferenceLine,{x:u.timestamp instanceof Date?u.timestamp:new Date(u.timestamp),lineStyle:{stroke:$(u.color??"muted"),strokeDasharray:u.lineStyle==="solid"?void 0:"4 3",strokeWidth:1}},`evt-line-${T}`)),b?.length&&o.jsx(Ke,{markers:b}),k&&o.jsx(Xe,{formatter:P,color:L.tooltipFg,position:D})]})})})}he.displayName="TimeSeriesChart";const Je={xs:120,sm:180,md:260,lg:360,xl:480};function Me({data:e,horizontal:t=!1,valueFormat:a="number",unit:r,valueFormatter:n,showLabels:i=!1,colors:s,size:d="md",height:c,loading:m,error:v,onRetry:x,skipAnimation:y=!1,sx:f}){const h=K(),g=c??Je[d],p=l.useMemo(()=>N(s),[s]),A=l.useMemo(()=>n??B(a,r),[n,a,r]),k=e.length===0,D=l.useMemo(()=>e.map((S,C)=>S.color?$(S.color):p[C%p.length]),[e,p]),b=l.useMemo(()=>e.map(S=>S.label),[e]),F=l.useMemo(()=>e.map(S=>S.value),[e]);return o.jsx(j,{sx:f,children:o.jsx(X,{loading:m,error:v,onRetry:x,empty:k,height:g,children:o.jsx(Fe.BarChart,{height:g,layout:t?"horizontal":"vertical",series:[{data:F,valueFormatter:A,label:i?"Value":void 0}],xAxis:t?[{valueFormatter:A}]:[{data:b,scaleType:"band"}],yAxis:t?[{data:b,scaleType:"band"}]:[{valueFormatter:A}],colors:D,skipAnimation:y,hideLegend:!0,sx:{"& .MuiChartsAxis-line":{stroke:h.axisLineColor},"& .MuiChartsAxis-tick":{stroke:h.axisLineColor},"& .MuiChartsAxis-tickLabel":{fill:h.tooltipFg,fontSize:h.fontSize}}})})})}Me.displayName="BarChart";const Qe={xs:120,sm:180,md:260,lg:360,xl:480};function je({data:e,innerRadius:t,showLabels:a=!1,colors:r,size:n="md",height:i,loading:s,error:d,onRetry:c,skipAnimation:m=!1,sx:v}){const x=i??Qe[n],y=l.useMemo(()=>N(r),[r]),f=e.length===0,h=l.useMemo(()=>e.map((g,p)=>({id:g.id,value:g.value,label:g.label,color:g.color?$(g.color):y[p%y.length]})),[e,y]);return o.jsx(j,{sx:v,children:o.jsx(X,{loading:s,error:d,onRetry:c,empty:f,height:x,children:o.jsx(Pe.PieChart,{height:x,series:[{data:h,innerRadius:t??0,arcLabel:a?g=>g.label??"":void 0}],skipAnimation:m})})})}je.displayName="PieChart";const Ue={xs:120,sm:180,md:260,lg:360,xl:480};function ke({series:e,xAxisLabel:t,yAxisLabel:a,xFormat:r="number",yFormat:n="number",colors:i,size:s="md",height:d,loading:c,error:m,onRetry:v,skipAnimation:x=!1,sx:y}){const f=K(),h=d??Ue[s],g=l.useMemo(()=>N(i),[i]),p=e.length===0||e.every(b=>b.data.length===0),A=l.useMemo(()=>B(r),[r]),k=l.useMemo(()=>B(n),[n]),D=l.useMemo(()=>e.map((b,F)=>({id:b.id,label:b.label,data:b.data.map((S,C)=>({x:S.x,y:S.y,id:S.id??C})),color:b.color?$(b.color):g[F%g.length]})),[e,g]);return o.jsx(j,{sx:y,children:o.jsx(X,{loading:c,error:m,onRetry:v,empty:p,height:h,children:o.jsx(qe.ScatterChart,{height:h,series:D,xAxis:[{label:t,valueFormatter:A}],yAxis:[{label:a,valueFormatter:k}],skipAnimation:x,sx:{"& .MuiChartsAxis-line":{stroke:f.axisLineColor},"& .MuiChartsAxis-tick":{stroke:f.axisLineColor},"& .MuiChartsAxis-tickLabel":{fill:f.tooltipFg,fontSize:f.fontSize}}})})})}ke.displayName="ScatterChart";const Ze={top:2,bottom:2,left:2,right:2};function Ae({data:e,plotType:t="line",area:a=!1,color:r="primary",height:n=40,width:i="100%",showTooltip:s=!1,skipAnimation:d=!1}){const c=$(r);return o.jsx(Ee.SparkLineChart,{data:e,plotType:t,area:a,height:n,width:typeof i=="number"?i:void 0,color:c,curve:"natural",margin:Ze,showTooltip:s,skipAnimation:d,sx:typeof i=="string"?{width:i}:void 0})}Ae.displayName="Sparkline";const _e={xs:80,sm:100,md:140,lg:180,xl:220};function et(e,t,a,r){const n=(e-t)/(a-t)*100;return n<r[0]?"success":n<r[1]?"warning":"danger"}function $e({value:e,min:t=0,max:a=100,label:r,unit:n,color:i,thresholds:s=[60,85],size:d="md",loading:c=!1}){const m=_e[d],v=l.useMemo(()=>$(i??et(e,t,a,s)),[i,e,t,a,s]);return c?o.jsxs(j,{sx:{p:2,border:"1px solid var(--ov-border-default)",borderRadius:"8px",bgcolor:"var(--ov-bg-surface)",display:"flex",flexDirection:"column",alignItems:"center",gap:1},children:[o.jsx(le.Skeleton,{variant:"circular",width:m,height:m}),o.jsx(le.Skeleton,{variant:"text",width:"60%"})]}):o.jsxs(j,{sx:{p:2,border:"1px solid var(--ov-border-default)",borderRadius:"8px",bgcolor:"var(--ov-bg-surface)",display:"flex",flexDirection:"column",alignItems:"center",gap:.5},children:[o.jsx(Be.Gauge,{value:e,valueMin:t,valueMax:a,startAngle:-110,endAngle:110,width:m,height:m,sx:{"& .MuiGauge-valueArc":{fill:v},"& .MuiGauge-referenceArc":{fill:"var(--ov-bg-surface-inset)"}},text:n?`${e}${n}`:`${e}`}),o.jsx(ce,{variant:"caption",sx:{fontSize:"0.6875rem",fontWeight:600,color:"var(--ov-fg-muted)",textTransform:"uppercase",letterSpacing:"0.04em",textAlign:"center"},children:r})]})}$e.displayName="GaugeCard";const tt=[{label:"15m",duration:900*1e3},{label:"1h",duration:3600*1e3},{label:"6h",duration:360*60*1e3},{label:"24h",duration:1440*60*1e3},{label:"7d",duration:10080*60*1e3}];function rt(e,t){const a=e.to.getTime()-e.from.getTime();let r=t[0],n=Math.abs(a-r.duration);for(const i of t){const s=Math.abs(a-i.duration);s<n&&(r=i,n=s)}return String(r.duration)}function ze({title:e,icon:t,subtitle:a,series:r,timeRange:n,onTimeRangeChange:i,refreshInterval:s=0,onRefresh:d,valueFormat:c="number",unit:m,valueFormatter:v,annotations:x,eventMarkers:y,area:f=!1,presets:h=tt,colors:g,headerActions:p,toolbar:A,menuItems:k,yAxisPosition:D="none",xAxisPosition:b="none",margin:F,yAxisWidth:S,xAxisHeight:C,yAxisInline:q=!0,yAxisInlinePosition:H,variant:_="default",height:ee=260,loading:L,error:J,onRetry:G}){const P=l.useRef(null),[I,te]=l.useState(s>0),[W,V]=l.useState(null),Q=_==="compact",re=l.useMemo(()=>rt(n,h),[n,h]),oe=l.useMemo(()=>h.map(M=>({value:String(M.duration),label:M.label})),[h]),O=l.useCallback(()=>{P.current&&(clearInterval(P.current),P.current=null)},[]);l.useEffect(()=>(O(),I&&s>0&&d&&(P.current=setInterval(d,s)),O),[I,s,d,O]);const ae=M=>{if(!i)return;const ne=Number(Array.isArray(M)?M[0]:M),z=new Date;i({from:new Date(z.getTime()-ne),to:z})},u=i||A||p||d,T=k&&k.length>0;return o.jsxs(j,{sx:{display:"flex",flexDirection:"column",overflow:"hidden",...Q?{bgcolor:"transparent"}:{bgcolor:"var(--ov-bg-surface)",border:"1px solid var(--ov-border-default)",borderRadius:"8px"}},children:[o.jsxs(j,{sx:{display:"flex",alignItems:"center",gap:.75,px:1,py:.5,minHeight:32},children:[t&&o.jsx(j,{sx:{display:"flex",alignItems:"center",color:"var(--ov-fg-muted)",flexShrink:0},children:t}),o.jsxs(j,{sx:{minWidth:0,flex:1},children:[o.jsx(ce,{variant:"subtitle2",noWrap:!0,sx:{fontWeight:600,color:"var(--ov-fg-default)",fontSize:"0.75rem",lineHeight:1.2},children:e}),a&&o.jsx(ce,{variant:"caption",noWrap:!0,sx:{color:"var(--ov-fg-muted)",fontSize:"0.625rem",lineHeight:1.2,display:"block"},children:a})]}),u&&o.jsxs(j,{sx:{display:"flex",alignItems:"center",gap:.25,flexShrink:0},children:[i&&o.jsx(Ge.Select,{options:oe,value:re,onChange:ae,size:"xs"}),A,p,d&&o.jsx(me,{size:"small",onClick:()=>{s>0?te(M=>!M):d()},sx:{color:I?"var(--ov-accent)":"var(--ov-fg-muted)",p:.25},children:o.jsx(se.LuRefreshCw,{size:12})})]}),T&&o.jsxs(o.Fragment,{children:[o.jsx(me,{size:"small",onClick:M=>V(M.currentTarget),sx:{color:"var(--ov-fg-muted)",p:.25,flexShrink:0},children:o.jsx(se.LuEllipsisVertical,{size:13})}),o.jsx(He,{anchorEl:W,open:!!W,onClose:()=>V(null),anchorOrigin:{vertical:"bottom",horizontal:"right"},transformOrigin:{vertical:"top",horizontal:"right"},slotProps:{paper:{sx:{bgcolor:"var(--ov-bg-surface)",border:"1px solid var(--ov-border-subtle)",minWidth:140}}},children:k.map(M=>o.jsx(Ne,{onClick:()=>{V(null),M.onClick()},sx:{fontSize:"0.8125rem"},children:M.label},M.label))})]})]}),o.jsx(he,{series:r,timeRange:n,valueFormat:c,unit:m,valueFormatter:v,annotations:x,eventMarkers:y,area:f,colors:g,height:ee,loading:L,error:J,onRetry:G,skipAnimation:!0,yAxisPosition:D,xAxisPosition:b,margin:F,yAxisWidth:S,xAxisHeight:C,yAxisInline:q,yAxisInlinePosition:H,compact:!0,grid:!0})]})}ze.displayName="MetricsPanel";const ot={xs:120,sm:180,md:260,lg:360,xl:480};function we({series:e,capacity:t,timeRange:a,valueFormat:r="number",unit:n,valueFormatter:i,stacked:s=!0,colors:d,yAxisPosition:c="left",size:m="md",height:v,loading:x,error:y,onRetry:f,skipAnimation:h=!1,sx:g}){const p=K(),A=v??ot[m],k=l.useMemo(()=>N(d),[d]),D=l.useMemo(()=>i??B(r,n),[i,r,n]),b=e.length===0||e.every(C=>C.data.length===0),F=l.useMemo(()=>{for(const C of e)if(C.data.length>0)return C.data.map(q=>new Date(q.timestamp));return[]},[e]),S=l.useMemo(()=>e.map((C,q)=>({id:C.id,label:C.label,data:C.data.map(H=>H.value),color:C.color?$(C.color):k[q%k.length],area:!0,showMark:!1,stack:s?"total":void 0,valueFormatter:D})),[e,s,D,k]);return o.jsx(j,{sx:g,children:o.jsx(X,{loading:x,error:y,onRetry:f,empty:b,height:A,children:o.jsx(xe.LineChart,{height:A,series:S,xAxis:[{data:F,scaleType:"time",...a&&{min:a.from,max:a.to}}],yAxis:[{valueFormatter:D,position:c}],grid:{horizontal:!0},skipAnimation:h,hideLegend:!0,sx:{"& .MuiChartsAxis-line":{stroke:p.axisLineColor},"& .MuiChartsAxis-tick":{stroke:p.axisLineColor},"& .MuiChartsAxis-tickLabel":{fill:p.tooltipFg,fontSize:p.fontSize},"& .MuiChartsGrid-line":{stroke:p.gridColor},"& .MuiAreaElement-root":{opacity:p.areaOpacity}},children:t!=null&&o.jsx(ie.ChartsReferenceLine,{y:t,label:"Capacity",lineStyle:{stroke:$("danger"),strokeDasharray:"6 3"},labelStyle:{fill:p.tooltipFg,fontSize:p.fontSize}})})})})}we.displayName="StackedAreaChart";exports.BarChart=Me;exports.GaugeCard=$e;exports.MetricsPanel=ze;exports.PieChart=je;exports.ScatterChart=ke;exports.Sparkline=Ae;exports.StackedAreaChart=we;exports.TimeSeriesChart=he;exports.chartPalette=N;exports.formatBytes=pe;exports.formatDuration=ye;exports.formatNumber=Se;exports.formatPercent=ve;exports.formatRate=be;exports.formatSI=Ce;exports.formatTimeAxisTick=Re;exports.getValueFormatter=B;exports.resolveChartColor=$;exports.useChartTheme=K;

package/dist/charts.js

@@ -19,7 +19,7 @@ import { Gauge as Bt } from "@mui/x-charts/Gauge";
 import mt from "@mui/material/IconButton";
 import Nt from "@mui/material/MenuItem";
 import Ht from "@mui/material/Menu";
-import { S as Wt } from "./Select-DTUF31OP.js";
+import { S as Wt } from "./Select-Dg7Xdulg.js";
 const vt = {
   primary: "--ov-accent",
   secondary: "--ov-fg-muted",

package/dist/editors/CodeEditor.d.ts

@@ -1,3 +1,4 @@
+import { default as React } from 'react';
 import { SxProps, Theme } from '@mui/material/styles';
 export interface CodeEditorProps {
     value: string;
@@ -10,9 +11,11 @@ export interface CodeEditorProps {
     maxHeight?: number | string;
     theme?: string;
     onSave?: (value: string) => void;
+    /** Custom loading indicator shown while the editor initializes. */
+    loading?: React.ReactNode;
     sx?: SxProps<Theme>;
 }
-declare function CodeEditor({ value, onChange, language, readOnly, minimap, lineNumbers, wordWrap, maxHeight, theme, onSave, sx, }: CodeEditorProps): import("react/jsx-runtime").JSX.Element;
+declare function CodeEditor({ value, onChange, language, readOnly, minimap, lineNumbers, wordWrap, maxHeight, theme, onSave, loading, sx, }: CodeEditorProps): import("react/jsx-runtime").JSX.Element;
 declare namespace CodeEditor {
     var displayName: string;
 }

package/dist/editors/DiffViewer.d.ts

@@ -1,13 +1,29 @@
+import { default as React } from 'react';
 import { SxProps, Theme } from '@mui/material/styles';
+import { DiffOnMount } from '@monaco-editor/react';
 export interface DiffViewerProps {
     original: string;
     modified: string;
     language?: string;
     layout?: 'sideBySide' | 'unified';
     readOnly?: boolean;
+    /** Height of the editor area. Defaults to 300. Pass '100%' to fill parent. */
+    height?: string | number;
+    /** Monaco theme name. Defaults to 'omniview-dark'. */
+    theme?: string;
+    /** Enable word wrapping. */
+    wordWrap?: boolean;
+    /** Show line numbers. Defaults to true. */
+    lineNumbers?: boolean;
+    /** Show minimap. Defaults to false. */
+    minimap?: boolean;
+    /** Custom loading indicator shown while the editor initializes. */
+    loading?: React.ReactNode;
+    /** Callback when the diff editor mounts. Exposes the editor instance. */
+    onMount?: DiffOnMount;
     sx?: SxProps<Theme>;
 }
-declare function DiffViewer({ original, modified, language, layout, readOnly, sx, }: DiffViewerProps): import("react/jsx-runtime").JSX.Element;
+declare function DiffViewer({ original, modified, language, layout, readOnly, height, theme, wordWrap, lineNumbers, minimap, loading, onMount, sx, }: DiffViewerProps): import("react/jsx-runtime").JSX.Element;
 declare namespace DiffViewer {
     var displayName: string;
 }

package/dist/editors/index.d.ts

@@ -8,4 +8,4 @@ export { default as CommandPalette } from './CommandPalette';
 export type { CommandPaletteProps, CommandItem } from './CommandPalette';
 export { default as MarkdownPreview } from './MarkdownPreview';
 export type { MarkdownPreviewProps } from './MarkdownPreview';
-export { registerOmniviewThemes, omniviewDark, omniviewLight } from './themes';
+export { registerOmniviewThemes, resolveEditorTheme, omniviewDark, omniviewLight, solarizedDark, solarizedLight, MONACO_THEME_NAMES } from './themes';

package/dist/editors/themes.d.ts

@@ -1,4 +1,17 @@
 import { editor } from 'monaco-editor';
 export declare const omniviewDark: editor.IStandaloneThemeData;
 export declare const omniviewLight: editor.IStandaloneThemeData;
+export declare const solarizedDark: editor.IStandaloneThemeData;
+export declare const solarizedLight: editor.IStandaloneThemeData;
+export declare const MONACO_THEME_NAMES: {
+    readonly omniviewDark: "omniview-dark";
+    readonly omniviewLight: "omniview-light";
+    readonly solarizedDark: "solarized-dark";
+    readonly solarizedLight: "solarized-light";
+};
+/**
+ * Resolve the Monaco editor theme name from app theme variant and color mode.
+ * Use in CodeEditor and DiffViewer to keep theme selection DRY.
+ */
+export declare function resolveEditorTheme(variant: string, colorMode: string, explicit?: string): string;
 export declare function registerOmniviewThemes(monaco: typeof import('monaco-editor')): void;