@nice2dev/ui-monitoring 1.1.9 → 1.2.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 (4) hide show
  1. package/README.md +0 -6
  2. package/dist/index.cjs +1 -1
  3. package/dist/index.mjs +20 -20
  4. package/package.json +2 -2
package/README.md CHANGED
@@ -22,9 +22,3 @@ This package ships unstyled component logic. Import the shared CSS bundle once a
22
22
  ```tsx
23
23
  import '@nice2dev/ui/style.css';
24
24
  ```
25
-
26
- Optional: opt into the legacy shorthand token aliases (`--bg-*`, `--text-*`, `--border-*`, ...) when migrating from a custom design-token system:
27
-
28
- ```tsx
29
- import '@nice2dev/ui/css/legacy-bg-text-aliases.css';
30
- ```
package/dist/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("@nice2dev/ui"),l=require("react"),$={trace:{color:"var(--nice-text-muted, #888)",bg:"var(--nice-overlay-15, #88888822)"},debug:{color:"var(--nice-color-accent, #8b5cf6)",bg:"#8b5cf622"},info:{color:"var(--nice-color-primary, #3b82f6)",bg:"var(--nice-primary-tint-15, #3b82f622)"},warn:{color:"var(--nice-color-warning, #f59e0b)",bg:"var(--nice-warning-tint-15, #f59e0b22)"},error:{color:"var(--nice-color-error, #ef4444)",bg:"var(--nice-danger-tint-15, #ef444422)"},fatal:{color:"var(--nice-color-error, #dc2626)",bg:"#dc262622"}},K={verticalAlign:"text-bottom",marginRight:"var(--nice-space-1, 4px)"},ie=[{label:"Last 5 min",value:"now-5m"},{label:"Last 15 min",value:"now-15m"},{label:"Last 30 min",value:"now-30m"},{label:"Last 1 hour",value:"now-1h"},{label:"Last 3 hours",value:"now-3h"},{label:"Last 6 hours",value:"now-6h"},{label:"Last 12 hours",value:"now-12h"},{label:"Last 24 hours",value:"now-24h"},{label:"Last 7 days",value:"now-7d"}],se=({logs:a,streams:y,totalCount:L,isLoading:g,savedQueries:T,patterns:S=[],onQueryExecute:V,onQuerySave:O,onQueryDelete:P,onStreamToggle:Y,onLogClick:B,onExport:C,onTailStart:q,onTailStop:M,isTailing:b=!1,className:h,style:A,testId:Q,"data-testid":H})=>{const G=H??Q,{t:D}=i.useNiceTranslation(),[I,m]=l.useState(""),[E,W]=l.useState("now-1h"),[U,ee]=l.useState(1e3),[R,X]=l.useState(new Set(["trace","debug","info","warn","error","fatal"])),[k,J]=l.useState(new Set),[Z,_]=l.useState(null),[t,n]=l.useState(!1),[o,f]=l.useState(""),[u,p]=l.useState("logs"),[c,v]=l.useState(""),d=l.useMemo(()=>a.filter(r=>!(!R.has(r.level)||c&&!r.message.toLowerCase().includes(c.toLowerCase()))),[a,R,c]),N=l.useMemo(()=>{const r={trace:0,debug:0,info:0,warn:0,error:0,fatal:0};return a.forEach(s=>r[s.level]++),r},[a]),j=()=>{V({query:I,timeRange:{from:E,to:"now"},limit:U,direction:"backward"})},w=r=>{J(s=>{const x=new Set(s);return x.has(r)?x.delete(r):x.add(r),x})},re=r=>{X(s=>{const x=new Set(s);return x.has(r)?x.delete(r):x.add(r),x})},te=()=>{o.trim()&&(O(o,I),n(!1),f(""))},ne=r=>{if(!c)return r;const s=new RegExp(`(${c})`,"gi");return r.replace(s,'<mark style="background: var(--nice-warning, #f59e0b); color: black; padding: 0 var(--nice-space-0-5, 2px); border-radius: var(--nice-radius-sm, 2px);">$1</mark>')};return e.jsxs("div",{className:`nice-log-explorer ${h||""}`,style:{display:"flex",flexDirection:"column",height:"100%",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #e0e0e0)",...A},"data-testid":G,children:[e.jsxs("div",{style:{padding:"12px 16px",borderBottom:"1px solid var(--nice-border-color, #333)",background:"var(--nice-bg-elevated, #252525)"},children:[e.jsxs("div",{style:{display:"flex",gap:"8px",marginBottom:"12px"},children:[e.jsx("input",{type:"text",value:I,onChange:r=>m(r.target.value),placeholder:'Enter query... e.g., {service="api"} |= "error"',onKeyDown:r=>r.key==="Enter"&&j(),style:{flex:1,padding:"10px 16px",borderRadius:"8px",border:"1px solid var(--nice-border-color, #444)",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #fff)",fontSize:"13px",fontFamily:"monospace"}}),e.jsx("select",{value:E,onChange:r=>W(r.target.value),style:{padding:"10px 12px",borderRadius:"8px",border:"1px solid var(--nice-border-color, #444)",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #fff)",fontSize:"12px"},children:ie.map(r=>e.jsx("option",{value:r.value,children:r.label},r.value))}),e.jsxs("button",{onClick:j,disabled:g,style:{padding:"10px 24px",borderRadius:"8px",border:"none",background:"var(--nice-color-primary, #3b82f6)",color:"var(--nice-text-on-primary, #fff)",cursor:g?"not-allowed":"pointer",fontSize:"13px",fontWeight:500,opacity:g?.7:1},children:[e.jsx(i.NiceIcon,{name:g?"clock":"search",size:14,style:K}),"Search"]}),e.jsx("button",{onClick:()=>n(!0),style:{padding:"10px 12px",borderRadius:"8px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"12px"},children:e.jsx(i.NiceIcon,{name:"save",size:14,title:D("logExplorer.saveQuery","Save query")})}),q&&e.jsxs("button",{onClick:b?M:q,style:{padding:"10px 16px",borderRadius:"8px",border:"none",background:b?"var(--nice-color-success, #22c55e)":"var(--nice-bg-tertiary, #333)",color:b?"var(--nice-text-on-primary, #fff)":"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"12px"},children:[e.jsx(i.NiceIcon,{name:b?"stop":"play",size:14,style:K}),b?"Stop":"Tail"]})]}),e.jsxs("div",{style:{display:"flex",gap:"8px",alignItems:"center"},children:[e.jsx("span",{style:{fontSize:"11px",color:"var(--nice-text-muted, #888)"},children:"Levels:"}),Object.keys($).map(r=>{const s=$[r],x=N[r],z=R.has(r);return e.jsxs("button",{onClick:()=>re(r),style:{display:"flex",alignItems:"center",gap:"4px",padding:"4px 10px",borderRadius:"4px",border:"none",background:z?s.bg:"transparent",color:z?s.color:"var(--nice-text-muted, #666)",cursor:"pointer",fontSize:"11px",opacity:z?1:.5},children:[r.toUpperCase()," (",x,")"]},r)}),e.jsx("div",{style:{flex:1}}),e.jsx("input",{type:"text",value:c,onChange:r=>v(r.target.value),placeholder:"Filter results...",style:{padding:"4px 8px",borderRadius:"4px",border:"1px solid var(--nice-border-color, #444)",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #fff)",fontSize:"11px",width:"150px"}})]})]}),e.jsxs("div",{style:{flex:1,display:"flex",overflow:"hidden"},children:[e.jsxs("div",{style:{width:"220px",borderRight:"1px solid var(--nice-border-color, #333)",display:"flex",flexDirection:"column",overflow:"hidden"},children:[e.jsxs("div",{style:{flex:1,overflow:"auto",padding:"12px"},children:[e.jsx("h4",{style:{margin:"0 0 8px 0",fontSize:"11px",color:"var(--nice-text-muted, #888)",textTransform:"uppercase"},children:"Log Streams"}),y.map(r=>e.jsxs("label",{style:{display:"flex",alignItems:"center",gap:"8px",padding:"6px 0",cursor:"pointer",fontSize:"12px"},children:[e.jsx("input",{type:"checkbox",defaultChecked:!0,onChange:s=>Y(r.id,s.target.checked)}),e.jsx("span",{style:{width:"8px",height:"8px",borderRadius:"50%",background:r.color}}),e.jsx("span",{children:r.name})]},r.id)),y.length===0&&e.jsx("div",{style:{color:"var(--nice-text-muted, #666)",fontSize:"11px"},children:"No streams discovered"})]}),e.jsxs("div",{style:{borderTop:"1px solid var(--nice-border-color, #333)",padding:"12px",maxHeight:"200px",overflow:"auto"},children:[e.jsx("h4",{style:{margin:"0 0 8px 0",fontSize:"11px",color:"var(--nice-text-muted, #888)",textTransform:"uppercase"},children:"Saved Queries"}),T.map(r=>e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",padding:"6px 8px",marginBottom:"4px",background:"var(--nice-bg-elevated, #252525)",borderRadius:"4px",cursor:"pointer",fontSize:"11px"},onClick:()=>m(r.query),children:[e.jsx("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:r.name}),e.jsx("button",{onClick:s=>{s.stopPropagation(),P(r.id)},style:{background:"none",border:"none",color:"var(--nice-text-muted, #666)",cursor:"pointer",fontSize:"10px"},children:e.jsx(i.NiceIcon,{name:"close",size:10,title:D("logExplorer.deleteQuery","Delete saved query")})})]},r.id)),T.length===0&&e.jsx("div",{style:{color:"var(--nice-text-muted, #666)",fontSize:"11px"},children:"No saved queries"})]})]}),e.jsxs("div",{style:{flex:1,display:"flex",flexDirection:"column",overflow:"hidden"},children:[e.jsxs("div",{style:{display:"flex",borderBottom:"1px solid var(--nice-border-color, #333)"},children:[[{id:"logs",icon:"file",label:`Logs (${d.length})`},{id:"patterns",icon:"flask",label:`Patterns (${S.length})`}].map(r=>e.jsxs("button",{onClick:()=>p(r.id),style:{padding:"10px 20px",border:"none",background:u===r.id?"var(--nice-bg-elevated, #1e1e1e)":"transparent",color:u===r.id?"var(--nice-text-primary, #fff)":"var(--nice-text-muted, #888)",cursor:"pointer",fontSize:"12px",borderBottom:u===r.id?"2px solid var(--nice-primary, #3b82f6)":"2px solid transparent"},children:[e.jsx(i.NiceIcon,{name:r.icon,size:12,style:K}),r.label]},r.id)),e.jsx("div",{style:{flex:1}}),e.jsxs("div",{style:{display:"flex",gap:"8px",padding:"8px"},children:[e.jsx("button",{onClick:()=>C("json"),style:{padding:"4px 8px",borderRadius:"4px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"10px"},children:"JSON"}),e.jsx("button",{onClick:()=>C("csv"),style:{padding:"4px 8px",borderRadius:"4px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"10px"},children:"CSV"})]})]}),u==="logs"&&e.jsxs("div",{style:{flex:1,overflow:"auto",fontFamily:"monospace",fontSize:"12px"},children:[d.map(r=>{const s=$[r.level],x=k.has(r.id);return e.jsxs("div",{style:{borderBottom:"1px solid var(--nice-bg-secondary, #252525)"},children:[e.jsxs("div",{onClick:()=>w(r.id),style:{display:"flex",alignItems:"flex-start",gap:"8px",padding:"6px 12px",cursor:"pointer",background:x?"var(--nice-bg-elevated, #252525)":"transparent"},children:[e.jsx("span",{style:{color:"var(--nice-text-muted, #666)",fontSize:"10px",minWidth:"160px"},children:new Date(r.timestamp).toISOString()}),e.jsx("span",{style:{padding:"2px 6px",borderRadius:"4px",background:s.bg,color:s.color,fontSize:"10px",fontWeight:500,minWidth:"50px",textAlign:"center"},children:r.level.toUpperCase()}),r.service&&e.jsxs("span",{style:{color:"var(--nice-color-accent, #8b5cf6)",fontSize:"10px",minWidth:"80px"},children:["[",r.service,"]"]}),e.jsx("span",{style:{flex:1,whiteSpace:"pre-wrap",wordBreak:"break-all"},dangerouslySetInnerHTML:{__html:ne(r.message)}})]}),x&&e.jsxs("div",{style:{padding:"12px 12px 12px 200px",background:"var(--nice-bg-elevated, #252525)",borderTop:"1px solid var(--nice-border-color, #333)"},children:[e.jsxs("div",{style:{display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gap:"12px",marginBottom:"12px"},children:[e.jsxs("div",{children:[e.jsx("div",{style:{fontSize:"10px",color:"var(--nice-text-muted, #888)",marginBottom:"2px"},children:"Source"}),e.jsx("div",{style:{fontSize:"11px"},children:r.source})]}),r.host&&e.jsxs("div",{children:[e.jsx("div",{style:{fontSize:"10px",color:"var(--nice-text-muted, #888)",marginBottom:"2px"},children:"Host"}),e.jsx("div",{style:{fontSize:"11px"},children:r.host})]}),r.traceId&&e.jsxs("div",{children:[e.jsx("div",{style:{fontSize:"10px",color:"var(--nice-text-muted, #888)",marginBottom:"2px"},children:"Trace ID"}),e.jsx("div",{style:{fontSize:"11px",fontFamily:"monospace"},children:r.traceId})]})]}),Object.keys(r.attributes).length>0&&e.jsxs("div",{style:{marginBottom:"12px"},children:[e.jsx("div",{style:{fontSize:"10px",color:"var(--nice-text-muted, #888)",marginBottom:"4px"},children:"Attributes"}),e.jsx("div",{style:{display:"flex",flexWrap:"wrap",gap:"4px"},children:Object.entries(r.attributes).map(([z,oe])=>e.jsxs("span",{style:{padding:"2px 8px",background:"var(--nice-bg-tertiary, #333)",borderRadius:"4px",fontSize:"10px"},children:[z,"=",String(oe)]},z))})]}),r.stackTrace&&e.jsxs("div",{children:[e.jsx("div",{style:{fontSize:"10px",color:"var(--nice-text-muted, #888)",marginBottom:"4px"},children:"Stack Trace"}),e.jsx("pre",{style:{margin:0,padding:"8px",background:"var(--nice-bg-elevated, #1e1e1e)",borderRadius:"4px",fontSize:"10px",overflow:"auto",maxHeight:"200px",color:"var(--nice-color-error, #ef4444)"},children:r.stackTrace})]}),e.jsxs("div",{style:{marginTop:"12px",display:"flex",gap:"8px"},children:[e.jsx("button",{onClick:()=>B(r),style:{padding:"4px 12px",borderRadius:"4px",border:"none",background:"var(--nice-color-primary, #3b82f6)",color:"var(--nice-text-on-primary, #fff)",cursor:"pointer",fontSize:"10px"},children:"View Details"}),r.traceId&&e.jsx("button",{onClick:()=>m(`{traceId="${r.traceId}"}`),style:{padding:"4px 12px",borderRadius:"4px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"10px"},children:"Show Trace"})]})]})]},r.id)}),d.length===0&&!g&&e.jsxs("div",{style:{padding:"48px",textAlign:"center",color:"var(--nice-text-muted, #666)"},children:[e.jsx(i.NiceIcon,{name:"archive",size:48}),e.jsx("p",{style:{marginTop:"16px"},children:"No logs match your query"})]}),g&&e.jsxs("div",{style:{padding:"48px",textAlign:"center",color:"var(--nice-text-muted, #666)"},children:[e.jsx(i.NiceIcon,{name:"clock",size:48}),e.jsx("p",{style:{marginTop:"16px"},children:"Loading logs..."})]})]}),u==="patterns"&&e.jsxs("div",{style:{flex:1,overflow:"auto",padding:"16px"},children:[S.map(r=>{const s=$[r.level];return e.jsxs("div",{style:{marginBottom:"12px",padding:"16px",background:"var(--nice-bg-elevated, #252525)",borderRadius:"8px",borderLeft:`3px solid ${s.color}`},children:[e.jsxs("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",marginBottom:"8px"},children:[e.jsx("span",{style:{fontFamily:"monospace",fontSize:"12px",fontWeight:500},children:r.pattern}),e.jsxs("span",{style:{padding:"2px 8px",background:"var(--nice-bg-tertiary, #333)",borderRadius:"4px",fontSize:"11px"},children:[r.count," occurrences"]})]}),e.jsxs("div",{style:{fontSize:"11px",color:"var(--nice-text-muted, #888)"},children:["Sample: ",r.samples[0]]})]},r.id)}),S.length===0&&e.jsx("div",{style:{padding:"48px",textAlign:"center",color:"var(--nice-text-muted, #666)"},children:e.jsx("p",{children:"No patterns detected. Run a query first."})})]})]})]}),t&&e.jsx("div",{style:{position:"fixed",inset:0,background:"var(--nice-overlay-70, rgba(0, 0, 0, 0.7))",display:"flex",alignItems:"center",justifyContent:"center",zIndex:1e3},children:e.jsxs("div",{style:{width:"400px",background:"var(--nice-bg-elevated, #252525)",borderRadius:"12px",padding:"24px"},children:[e.jsx("h3",{style:{margin:"0 0 16px 0",fontSize:"14px"},children:"Save Query"}),e.jsx("input",{type:"text",value:o,onChange:r=>f(r.target.value),placeholder:"Query name...",style:{width:"100%",padding:"10px",borderRadius:"8px",border:"1px solid var(--nice-border-color, #444)",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #fff)",fontSize:"13px",marginBottom:"16px"}}),e.jsxs("div",{style:{display:"flex",justifyContent:"flex-end",gap:"8px"},children:[e.jsx("button",{onClick:()=>n(!1),style:{padding:"8px 16px",borderRadius:"6px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-primary, #fff)",cursor:"pointer"},children:"Cancel"}),e.jsx("button",{onClick:te,style:{padding:"8px 16px",borderRadius:"6px",border:"none",background:"var(--nice-color-primary, #3b82f6)",color:"var(--nice-text-on-primary, #fff)",cursor:"pointer"},children:"Save"})]})]})})]})},ae={critical:{color:"var(--nice-color-error, #ef4444)",icon:"error"},warning:{color:"var(--nice-color-warning, #f59e0b)",icon:"warning"},info:{color:"var(--nice-color-primary, #3b82f6)",icon:"info"}},F={verticalAlign:"text-bottom",marginRight:"var(--nice-space-1, 4px)"},de=[{from:"now-5m",to:"now",display:"Last 5 minutes"},{from:"now-15m",to:"now",display:"Last 15 minutes"},{from:"now-1h",to:"now",display:"Last 1 hour"},{from:"now-3h",to:"now",display:"Last 3 hours"},{from:"now-6h",to:"now",display:"Last 6 hours"},{from:"now-12h",to:"now",display:"Last 12 hours"},{from:"now-24h",to:"now",display:"Last 24 hours"},{from:"now-7d",to:"now",display:"Last 7 days"},{from:"now-30d",to:"now",display:"Last 30 days"}],le={},ce=({dashboard:a,metrics:y=le,alerts:L=[],timeRanges:g=de,onTimeRangeChange:T,onVariableChange:S,onPanelEdit:V,onPanelAdd:O,onPanelRemove:P,onPanelMove:Y,onAlertAcknowledge:B,onAlertSilence:C,onQueryExecute:q,onDashboardSave:M,onRefresh:b,isEditing:h=!1,onEditModeToggle:A,className:Q,style:H,testId:G,"data-testid":D})=>{const I=D??G,{t:m}=i.useNiceTranslation(),[E,W]=l.useState(!1),[U,ee]=l.useState(!0),[R,X]=l.useState(null),k=L.filter(t=>t.status==="firing"),J=t=>{var o,f,u;const n=(o=t.queries[0])!=null&&o.expression?y[t.queries[0].expression]:null;switch(t.type){case"stat":return e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",height:"100%",flexDirection:"column"},children:[e.jsx("div",{style:{fontSize:"48px",fontWeight:600,color:n?_(n.currentValue,t.thresholds):"var(--nice-text-primary, #e0e0e0)"},children:(n==null?void 0:n.currentValue.toFixed(2))??"-"}),(n==null?void 0:n.unit)&&e.jsx("div",{style:{fontSize:"14px",color:"var(--nice-text-muted, #888)",marginTop:"4px"},children:n.unit})]});case"gauge":{const p=(n==null?void 0:n.currentValue)??0,c=((u=(f=t.thresholds)==null?void 0:f[t.thresholds.length-1])==null?void 0:u.value)??100,v=Math.min(p/c*100,100);return e.jsx("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",height:"100%"},children:e.jsxs("svg",{viewBox:"0 0 100 60",style:{width:"100%",maxWidth:"200px"},children:[e.jsx("path",{d:"M 10 50 A 40 40 0 0 1 90 50",fill:"none",stroke:"var(--nice-border-color, #333)",strokeWidth:"8"}),e.jsx("path",{d:"M 10 50 A 40 40 0 0 1 90 50",fill:"none",stroke:_(p,t.thresholds),strokeWidth:"8",strokeDasharray:`${v*1.26} 126`}),e.jsx("text",{x:"50",y:"45",textAnchor:"middle",fill:"var(--nice-text-primary, #e0e0e0)",fontSize:"16",fontWeight:"600",children:p.toFixed(1)})]})})}case"timeseries":return Z(t,n);case"table":return e.jsx("div",{style:{overflow:"auto",height:"100%"},children:e.jsxs("table",{style:{width:"100%",fontSize:"11px",borderCollapse:"collapse"},children:[e.jsx("thead",{children:e.jsxs("tr",{style:{background:"var(--nice-bg-elevated, #252525)"},children:[e.jsx("th",{style:{padding:"6px 8px",textAlign:"left",borderBottom:"1px solid var(--nice-border-color, #333)"},children:"Time"}),e.jsx("th",{style:{padding:"6px 8px",textAlign:"right",borderBottom:"1px solid var(--nice-border-color, #333)"},children:"Value"})]})}),e.jsx("tbody",{children:n==null?void 0:n.values.slice(-10).reverse().map((p,c)=>e.jsxs("tr",{children:[e.jsx("td",{style:{padding:"4px 8px",borderBottom:"1px solid var(--nice-border-color, #333)"},children:new Date(p.timestamp).toLocaleTimeString()}),e.jsxs("td",{style:{padding:"4px 8px",borderBottom:"1px solid var(--nice-border-color, #333)",textAlign:"right"},children:[p.value.toFixed(2)," ",n.unit]})]},c))})]})});case"bar_gauge":return e.jsx("div",{style:{padding:"8px",height:"100%",display:"flex",flexDirection:"column",justifyContent:"center"},children:t.queries.map((p,c)=>{var j,w;const v=y[p.expression],d=(v==null?void 0:v.currentValue)??0,N=((w=(j=t.thresholds)==null?void 0:j[t.thresholds.length-1])==null?void 0:w.value)??100;return e.jsxs("div",{style:{marginBottom:"8px"},children:[e.jsxs("div",{style:{display:"flex",justifyContent:"space-between",fontSize:"11px",marginBottom:"4px"},children:[e.jsx("span",{children:p.legendFormat??p.expression}),e.jsx("span",{children:d.toFixed(1)})]}),e.jsx("div",{style:{height:"16px",background:"var(--nice-bg-tertiary, #333)",borderRadius:"4px",overflow:"hidden"},children:e.jsx("div",{style:{height:"100%",width:`${d/N*100}%`,background:_(d,t.thresholds),borderRadius:"4px"}})})]},c)})});case"text":return e.jsx("div",{style:{padding:"12px",fontSize:"12px",lineHeight:"1.6"},children:t.description});default:return e.jsx("div",{style:{padding:"12px",color:"var(--nice-text-muted, #666)"},children:"Unsupported panel type"})}},Z=(t,n)=>{const o=(n==null?void 0:n.values)??[];if(o.length===0)return e.jsx("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",height:"100%",color:"var(--nice-text-muted, #666)"},children:"No data"});const f=o.map(d=>d.value),u=Math.min(...f),c=Math.max(...f)-u||1,v=o.map((d,N)=>{const j=N/(o.length-1)*100,w=100-(d.value-u)/c*80;return`${j},${w}`}).join(" ");return e.jsxs("svg",{viewBox:"0 0 100 100",preserveAspectRatio:"none",style:{width:"100%",height:"100%"},children:[[0,25,50,75,100].map(d=>e.jsx("line",{x1:"0",y1:d,x2:"100",y2:d,stroke:"var(--nice-text, #333)",strokeWidth:"0.5"},d)),t.chartType==="area"||t.chartType==="stacked_area"?e.jsx("polygon",{points:`0,100 ${v} 100,100`,fill:"var(--nice-primary-tint-20, rgba(59, 130, 246, 0.2))"}):null,e.jsx("polyline",{points:v,fill:"none",stroke:"var(--nice-primary, #3b82f6)",strokeWidth:"1"})]})},_=(t,n)=>{if(!n||n.length===0)return"var(--nice-color-primary, #3b82f6)";for(let o=n.length-1;o>=0;o--)if(t>=n[o].value)return n[o].color;return"var(--nice-color-success, #22c55e)"};return e.jsxs("div",{className:`nice-metrics-dashboard ${Q||""}`,style:{display:"flex",flexDirection:"column",height:"100%",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #e0e0e0)",...H},"data-testid":I,children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"12px",padding:"12px 16px",borderBottom:"1px solid var(--nice-border-color, #333)",background:"var(--nice-bg-elevated, #252525)"},children:[e.jsx(i.NiceIcon,{name:"bar-chart",size:20}),e.jsx("span",{style:{fontWeight:500,fontSize:"14px"},children:a.name}),e.jsx("div",{style:{flex:1}}),k.length>0&&e.jsxs("button",{onClick:()=>W(!0),style:{display:"flex",alignItems:"center",gap:"6px",padding:"6px 12px",borderRadius:"4px",border:"none",background:"var(--nice-danger-tint-15, #ef444422)",color:"var(--nice-color-error, #ef4444)",cursor:"pointer",fontSize:"12px"},children:[e.jsx(i.NiceIcon,{name:"error",size:14})," ",k.length," Alert",k.length!==1&&"s"]}),e.jsx("select",{value:a.timeRange.display,onChange:t=>{const n=g.find(o=>o.display===t.target.value);n&&T(n)},style:{padding:"6px 12px",borderRadius:"4px",border:"1px solid var(--nice-border-color, #444)",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #fff)",fontSize:"12px"},children:g.map(t=>e.jsx("option",{value:t.display,children:t.display},t.display))}),e.jsxs("button",{onClick:b,style:{padding:"6px 12px",borderRadius:"4px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"12px"},children:[e.jsx(i.NiceIcon,{name:"refresh",size:14,style:F}),"Refresh"]}),h?e.jsxs(e.Fragment,{children:[e.jsxs("button",{onClick:O,style:{padding:"6px 12px",borderRadius:"4px",border:"none",background:"var(--nice-color-primary, #3b82f6)",color:"var(--nice-text-on-primary, #fff)",cursor:"pointer",fontSize:"12px"},children:[e.jsx(i.NiceIcon,{name:"plus",size:14,style:F}),"Add Panel"]}),e.jsxs("button",{onClick:M,style:{padding:"6px 12px",borderRadius:"4px",border:"none",background:"var(--nice-color-success, #22c55e)",color:"var(--nice-text-on-primary, #fff)",cursor:"pointer",fontSize:"12px"},children:[e.jsx(i.NiceIcon,{name:"save",size:14,style:F}),"Save"]})]}):null,A&&e.jsxs("button",{onClick:A,style:{padding:"6px 12px",borderRadius:"4px",border:"none",background:h?"var(--nice-color-warning, #f59e0b)":"var(--nice-bg-tertiary, #333)",color:h?"var(--nice-text-on-primary, #fff)":"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"12px"},children:[e.jsx(i.NiceIcon,{name:h?"check":"edit",size:14,style:F}),h?"Done":"Edit"]})]}),a.variables.length>0&&U&&e.jsx("div",{style:{display:"flex",flexWrap:"wrap",gap:"12px",padding:"12px 16px",borderBottom:"1px solid var(--nice-border-color, #333)",background:"var(--nice-bg-elevated, #252525)"},children:a.variables.map(t=>{var n;return e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsxs("label",{style:{fontSize:"11px",color:"var(--nice-text-muted, #888)"},children:[t.label,":"]}),t.type==="textbox"?e.jsx("input",{type:"text",value:t.current,onChange:o=>S(t.id,o.target.value),style:{padding:"4px 8px",borderRadius:"4px",border:"1px solid var(--nice-border-color, #444)",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #fff)",fontSize:"11px",width:"120px"}}):e.jsx("select",{value:t.current,onChange:o=>S(t.id,o.target.value),style:{padding:"4px 8px",borderRadius:"4px",border:"1px solid var(--nice-border-color, #444)",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #fff)",fontSize:"11px"},children:(n=t.options)==null?void 0:n.map(o=>e.jsx("option",{value:o,children:o},o))})]},t.id)})}),e.jsx("div",{style:{flex:1,overflow:"auto",padding:"16px"},children:e.jsx("div",{style:{display:"grid",gridTemplateColumns:"repeat(12, 1fr)",gridAutoRows:"minmax(100px, auto)",gap:"16px"},children:a.panels.map(t=>e.jsxs("div",{style:{gridColumn:`span ${t.position.w}`,gridRow:`span ${t.position.h}`,background:"var(--nice-bg-elevated, #252525)",borderRadius:"8px",overflow:"hidden",border:R===t.id?"2px solid var(--nice-primary, #3b82f6)":"1px solid var(--nice-border-color, #333)"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",padding:"8px 12px",borderBottom:"1px solid var(--nice-border-color, #333)",background:"var(--nice-bg-elevated, #1e1e1e)"},children:[e.jsx("span",{style:{flex:1,fontSize:"12px",fontWeight:500},children:t.title}),h&&e.jsxs(e.Fragment,{children:[e.jsx("button",{onClick:()=>V(t),style:{padding:"2px 6px",marginLeft:"4px",borderRadius:"4px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-muted, #888)",cursor:"pointer",fontSize:"10px"},children:e.jsx(i.NiceIcon,{name:"edit",size:12,title:m("metricsDashboard.editPanel","Edit panel")})}),e.jsx("button",{onClick:()=>P(t.id),style:{padding:"2px 6px",marginLeft:"4px",borderRadius:"4px",border:"none",background:"var(--nice-color-error, #ef4444)",color:"var(--nice-text-on-primary, #fff)",cursor:"pointer",fontSize:"10px"},children:e.jsx(i.NiceIcon,{name:"close",size:12,title:m("metricsDashboard.removePanel","Remove panel")})})]})]}),e.jsx("div",{style:{height:"calc(100% - 40px)"},children:J(t)})]},t.id))})}),E&&e.jsx("div",{style:{position:"fixed",inset:0,background:"var(--nice-overlay-70, rgba(0, 0, 0, 0.7))",display:"flex",alignItems:"center",justifyContent:"center",zIndex:1e3},children:e.jsxs("div",{style:{width:"600px",maxHeight:"80vh",background:"var(--nice-bg-elevated, #252525)",borderRadius:"12px",overflow:"hidden"},children:[e.jsxs("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:"16px",borderBottom:"1px solid var(--nice-border-color, #333)"},children:[e.jsxs("span",{style:{fontWeight:600},children:["Active Alerts (",k.length,")"]}),e.jsx("button",{onClick:()=>W(!1),style:{background:"none",border:"none",color:"var(--nice-text-muted, #888)",cursor:"pointer",fontSize:"18px"},children:e.jsx(i.NiceIcon,{name:"close",size:18,title:m("close","Close")})})]}),e.jsxs("div",{style:{maxHeight:"60vh",overflow:"auto"},children:[L.map(t=>{const n=ae[t.severity];return e.jsxs("div",{style:{padding:"16px",borderBottom:"1px solid var(--nice-border-color, #333)",borderLeft:`4px solid ${n.color}`},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",marginBottom:"8px"},children:[e.jsx(i.NiceIcon,{name:n.icon,size:14,color:n.color}),e.jsx("span",{style:{fontWeight:500},children:t.name}),e.jsx("span",{style:{marginLeft:"auto",padding:"2px 8px",borderRadius:"4px",background:t.status==="firing"?"var(--nice-danger-tint-15, #ef444422)":"var(--nice-success-tint-15, #22c55e22)",color:t.status==="firing"?"var(--nice-color-error, #ef4444)":"var(--nice-color-success, #22c55e)",fontSize:"10px"},children:t.status})]}),e.jsx("p",{style:{margin:"0 0 8px 0",fontSize:"12px",color:"var(--nice-text-muted, #888)"},children:t.message}),e.jsxs("div",{style:{display:"flex",gap:"8px",fontSize:"11px",color:"var(--nice-text-muted, #666)"},children:[e.jsxs("span",{children:["Value: ",t.value]}),e.jsx("span",{children:"•"}),e.jsxs("span",{children:["Threshold: ",t.threshold]}),e.jsx("span",{children:"•"}),e.jsx("span",{children:new Date(t.startsAt).toLocaleString()})]}),t.status==="firing"&&B&&e.jsxs("div",{style:{marginTop:"12px",display:"flex",gap:"8px"},children:[e.jsx("button",{onClick:()=>B(t.id),style:{padding:"4px 12px",borderRadius:"4px",border:"none",background:"var(--nice-color-primary, #3b82f6)",color:"var(--nice-text-on-primary, #fff)",cursor:"pointer",fontSize:"11px"},children:"Acknowledge"}),C&&e.jsx("button",{onClick:()=>C(t.id,36e5),style:{padding:"4px 12px",borderRadius:"4px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"11px"},children:"Silence 1h"})]})]},t.id)}),L.length===0&&e.jsx("div",{style:{padding:"24px",textAlign:"center",color:"var(--nice-text-muted, #666)"},children:"No alerts"})]})]})})]})},xe=a=>{const{t:y}=i.useNiceTranslation();return a.dashboard?e.jsx(ce,{...a,dashboard:a.dashboard}):e.jsx("div",{className:a.className,style:a.style,"data-testid":a["data-testid"]??a.testId,children:e.jsx(i.NiceEmpty,{title:y("metricsDashboard.noDashboard","No dashboard")})})};exports.NiceLogExplorer=se;exports.NiceMetricsDashboard=xe;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("react/jsx-runtime"),i=require("@nice2dev/ui"),l=require("react"),$={trace:{color:"var(--nice-text-muted, #888)",bg:"var(--nice-overlay-15, #88888822)"},debug:{color:"var(--nice-color-accent, #8b5cf6)",bg:"#8b5cf622"},info:{color:"var(--nice-color-primary, #3b82f6)",bg:"var(--nice-primary-tint-15, #3b82f622)"},warn:{color:"var(--nice-color-warning, #f59e0b)",bg:"var(--nice-warning-tint-15, #f59e0b22)"},error:{color:"var(--nice-color-error, #ef4444)",bg:"var(--nice-danger-tint-15, #ef444422)"},fatal:{color:"var(--nice-color-error, #dc2626)",bg:"#dc262622"}},K={verticalAlign:"text-bottom",marginRight:"var(--nice-space-1, 4px)"},ie=[{label:"Last 5 min",value:"now-5m"},{label:"Last 15 min",value:"now-15m"},{label:"Last 30 min",value:"now-30m"},{label:"Last 1 hour",value:"now-1h"},{label:"Last 3 hours",value:"now-3h"},{label:"Last 6 hours",value:"now-6h"},{label:"Last 12 hours",value:"now-12h"},{label:"Last 24 hours",value:"now-24h"},{label:"Last 7 days",value:"now-7d"}],se=({logs:a,streams:y,totalCount:L,isLoading:g,savedQueries:T,patterns:S=[],onQueryExecute:V,onQuerySave:O,onQueryDelete:P,onStreamToggle:Y,onLogClick:B,onExport:C,onTailStart:q,onTailStop:M,isTailing:b=!1,className:h,style:A,testId:Q,"data-testid":H})=>{const G=H??Q,{t:D}=i.useNiceTranslation(),[I,m]=l.useState(""),[E,W]=l.useState("now-1h"),[U,ee]=l.useState(1e3),[R,X]=l.useState(new Set(["trace","debug","info","warn","error","fatal"])),[k,J]=l.useState(new Set),[Z,_]=l.useState(null),[t,n]=l.useState(!1),[o,f]=l.useState(""),[u,p]=l.useState("logs"),[c,v]=l.useState(""),d=l.useMemo(()=>a.filter(r=>!(!R.has(r.level)||c&&!r.message.toLowerCase().includes(c.toLowerCase()))),[a,R,c]),N=l.useMemo(()=>{const r={trace:0,debug:0,info:0,warn:0,error:0,fatal:0};return a.forEach(s=>r[s.level]++),r},[a]),j=()=>{V({query:I,timeRange:{from:E,to:"now"},limit:U,direction:"backward"})},w=r=>{J(s=>{const x=new Set(s);return x.has(r)?x.delete(r):x.add(r),x})},re=r=>{X(s=>{const x=new Set(s);return x.has(r)?x.delete(r):x.add(r),x})},te=()=>{o.trim()&&(O(o,I),n(!1),f(""))},ne=r=>{if(!c)return r;const s=new RegExp(`(${c})`,"gi");return r.replace(s,'<mark style="background: var(--nice-warning, #f59e0b); color: black; padding: 0 var(--nice-space-0-5, 2px); border-radius: var(--nice-radius-sm, 2px);">$1</mark>')};return e.jsxs("div",{className:`nice-log-explorer ${h||""}`,style:{display:"flex",flexDirection:"column",height:"100%",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #e0e0e0)",...A},"data-testid":G,children:[e.jsxs("div",{style:{padding:"12px 16px",borderBottom:"1px solid var(--nice-border-color, #333)",background:"var(--nice-bg-elevated, #252525)"},children:[e.jsxs("div",{style:{display:"flex",gap:"8px",marginBottom:"12px"},children:[e.jsx("input",{type:"text",value:I,onChange:r=>m(r.target.value),placeholder:'Enter query... e.g., {service="api"} |= "error"',onKeyDown:r=>r.key==="Enter"&&j(),style:{flex:1,padding:"10px 16px",borderRadius:"8px",border:"1px solid var(--nice-border-color, #444)",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #fff)",fontSize:"13px",fontFamily:"monospace"}}),e.jsx("select",{value:E,onChange:r=>W(r.target.value),style:{padding:"10px 12px",borderRadius:"8px",border:"1px solid var(--nice-border-color, #444)",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #fff)",fontSize:"12px"},children:ie.map(r=>e.jsx("option",{value:r.value,children:r.label},r.value))}),e.jsxs("button",{onClick:j,disabled:g,style:{padding:"10px 24px",borderRadius:"8px",border:"none",background:"var(--nice-color-primary, #3b82f6)",color:"var(--nice-text-on-primary, #fff)",cursor:g?"not-allowed":"pointer",fontSize:"13px",fontWeight:500,opacity:g?.7:1},children:[e.jsx(i.NiceIcon,{name:g?"clock":"search",size:14,style:K}),"Search"]}),e.jsx("button",{onClick:()=>n(!0),style:{padding:"10px 12px",borderRadius:"8px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"12px"},children:e.jsx(i.NiceIcon,{name:"save",size:14,title:D("logExplorer.saveQuery","Save query")})}),q&&e.jsxs("button",{onClick:b?M:q,style:{padding:"10px 16px",borderRadius:"8px",border:"none",background:b?"var(--nice-color-success, #22c55e)":"var(--nice-bg-tertiary, #333)",color:b?"var(--nice-color-white, #fff)":"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"12px"},children:[e.jsx(i.NiceIcon,{name:b?"stop":"play",size:14,style:K}),b?"Stop":"Tail"]})]}),e.jsxs("div",{style:{display:"flex",gap:"8px",alignItems:"center"},children:[e.jsx("span",{style:{fontSize:"11px",color:"var(--nice-text-muted, #888)"},children:"Levels:"}),Object.keys($).map(r=>{const s=$[r],x=N[r],z=R.has(r);return e.jsxs("button",{onClick:()=>re(r),style:{display:"flex",alignItems:"center",gap:"4px",padding:"4px 10px",borderRadius:"4px",border:"none",background:z?s.bg:"transparent",color:z?s.color:"var(--nice-text-muted, #666)",cursor:"pointer",fontSize:"11px",opacity:z?1:.5},children:[r.toUpperCase()," (",x,")"]},r)}),e.jsx("div",{style:{flex:1}}),e.jsx("input",{type:"text",value:c,onChange:r=>v(r.target.value),placeholder:"Filter results...",style:{padding:"4px 8px",borderRadius:"4px",border:"1px solid var(--nice-border-color, #444)",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #fff)",fontSize:"11px",width:"150px"}})]})]}),e.jsxs("div",{style:{flex:1,display:"flex",overflow:"hidden"},children:[e.jsxs("div",{style:{width:"220px",borderRight:"1px solid var(--nice-border-color, #333)",display:"flex",flexDirection:"column",overflow:"hidden"},children:[e.jsxs("div",{style:{flex:1,overflow:"auto",padding:"12px"},children:[e.jsx("h4",{style:{margin:"0 0 8px 0",fontSize:"11px",color:"var(--nice-text-muted, #888)",textTransform:"uppercase"},children:"Log Streams"}),y.map(r=>e.jsxs("label",{style:{display:"flex",alignItems:"center",gap:"8px",padding:"6px 0",cursor:"pointer",fontSize:"12px"},children:[e.jsx("input",{type:"checkbox",defaultChecked:!0,onChange:s=>Y(r.id,s.target.checked)}),e.jsx("span",{style:{width:"8px",height:"8px",borderRadius:"50%",background:r.color}}),e.jsx("span",{children:r.name})]},r.id)),y.length===0&&e.jsx("div",{style:{color:"var(--nice-text-muted, #666)",fontSize:"11px"},children:"No streams discovered"})]}),e.jsxs("div",{style:{borderTop:"1px solid var(--nice-border-color, #333)",padding:"12px",maxHeight:"200px",overflow:"auto"},children:[e.jsx("h4",{style:{margin:"0 0 8px 0",fontSize:"11px",color:"var(--nice-text-muted, #888)",textTransform:"uppercase"},children:"Saved Queries"}),T.map(r=>e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",padding:"6px 8px",marginBottom:"4px",background:"var(--nice-bg-elevated, #252525)",borderRadius:"4px",cursor:"pointer",fontSize:"11px"},onClick:()=>m(r.query),children:[e.jsx("span",{style:{flex:1,overflow:"hidden",textOverflow:"ellipsis",whiteSpace:"nowrap"},children:r.name}),e.jsx("button",{onClick:s=>{s.stopPropagation(),P(r.id)},style:{background:"none",border:"none",color:"var(--nice-text-muted, #666)",cursor:"pointer",fontSize:"10px"},children:e.jsx(i.NiceIcon,{name:"close",size:10,title:D("logExplorer.deleteQuery","Delete saved query")})})]},r.id)),T.length===0&&e.jsx("div",{style:{color:"var(--nice-text-muted, #666)",fontSize:"11px"},children:"No saved queries"})]})]}),e.jsxs("div",{style:{flex:1,display:"flex",flexDirection:"column",overflow:"hidden"},children:[e.jsxs("div",{style:{display:"flex",borderBottom:"1px solid var(--nice-border-color, #333)"},children:[[{id:"logs",icon:"file",label:`Logs (${d.length})`},{id:"patterns",icon:"flask",label:`Patterns (${S.length})`}].map(r=>e.jsxs("button",{onClick:()=>p(r.id),style:{padding:"10px 20px",border:"none",background:u===r.id?"var(--nice-bg-elevated, #1e1e1e)":"transparent",color:u===r.id?"var(--nice-text-primary, #fff)":"var(--nice-text-muted, #888)",cursor:"pointer",fontSize:"12px",borderBottom:u===r.id?"2px solid var(--nice-primary, #3b82f6)":"2px solid transparent"},children:[e.jsx(i.NiceIcon,{name:r.icon,size:12,style:K}),r.label]},r.id)),e.jsx("div",{style:{flex:1}}),e.jsxs("div",{style:{display:"flex",gap:"8px",padding:"8px"},children:[e.jsx("button",{onClick:()=>C("json"),style:{padding:"4px 8px",borderRadius:"4px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"10px"},children:"JSON"}),e.jsx("button",{onClick:()=>C("csv"),style:{padding:"4px 8px",borderRadius:"4px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"10px"},children:"CSV"})]})]}),u==="logs"&&e.jsxs("div",{style:{flex:1,overflow:"auto",fontFamily:"monospace",fontSize:"12px"},children:[d.map(r=>{const s=$[r.level],x=k.has(r.id);return e.jsxs("div",{style:{borderBottom:"1px solid var(--nice-bg-secondary, #252525)"},children:[e.jsxs("div",{onClick:()=>w(r.id),style:{display:"flex",alignItems:"flex-start",gap:"8px",padding:"6px 12px",cursor:"pointer",background:x?"var(--nice-bg-elevated, #252525)":"transparent"},children:[e.jsx("span",{style:{color:"var(--nice-text-muted, #666)",fontSize:"10px",minWidth:"160px"},children:new Date(r.timestamp).toISOString()}),e.jsx("span",{style:{padding:"2px 6px",borderRadius:"4px",background:s.bg,color:s.color,fontSize:"10px",fontWeight:500,minWidth:"50px",textAlign:"center"},children:r.level.toUpperCase()}),r.service&&e.jsxs("span",{style:{color:"var(--nice-color-accent, #8b5cf6)",fontSize:"10px",minWidth:"80px"},children:["[",r.service,"]"]}),e.jsx("span",{style:{flex:1,whiteSpace:"pre-wrap",wordBreak:"break-all"},dangerouslySetInnerHTML:{__html:ne(r.message)}})]}),x&&e.jsxs("div",{style:{padding:"12px 12px 12px 200px",background:"var(--nice-bg-elevated, #252525)",borderTop:"1px solid var(--nice-border-color, #333)"},children:[e.jsxs("div",{style:{display:"grid",gridTemplateColumns:"repeat(3, 1fr)",gap:"12px",marginBottom:"12px"},children:[e.jsxs("div",{children:[e.jsx("div",{style:{fontSize:"10px",color:"var(--nice-text-muted, #888)",marginBottom:"2px"},children:"Source"}),e.jsx("div",{style:{fontSize:"11px"},children:r.source})]}),r.host&&e.jsxs("div",{children:[e.jsx("div",{style:{fontSize:"10px",color:"var(--nice-text-muted, #888)",marginBottom:"2px"},children:"Host"}),e.jsx("div",{style:{fontSize:"11px"},children:r.host})]}),r.traceId&&e.jsxs("div",{children:[e.jsx("div",{style:{fontSize:"10px",color:"var(--nice-text-muted, #888)",marginBottom:"2px"},children:"Trace ID"}),e.jsx("div",{style:{fontSize:"11px",fontFamily:"monospace"},children:r.traceId})]})]}),Object.keys(r.attributes).length>0&&e.jsxs("div",{style:{marginBottom:"12px"},children:[e.jsx("div",{style:{fontSize:"10px",color:"var(--nice-text-muted, #888)",marginBottom:"4px"},children:"Attributes"}),e.jsx("div",{style:{display:"flex",flexWrap:"wrap",gap:"4px"},children:Object.entries(r.attributes).map(([z,oe])=>e.jsxs("span",{style:{padding:"2px 8px",background:"var(--nice-bg-tertiary, #333)",borderRadius:"4px",fontSize:"10px"},children:[z,"=",String(oe)]},z))})]}),r.stackTrace&&e.jsxs("div",{children:[e.jsx("div",{style:{fontSize:"10px",color:"var(--nice-text-muted, #888)",marginBottom:"4px"},children:"Stack Trace"}),e.jsx("pre",{style:{margin:0,padding:"8px",background:"var(--nice-bg-elevated, #1e1e1e)",borderRadius:"4px",fontSize:"10px",overflow:"auto",maxHeight:"200px",color:"var(--nice-color-error, #ef4444)"},children:r.stackTrace})]}),e.jsxs("div",{style:{marginTop:"12px",display:"flex",gap:"8px"},children:[e.jsx("button",{onClick:()=>B(r),style:{padding:"4px 12px",borderRadius:"4px",border:"none",background:"var(--nice-color-primary, #3b82f6)",color:"var(--nice-text-on-primary, #fff)",cursor:"pointer",fontSize:"10px"},children:"View Details"}),r.traceId&&e.jsx("button",{onClick:()=>m(`{traceId="${r.traceId}"}`),style:{padding:"4px 12px",borderRadius:"4px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"10px"},children:"Show Trace"})]})]})]},r.id)}),d.length===0&&!g&&e.jsxs("div",{style:{padding:"48px",textAlign:"center",color:"var(--nice-text-muted, #666)"},children:[e.jsx(i.NiceIcon,{name:"archive",size:48}),e.jsx("p",{style:{marginTop:"16px"},children:"No logs match your query"})]}),g&&e.jsxs("div",{style:{padding:"48px",textAlign:"center",color:"var(--nice-text-muted, #666)"},children:[e.jsx(i.NiceIcon,{name:"clock",size:48}),e.jsx("p",{style:{marginTop:"16px"},children:"Loading logs..."})]})]}),u==="patterns"&&e.jsxs("div",{style:{flex:1,overflow:"auto",padding:"16px"},children:[S.map(r=>{const s=$[r.level];return e.jsxs("div",{style:{marginBottom:"12px",padding:"16px",background:"var(--nice-bg-elevated, #252525)",borderRadius:"8px",borderLeft:`3px solid ${s.color}`},children:[e.jsxs("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",marginBottom:"8px"},children:[e.jsx("span",{style:{fontFamily:"monospace",fontSize:"12px",fontWeight:500},children:r.pattern}),e.jsxs("span",{style:{padding:"2px 8px",background:"var(--nice-bg-tertiary, #333)",borderRadius:"4px",fontSize:"11px"},children:[r.count," occurrences"]})]}),e.jsxs("div",{style:{fontSize:"11px",color:"var(--nice-text-muted, #888)"},children:["Sample: ",r.samples[0]]})]},r.id)}),S.length===0&&e.jsx("div",{style:{padding:"48px",textAlign:"center",color:"var(--nice-text-muted, #666)"},children:e.jsx("p",{children:"No patterns detected. Run a query first."})})]})]})]}),t&&e.jsx("div",{style:{position:"fixed",inset:0,background:"var(--nice-overlay-70, rgba(0, 0, 0, 0.7))",display:"flex",alignItems:"center",justifyContent:"center",zIndex:1e3},children:e.jsxs("div",{style:{width:"400px",background:"var(--nice-bg-elevated, #252525)",borderRadius:"12px",padding:"24px"},children:[e.jsx("h3",{style:{margin:"0 0 16px 0",fontSize:"14px"},children:"Save Query"}),e.jsx("input",{type:"text",value:o,onChange:r=>f(r.target.value),placeholder:"Query name...",style:{width:"100%",padding:"10px",borderRadius:"8px",border:"1px solid var(--nice-border-color, #444)",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #fff)",fontSize:"13px",marginBottom:"16px"}}),e.jsxs("div",{style:{display:"flex",justifyContent:"flex-end",gap:"8px"},children:[e.jsx("button",{onClick:()=>n(!1),style:{padding:"8px 16px",borderRadius:"6px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-primary, #fff)",cursor:"pointer"},children:"Cancel"}),e.jsx("button",{onClick:te,style:{padding:"8px 16px",borderRadius:"6px",border:"none",background:"var(--nice-color-primary, #3b82f6)",color:"var(--nice-text-on-primary, #fff)",cursor:"pointer"},children:"Save"})]})]})})]})},ae={critical:{color:"var(--nice-color-error, #ef4444)",icon:"error"},warning:{color:"var(--nice-color-warning, #f59e0b)",icon:"warning"},info:{color:"var(--nice-color-primary, #3b82f6)",icon:"info"}},F={verticalAlign:"text-bottom",marginRight:"var(--nice-space-1, 4px)"},de=[{from:"now-5m",to:"now",display:"Last 5 minutes"},{from:"now-15m",to:"now",display:"Last 15 minutes"},{from:"now-1h",to:"now",display:"Last 1 hour"},{from:"now-3h",to:"now",display:"Last 3 hours"},{from:"now-6h",to:"now",display:"Last 6 hours"},{from:"now-12h",to:"now",display:"Last 12 hours"},{from:"now-24h",to:"now",display:"Last 24 hours"},{from:"now-7d",to:"now",display:"Last 7 days"},{from:"now-30d",to:"now",display:"Last 30 days"}],le={},ce=({dashboard:a,metrics:y=le,alerts:L=[],timeRanges:g=de,onTimeRangeChange:T,onVariableChange:S,onPanelEdit:V,onPanelAdd:O,onPanelRemove:P,onPanelMove:Y,onAlertAcknowledge:B,onAlertSilence:C,onQueryExecute:q,onDashboardSave:M,onRefresh:b,isEditing:h=!1,onEditModeToggle:A,className:Q,style:H,testId:G,"data-testid":D})=>{const I=D??G,{t:m}=i.useNiceTranslation(),[E,W]=l.useState(!1),[U,ee]=l.useState(!0),[R,X]=l.useState(null),k=L.filter(t=>t.status==="firing"),J=t=>{var o,f,u;const n=(o=t.queries[0])!=null&&o.expression?y[t.queries[0].expression]:null;switch(t.type){case"stat":return e.jsxs("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",height:"100%",flexDirection:"column"},children:[e.jsx("div",{style:{fontSize:"48px",fontWeight:600,color:n?_(n.currentValue,t.thresholds):"var(--nice-text-primary, #e0e0e0)"},children:(n==null?void 0:n.currentValue.toFixed(2))??"-"}),(n==null?void 0:n.unit)&&e.jsx("div",{style:{fontSize:"14px",color:"var(--nice-text-muted, #888)",marginTop:"4px"},children:n.unit})]});case"gauge":{const p=(n==null?void 0:n.currentValue)??0,c=((u=(f=t.thresholds)==null?void 0:f[t.thresholds.length-1])==null?void 0:u.value)??100,v=Math.min(p/c*100,100);return e.jsx("div",{style:{display:"flex",flexDirection:"column",alignItems:"center",justifyContent:"center",height:"100%"},children:e.jsxs("svg",{viewBox:"0 0 100 60",style:{width:"100%",maxWidth:"200px"},children:[e.jsx("path",{d:"M 10 50 A 40 40 0 0 1 90 50",fill:"none",stroke:"var(--nice-border-color, #333)",strokeWidth:"8"}),e.jsx("path",{d:"M 10 50 A 40 40 0 0 1 90 50",fill:"none",stroke:_(p,t.thresholds),strokeWidth:"8",strokeDasharray:`${v*1.26} 126`}),e.jsx("text",{x:"50",y:"45",textAnchor:"middle",fill:"var(--nice-text-primary, #e0e0e0)",fontSize:"16",fontWeight:"600",children:p.toFixed(1)})]})})}case"timeseries":return Z(t,n);case"table":return e.jsx("div",{style:{overflow:"auto",height:"100%"},children:e.jsxs("table",{style:{width:"100%",fontSize:"11px",borderCollapse:"collapse"},children:[e.jsx("thead",{children:e.jsxs("tr",{style:{background:"var(--nice-bg-elevated, #252525)"},children:[e.jsx("th",{style:{padding:"6px 8px",textAlign:"left",borderBottom:"1px solid var(--nice-border-color, #333)"},children:"Time"}),e.jsx("th",{style:{padding:"6px 8px",textAlign:"right",borderBottom:"1px solid var(--nice-border-color, #333)"},children:"Value"})]})}),e.jsx("tbody",{children:n==null?void 0:n.values.slice(-10).reverse().map((p,c)=>e.jsxs("tr",{children:[e.jsx("td",{style:{padding:"4px 8px",borderBottom:"1px solid var(--nice-border-color, #333)"},children:new Date(p.timestamp).toLocaleTimeString()}),e.jsxs("td",{style:{padding:"4px 8px",borderBottom:"1px solid var(--nice-border-color, #333)",textAlign:"right"},children:[p.value.toFixed(2)," ",n.unit]})]},c))})]})});case"bar_gauge":return e.jsx("div",{style:{padding:"8px",height:"100%",display:"flex",flexDirection:"column",justifyContent:"center"},children:t.queries.map((p,c)=>{var j,w;const v=y[p.expression],d=(v==null?void 0:v.currentValue)??0,N=((w=(j=t.thresholds)==null?void 0:j[t.thresholds.length-1])==null?void 0:w.value)??100;return e.jsxs("div",{style:{marginBottom:"8px"},children:[e.jsxs("div",{style:{display:"flex",justifyContent:"space-between",fontSize:"11px",marginBottom:"4px"},children:[e.jsx("span",{children:p.legendFormat??p.expression}),e.jsx("span",{children:d.toFixed(1)})]}),e.jsx("div",{style:{height:"16px",background:"var(--nice-bg-tertiary, #333)",borderRadius:"4px",overflow:"hidden"},children:e.jsx("div",{style:{height:"100%",width:`${d/N*100}%`,background:_(d,t.thresholds),borderRadius:"4px"}})})]},c)})});case"text":return e.jsx("div",{style:{padding:"12px",fontSize:"12px",lineHeight:"1.6"},children:t.description});default:return e.jsx("div",{style:{padding:"12px",color:"var(--nice-text-muted, #666)"},children:"Unsupported panel type"})}},Z=(t,n)=>{const o=(n==null?void 0:n.values)??[];if(o.length===0)return e.jsx("div",{style:{display:"flex",alignItems:"center",justifyContent:"center",height:"100%",color:"var(--nice-text-muted, #666)"},children:"No data"});const f=o.map(d=>d.value),u=Math.min(...f),c=Math.max(...f)-u||1,v=o.map((d,N)=>{const j=N/(o.length-1)*100,w=100-(d.value-u)/c*80;return`${j},${w}`}).join(" ");return e.jsxs("svg",{viewBox:"0 0 100 100",preserveAspectRatio:"none",style:{width:"100%",height:"100%"},children:[[0,25,50,75,100].map(d=>e.jsx("line",{x1:"0",y1:d,x2:"100",y2:d,stroke:"var(--nice-text, #333)",strokeWidth:"0.5"},d)),t.chartType==="area"||t.chartType==="stacked_area"?e.jsx("polygon",{points:`0,100 ${v} 100,100`,fill:"var(--nice-primary-tint-20, rgba(59, 130, 246, 0.2))"}):null,e.jsx("polyline",{points:v,fill:"none",stroke:"var(--nice-primary, #3b82f6)",strokeWidth:"1"})]})},_=(t,n)=>{if(!n||n.length===0)return"var(--nice-color-primary, #3b82f6)";for(let o=n.length-1;o>=0;o--)if(t>=n[o].value)return n[o].color;return"var(--nice-color-success, #22c55e)"};return e.jsxs("div",{className:`nice-metrics-dashboard ${Q||""}`,style:{display:"flex",flexDirection:"column",height:"100%",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #e0e0e0)",...H},"data-testid":I,children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"12px",padding:"12px 16px",borderBottom:"1px solid var(--nice-border-color, #333)",background:"var(--nice-bg-elevated, #252525)"},children:[e.jsx(i.NiceIcon,{name:"bar-chart",size:20}),e.jsx("span",{style:{fontWeight:500,fontSize:"14px"},children:a.name}),e.jsx("div",{style:{flex:1}}),k.length>0&&e.jsxs("button",{onClick:()=>W(!0),style:{display:"flex",alignItems:"center",gap:"6px",padding:"6px 12px",borderRadius:"4px",border:"none",background:"var(--nice-danger-tint-15, #ef444422)",color:"var(--nice-color-error, #ef4444)",cursor:"pointer",fontSize:"12px"},children:[e.jsx(i.NiceIcon,{name:"error",size:14})," ",k.length," Alert",k.length!==1&&"s"]}),e.jsx("select",{value:a.timeRange.display,onChange:t=>{const n=g.find(o=>o.display===t.target.value);n&&T(n)},style:{padding:"6px 12px",borderRadius:"4px",border:"1px solid var(--nice-border-color, #444)",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #fff)",fontSize:"12px"},children:g.map(t=>e.jsx("option",{value:t.display,children:t.display},t.display))}),e.jsxs("button",{onClick:b,style:{padding:"6px 12px",borderRadius:"4px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"12px"},children:[e.jsx(i.NiceIcon,{name:"refresh",size:14,style:F}),"Refresh"]}),h?e.jsxs(e.Fragment,{children:[e.jsxs("button",{onClick:O,style:{padding:"6px 12px",borderRadius:"4px",border:"none",background:"var(--nice-color-primary, #3b82f6)",color:"var(--nice-text-on-primary, #fff)",cursor:"pointer",fontSize:"12px"},children:[e.jsx(i.NiceIcon,{name:"plus",size:14,style:F}),"Add Panel"]}),e.jsxs("button",{onClick:M,style:{padding:"6px 12px",borderRadius:"4px",border:"none",background:"var(--nice-color-success, #22c55e)",color:"var(--nice-text-on-primary, #fff)",cursor:"pointer",fontSize:"12px"},children:[e.jsx(i.NiceIcon,{name:"save",size:14,style:F}),"Save"]})]}):null,A&&e.jsxs("button",{onClick:A,style:{padding:"6px 12px",borderRadius:"4px",border:"none",background:h?"var(--nice-color-warning, #f59e0b)":"var(--nice-bg-tertiary, #333)",color:h?"var(--nice-color-white, #fff)":"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"12px"},children:[e.jsx(i.NiceIcon,{name:h?"check":"edit",size:14,style:F}),h?"Done":"Edit"]})]}),a.variables.length>0&&U&&e.jsx("div",{style:{display:"flex",flexWrap:"wrap",gap:"12px",padding:"12px 16px",borderBottom:"1px solid var(--nice-border-color, #333)",background:"var(--nice-bg-elevated, #252525)"},children:a.variables.map(t=>{var n;return e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px"},children:[e.jsxs("label",{style:{fontSize:"11px",color:"var(--nice-text-muted, #888)"},children:[t.label,":"]}),t.type==="textbox"?e.jsx("input",{type:"text",value:t.current,onChange:o=>S(t.id,o.target.value),style:{padding:"4px 8px",borderRadius:"4px",border:"1px solid var(--nice-border-color, #444)",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #fff)",fontSize:"11px",width:"120px"}}):e.jsx("select",{value:t.current,onChange:o=>S(t.id,o.target.value),style:{padding:"4px 8px",borderRadius:"4px",border:"1px solid var(--nice-border-color, #444)",background:"var(--nice-bg-elevated, #1e1e1e)",color:"var(--nice-text-primary, #fff)",fontSize:"11px"},children:(n=t.options)==null?void 0:n.map(o=>e.jsx("option",{value:o,children:o},o))})]},t.id)})}),e.jsx("div",{style:{flex:1,overflow:"auto",padding:"16px"},children:e.jsx("div",{style:{display:"grid",gridTemplateColumns:"repeat(12, 1fr)",gridAutoRows:"minmax(100px, auto)",gap:"16px"},children:a.panels.map(t=>e.jsxs("div",{style:{gridColumn:`span ${t.position.w}`,gridRow:`span ${t.position.h}`,background:"var(--nice-bg-elevated, #252525)",borderRadius:"8px",overflow:"hidden",border:R===t.id?"2px solid var(--nice-primary, #3b82f6)":"1px solid var(--nice-border-color, #333)"},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",padding:"8px 12px",borderBottom:"1px solid var(--nice-border-color, #333)",background:"var(--nice-bg-elevated, #1e1e1e)"},children:[e.jsx("span",{style:{flex:1,fontSize:"12px",fontWeight:500},children:t.title}),h&&e.jsxs(e.Fragment,{children:[e.jsx("button",{onClick:()=>V(t),style:{padding:"2px 6px",marginLeft:"4px",borderRadius:"4px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-muted, #888)",cursor:"pointer",fontSize:"10px"},children:e.jsx(i.NiceIcon,{name:"edit",size:12,title:m("metricsDashboard.editPanel","Edit panel")})}),e.jsx("button",{onClick:()=>P(t.id),style:{padding:"2px 6px",marginLeft:"4px",borderRadius:"4px",border:"none",background:"var(--nice-color-error, #ef4444)",color:"var(--nice-text-on-primary, #fff)",cursor:"pointer",fontSize:"10px"},children:e.jsx(i.NiceIcon,{name:"close",size:12,title:m("metricsDashboard.removePanel","Remove panel")})})]})]}),e.jsx("div",{style:{height:"calc(100% - 40px)"},children:J(t)})]},t.id))})}),E&&e.jsx("div",{style:{position:"fixed",inset:0,background:"var(--nice-overlay-70, rgba(0, 0, 0, 0.7))",display:"flex",alignItems:"center",justifyContent:"center",zIndex:1e3},children:e.jsxs("div",{style:{width:"600px",maxHeight:"80vh",background:"var(--nice-bg-elevated, #252525)",borderRadius:"12px",overflow:"hidden"},children:[e.jsxs("div",{style:{display:"flex",justifyContent:"space-between",alignItems:"center",padding:"16px",borderBottom:"1px solid var(--nice-border-color, #333)"},children:[e.jsxs("span",{style:{fontWeight:600},children:["Active Alerts (",k.length,")"]}),e.jsx("button",{onClick:()=>W(!1),style:{background:"none",border:"none",color:"var(--nice-text-muted, #888)",cursor:"pointer",fontSize:"18px"},children:e.jsx(i.NiceIcon,{name:"close",size:18,title:m("close","Close")})})]}),e.jsxs("div",{style:{maxHeight:"60vh",overflow:"auto"},children:[L.map(t=>{const n=ae[t.severity];return e.jsxs("div",{style:{padding:"16px",borderBottom:"1px solid var(--nice-border-color, #333)",borderLeft:`4px solid ${n.color}`},children:[e.jsxs("div",{style:{display:"flex",alignItems:"center",gap:"8px",marginBottom:"8px"},children:[e.jsx(i.NiceIcon,{name:n.icon,size:14,color:n.color}),e.jsx("span",{style:{fontWeight:500},children:t.name}),e.jsx("span",{style:{marginLeft:"auto",padding:"2px 8px",borderRadius:"4px",background:t.status==="firing"?"var(--nice-danger-tint-15, #ef444422)":"var(--nice-success-tint-15, #22c55e22)",color:t.status==="firing"?"var(--nice-color-error, #ef4444)":"var(--nice-color-success, #22c55e)",fontSize:"10px"},children:t.status})]}),e.jsx("p",{style:{margin:"0 0 8px 0",fontSize:"12px",color:"var(--nice-text-muted, #888)"},children:t.message}),e.jsxs("div",{style:{display:"flex",gap:"8px",fontSize:"11px",color:"var(--nice-text-muted, #666)"},children:[e.jsxs("span",{children:["Value: ",t.value]}),e.jsx("span",{children:"•"}),e.jsxs("span",{children:["Threshold: ",t.threshold]}),e.jsx("span",{children:"•"}),e.jsx("span",{children:new Date(t.startsAt).toLocaleString()})]}),t.status==="firing"&&B&&e.jsxs("div",{style:{marginTop:"12px",display:"flex",gap:"8px"},children:[e.jsx("button",{onClick:()=>B(t.id),style:{padding:"4px 12px",borderRadius:"4px",border:"none",background:"var(--nice-color-primary, #3b82f6)",color:"var(--nice-text-on-primary, #fff)",cursor:"pointer",fontSize:"11px"},children:"Acknowledge"}),C&&e.jsx("button",{onClick:()=>C(t.id,36e5),style:{padding:"4px 12px",borderRadius:"4px",border:"none",background:"var(--nice-bg-tertiary, #333)",color:"var(--nice-text-primary, #fff)",cursor:"pointer",fontSize:"11px"},children:"Silence 1h"})]})]},t.id)}),L.length===0&&e.jsx("div",{style:{padding:"24px",textAlign:"center",color:"var(--nice-text-muted, #666)"},children:"No alerts"})]})]})})]})},xe=a=>{const{t:y}=i.useNiceTranslation();return a.dashboard?e.jsx(ce,{...a,dashboard:a.dashboard}):e.jsx("div",{className:a.className,style:a.style,"data-testid":a["data-testid"]??a.testId,children:e.jsx(i.NiceEmpty,{title:y("metricsDashboard.noDashboard","No dashboard")})})};exports.NiceLogExplorer=se;exports.NiceMetricsDashboard=xe;
package/dist/index.mjs CHANGED
@@ -37,7 +37,7 @@ const V = {
37
37
  logs: d,
38
38
  streams: b,
39
39
  totalCount: N,
40
- isLoading: g,
40
+ isLoading: h,
41
41
  savedQueries: A,
42
42
  patterns: w = [],
43
43
  onQueryExecute: O,
@@ -49,7 +49,7 @@ const V = {
49
49
  onTailStart: H,
50
50
  onTailStop: q,
51
51
  isTailing: m = !1,
52
- className: h,
52
+ className: g,
53
53
  style: E,
54
54
  testId: G,
55
55
  "data-testid": M
@@ -97,7 +97,7 @@ const V = {
97
97
  return /* @__PURE__ */ t(
98
98
  "div",
99
99
  {
100
- className: `nice-log-explorer ${h || ""}`,
100
+ className: `nice-log-explorer ${g || ""}`,
101
101
  style: {
102
102
  display: "flex",
103
103
  flexDirection: "column",
@@ -158,20 +158,20 @@ const V = {
158
158
  "button",
159
159
  {
160
160
  onClick: k,
161
- disabled: g,
161
+ disabled: h,
162
162
  style: {
163
163
  padding: "10px 24px",
164
164
  borderRadius: "8px",
165
165
  border: "none",
166
166
  background: "var(--nice-color-primary, #3b82f6)",
167
167
  color: "var(--nice-text-on-primary, #fff)",
168
- cursor: g ? "not-allowed" : "pointer",
168
+ cursor: h ? "not-allowed" : "pointer",
169
169
  fontSize: "13px",
170
170
  fontWeight: 500,
171
- opacity: g ? 0.7 : 1
171
+ opacity: h ? 0.7 : 1
172
172
  },
173
173
  children: [
174
- /* @__PURE__ */ e(l, { name: g ? "clock" : "search", size: 14, style: Y }),
174
+ /* @__PURE__ */ e(l, { name: h ? "clock" : "search", size: 14, style: Y }),
175
175
  "Search"
176
176
  ]
177
177
  }
@@ -201,7 +201,7 @@ const V = {
201
201
  borderRadius: "8px",
202
202
  border: "none",
203
203
  background: m ? "var(--nice-color-success, #22c55e)" : "var(--nice-bg-tertiary, #333)",
204
- color: m ? "var(--nice-text-on-primary, #fff)" : "var(--nice-text-primary, #fff)",
204
+ color: m ? "var(--nice-color-white, #fff)" : "var(--nice-text-primary, #fff)",
205
205
  cursor: "pointer",
206
206
  fontSize: "12px"
207
207
  },
@@ -718,7 +718,7 @@ const V = {
718
718
  r.id
719
719
  );
720
720
  }),
721
- c.length === 0 && !g && /* @__PURE__ */ t(
721
+ c.length === 0 && !h && /* @__PURE__ */ t(
722
722
  "div",
723
723
  {
724
724
  style: {
@@ -732,7 +732,7 @@ const V = {
732
732
  ]
733
733
  }
734
734
  ),
735
- g && /* @__PURE__ */ t(
735
+ h && /* @__PURE__ */ t(
736
736
  "div",
737
737
  {
738
738
  style: {
@@ -916,7 +916,7 @@ const V = {
916
916
  dashboard: d,
917
917
  metrics: b = ue,
918
918
  alerts: N = [],
919
- timeRanges: g = xe,
919
+ timeRanges: h = xe,
920
920
  onTimeRangeChange: A,
921
921
  onVariableChange: w,
922
922
  onPanelEdit: O,
@@ -928,7 +928,7 @@ const V = {
928
928
  onQueryExecute: H,
929
929
  onDashboardSave: q,
930
930
  onRefresh: m,
931
- isEditing: h = !1,
931
+ isEditing: g = !1,
932
932
  onEditModeToggle: E,
933
933
  className: G,
934
934
  style: M,
@@ -1266,7 +1266,7 @@ const V = {
1266
1266
  {
1267
1267
  value: d.timeRange.display,
1268
1268
  onChange: (n) => {
1269
- const o = g.find((i) => i.display === n.target.value);
1269
+ const o = h.find((i) => i.display === n.target.value);
1270
1270
  o && A(o);
1271
1271
  },
1272
1272
  style: {
@@ -1277,7 +1277,7 @@ const V = {
1277
1277
  color: "var(--nice-text-primary, #fff)",
1278
1278
  fontSize: "12px"
1279
1279
  },
1280
- children: g.map((n) => /* @__PURE__ */ e("option", { value: n.display, children: n.display }, n.display))
1280
+ children: h.map((n) => /* @__PURE__ */ e("option", { value: n.display, children: n.display }, n.display))
1281
1281
  }
1282
1282
  ),
1283
1283
  /* @__PURE__ */ t(
@@ -1299,7 +1299,7 @@ const V = {
1299
1299
  ]
1300
1300
  }
1301
1301
  ),
1302
- h ? /* @__PURE__ */ t(te, { children: [
1302
+ g ? /* @__PURE__ */ t(te, { children: [
1303
1303
  /* @__PURE__ */ t(
1304
1304
  "button",
1305
1305
  {
@@ -1347,14 +1347,14 @@ const V = {
1347
1347
  padding: "6px 12px",
1348
1348
  borderRadius: "4px",
1349
1349
  border: "none",
1350
- background: h ? "var(--nice-color-warning, #f59e0b)" : "var(--nice-bg-tertiary, #333)",
1351
- color: h ? "var(--nice-text-on-primary, #fff)" : "var(--nice-text-primary, #fff)",
1350
+ background: g ? "var(--nice-color-warning, #f59e0b)" : "var(--nice-bg-tertiary, #333)",
1351
+ color: g ? "var(--nice-color-white, #fff)" : "var(--nice-text-primary, #fff)",
1352
1352
  cursor: "pointer",
1353
1353
  fontSize: "12px"
1354
1354
  },
1355
1355
  children: [
1356
- /* @__PURE__ */ e(l, { name: h ? "check" : "edit", size: 14, style: F }),
1357
- h ? "Done" : "Edit"
1356
+ /* @__PURE__ */ e(l, { name: g ? "check" : "edit", size: 14, style: F }),
1357
+ g ? "Done" : "Edit"
1358
1358
  ]
1359
1359
  }
1360
1360
  )
@@ -1448,7 +1448,7 @@ const V = {
1448
1448
  },
1449
1449
  children: [
1450
1450
  /* @__PURE__ */ e("span", { style: { flex: 1, fontSize: "12px", fontWeight: 500 }, children: n.title }),
1451
- h && /* @__PURE__ */ t(te, { children: [
1451
+ g && /* @__PURE__ */ t(te, { children: [
1452
1452
  /* @__PURE__ */ e(
1453
1453
  "button",
1454
1454
  {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@nice2dev/ui-monitoring",
3
- "version": "1.1.9",
3
+ "version": "1.2.0",
4
4
  "description": "Nice2Dev UI Monitoring - Observability React components: MetricsDashboard (Grafana-style), LogExplorer (Loki-style)",
5
5
  "type": "module",
6
6
  "sideEffects": [
@@ -36,7 +36,7 @@
36
36
  "react-dom": ">=17.0.0"
37
37
  },
38
38
  "devDependencies": {
39
- "@nice2dev/ui": "^1.1.9",
39
+ "@nice2dev/ui": "^1.2.0",
40
40
  "@testing-library/react": "^16.3.3",
41
41
  "@types/react": "^19.2.18",
42
42
  "@types/react-dom": "^19.2.7",