@runeya/runeya/public/assets/json-tree-view-vue3.es-BsglhTJu.js

Monitor processes as a stack

import{a3 as D,c as x,s as O,o as d,n as V,a6 as E,l as T,a as k,g as j,b as f,d as B,t as g,a1 as N,F as _,q as K,p as J,u as R}from"./index-CXxIspfv.js";const A=t=>({is:()=>A(t),default:()=>t}),w=t=>({is:(s,o)=>s(t)?A(o()):w(t),default:s=>s()}),I=t=>({is:(s,o)=>s(t)?A(o()):w(t)}),S=t=>()=>t,L={class:"json-view-item"},U={key:0},Y=["aria-expanded"],z={class:"properties"},F={key:0},q=["role","tabindex"],M={class:"value-key"};var b=(t=>(t[t.OBJECT=0]="OBJECT",t[t.ARRAY=1]="ARRAY",t[t.VALUE=2]="VALUE",t))(b||{});const G=D({name:"JsonTreeViewItem",__name:"JsonTreeViewItem",props:{data:{},maxDepth:{default:1},canSelect:{type:Boolean,default:!1}},emits:["selected"],setup(t,{emit:s}){const o=t,u=s,r=E({open:o.data.depth<o.maxDepth}),m=()=>{r.open=!r.open},y=e=>u("selected",{key:e.key,value:e.value,path:e.path}),n=e=>u("selected",e),c=e=>{const a=Number(e.key);return isNaN(a)?`"${e.key}":`:`${e.key}":`},p=e=>I(typeof e).is(a=>a==="string",S("var(--jtv-string-color)")).is(a=>a==="number",S("var(--jtv-number-color)")).is(a=>a==="boolean",S("var(--jtv-boolean-color)")).is(a=>a==="object",S("var(--jtv-null-color)")).default(S("var(--jtv-valueKey-color)")),l=x(()=>({"chevron-arrow":!0,opened:r.open})),v=x(()=>({"value-key":!0,"can-select":o.canSelect})),$=x(()=>{const e=o.data.length;return o.data.type===1?e===1?`${e} element`:`${e} elements`:e===1?`${e} property`:`${e} properties`}),i=x(()=>JSON.stringify(o.data.value));return(e,a)=>{const C=T("JsonTreeViewItem",!0);return d(),k("div",L,[e.data.type===0||e.data.type===1?(d(),k("div",U,[f("button",{class:"data-key","aria-expanded":r.open?"true":"false",onClick:N(m,["stop"])},[f("div",{class:V(l.value)},null,2),B(" "+g(e.data.key)+": ",1),f("span",z,g($.value),1)],8,Y),r.open?(d(),k("div",F,[(d(!0),k(_,null,K(e.data.children,h=>(d(),O(C,{key:c(h),data:h,maxDepth:e.maxDepth,canSelect:e.canSelect,onSelected:n},null,8,["data","maxDepth","canSelect"]))),128))])):j("",!0)])):j("",!0),e.data.type===2?(d(),k("div",{key:1,class:V(v.value),role:e.canSelect?"button":void 0,tabindex:e.canSelect?"0":void 0,onClick:a[0]||(a[0]=h=>y(e.data)),onKeyup:[a[1]||(a[1]=J(h=>y(e.data),["enter"])),a[2]||(a[2]=J(h=>y(e.data),["space"]))]},[f("span",M,g(e.data.key)+":",1),f("span",{style:R({color:p(e.data.value)})},g(i.value),5)],42,q)):j("",!0)])}}}),H=D({name:"JsonTreeView",__name:"JsonTreeView",props:{json:{},rootKey:{default:"/"},maxDepth:{default:1},colorScheme:{default:"light"}},emits:["selected"],setup(t,{emit:s}){const o=t,u=s,r=n=>u("selected",n),m=(n,c,p,l,v)=>{if(c instanceof Object){if(c instanceof Array){const i=c.map((e,a)=>m(a.toString(),e,p+1,v?`${l}${n}[${a}].`:`${l}`,!1));return{key:n,type:b.ARRAY,depth:p,path:l,length:i.length,children:i}}const $=Object.entries(c).map(([i,e])=>m(i,e,p+1,v?`${l}${n}.`:`${l}`,!0));return{key:n,type:b.OBJECT,depth:p,path:l,length:$.length,children:$}}else return{key:n,type:b.VALUE,path:v?`${l}${n}`:l.slice(0,-1),depth:p,value:c}},y=x(()=>{const n=JSON.parse(o.json);return n instanceof Object?m(o.rootKey,{...n},0,"",!0):{key:o.rootKey,type:b.VALUE,path:"",depth:0,value:o.json}});return(n,c)=>(d(),O(G,{class:V([{"root-item":!0,dark:n.colorScheme==="dark"}]),data:y.value,maxDepth:n.maxDepth,onSelected:r},null,8,["class","data","maxDepth"]))}}),P=(t,s)=>{const o=t.__vccOpts||t;for(const[u,r]of s)o[u]=r;return o},Q=P(H,[["__scopeId","data-v-f85384eb"]]);export{Q as W};