object-visualizer/dist/object-visualizer.umd.cjs

Visualize JSON object to DOM.

(function(m,e){typeof exports=="object"&&typeof module<"u"?e(exports,require("vue")):typeof define=="function"&&define.amd?define(["exports","vue"],e):(m=typeof globalThis<"u"?globalThis:m||self,e(m.ObjectVisualizer={},m.Vue))})(this,function(m,e){"use strict";const C=["role","aria-level"],x={class:"key"},E={key:0,class:"separator"},S=e.createElementVNode("span",{class:"value"},"null",-1),$=e.defineComponent({inheritAttrs:!1}),N=e.defineComponent({...$,__name:"NullWrapper",props:{data:null,name:null,role:null,ariaLevel:null},setup(a){return(n,l)=>(e.openBlock(),e.createElementBlock("span",{class:"null",role:a.role,"aria-level":a.ariaLevel},[e.createElementVNode("span",x,e.toDisplayString(a.name),1),a.name!==""?(e.openBlock(),e.createElementBlock("span",E,":\xA0")):e.createCommentVNode("",!0),S],8,C))}}),A=["role","aria-level"],V={class:"key"},O={key:0,class:"separator"},L=e.createElementVNode("span",{class:"value"},"true",-1),K=e.defineComponent({inheritAttrs:!1}),b=e.defineComponent({...K,__name:"TrueWrapper",props:{data:{type:Boolean},name:null,role:null,ariaLevel:null},setup(a){return(n,l)=>(e.openBlock(),e.createElementBlock("span",{class:"true",role:a.role,"aria-level":a.ariaLevel},[e.createElementVNode("span",V,e.toDisplayString(a.name),1),a.name!==""?(e.openBlock(),e.createElementBlock("span",O,":\xA0")):e.createCommentVNode("",!0),L],8,A))}}),w=["role","aria-level"],U={class:"key"},D={key:0,class:"separator"},W=e.createElementVNode("span",{class:"value"},"false",-1),_=e.defineComponent({inheritAttrs:!1}),j=e.defineComponent({..._,__name:"FalseWrapper",props:{data:{type:Boolean},name:null,role:null,ariaLevel:null},setup(a){return(n,l)=>(e.openBlock(),e.createElementBlock("span",{class:"false",role:a.role,"aria-level":a.ariaLevel},[e.createElementVNode("span",U,e.toDisplayString(a.name),1),a.name!==""?(e.openBlock(),e.createElementBlock("span",D,":\xA0")):e.createCommentVNode("",!0),W],8,w))}}),F=["role","aria-level"],q={class:"key"},T={key:0,class:"separator"},z={class:"value"},M=e.defineComponent({inheritAttrs:!1}),P=e.defineComponent({...M,__name:"NumberWrapper",props:{data:null,name:null,role:null,ariaLevel:null},setup(a){return(n,l)=>(e.openBlock(),e.createElementBlock("span",{class:"number",role:a.role,"aria-level":a.ariaLevel},[e.createElementVNode("span",q,e.toDisplayString(a.name),1),a.name!==""?(e.openBlock(),e.createElementBlock("span",T,":\xA0")):e.createCommentVNode("",!0),e.createElementVNode("span",z,e.toDisplayString(a.data),1)],8,F))}}),J=["role","aria-level"],G={class:"key"},H={key:0,class:"separator"},I=e.createElementVNode("span",{class:"quotes"},'"',-1),Q={class:"value"},R=e.createElementVNode("span",{class:"quotes"},'"',-1),X=e.defineComponent({inheritAttrs:!1}),Y=e.defineComponent({...X,__name:"StringWrapper",props:{data:null,name:null,role:null,ariaLevel:null},setup(a){return(n,l)=>(e.openBlock(),e.createElementBlock("span",{class:"string",role:a.role,"aria-level":a.ariaLevel},[e.createElementVNode("span",G,e.toDisplayString(a.name),1),a.name!==""?(e.openBlock(),e.createElementBlock("span",H,":\xA0")):e.createCommentVNode("",!0),I,e.createElementVNode("span",Q,e.toDisplayString(JSON.stringify(a.data).slice(1,-1)),1),R],8,J))}}),k=new Set;function u(a){const n=e.ref(!1),l=()=>{n.value=!n.value},s=e.ref(!1),c=()=>{n.value=!1,s.value=!s.value};e.watch(()=>a.collapseSignal,c);const t=e.ref(!1),p=()=>{n.value=!0,t.value=!t.value};e.watch(()=>a.expandSignal,p);const g=f=>{k.clear(),f.metaKey===!0&&f.shiftKey===!0?c():f.metaKey===!0?p():l()};return e.watch(()=>a.data,()=>{a.expandOnCreatedAndUpdated(a.path)?p():c()},{immediate:!0}),{isExpanding:n,innerCollapseSignal:s,innerExpandSignal:t,handleClick:g}}const Z=["role","aria-expanded","aria-level"],v={key:0,class:"value"},ee={key:0,class:"value"},ae=e.defineComponent({inheritAttrs:!1,components:{}}),B=e.defineComponent({...ae,__name:"ArrayWrapper",props:{path:null,data:null,name:null,expandOnCreatedAndUpdated:null,getKeys:null,role:null,ariaLevel:null,collapseSignal:{type:Boolean,default:!1},expandSignal:{type:Boolean,default:!1}},setup(a){const n=a,{isExpanding:l,innerExpandSignal:s,innerCollapseSignal:c,handleClick:t}=u(n),p=e.computed(()=>n.getKeys(n.data,n.path)),g=i=>n.data[i],f=k.has(n.data);return k.add(n.data),(i,d)=>{const r=e.resolveComponent("wrapper");return e.openBlock(),e.createElementBlock("span",{class:"array",role:a.role,"aria-expanded":e.unref(l),"aria-level":a.ariaLevel,onClick:d[5]||(d[5]=e.withModifiers((...o)=>e.unref(t)&&e.unref(t)(...o),["self"]))},[e.createElementVNode("span",{class:"indicator",onClick:d[0]||(d[0]=(...o)=>e.unref(t)&&e.unref(t)(...o))},e.toDisplayString(e.unref(l)?"\u25BC":"\u25B6"),1),e.createElementVNode("span",{class:"key",onClick:d[1]||(d[1]=(...o)=>e.unref(t)&&e.unref(t)(...o))},e.toDisplayString(a.name===""?"":a.name),1),e.createElementVNode("span",{class:"separator",onClick:d[2]||(d[2]=(...o)=>e.unref(t)&&e.unref(t)(...o))},e.toDisplayString(a.name===""?"":": "),1),e.createElementVNode("span",{class:"count",onClick:d[3]||(d[3]=(...o)=>e.unref(t)&&e.unref(t)(...o))},e.toDisplayString(e.unref(l)===!1&&a.data.length>=2?"("+a.data.length+")":""),1),e.createElementVNode("span",{class:"preview",onClick:d[4]||(d[4]=(...o)=>e.unref(t)&&e.unref(t)(...o))},e.toDisplayString(e.unref(l)?"Array("+a.data.length+")":"[...]"),1),e.unref(f)?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.unref(l)?(e.openBlock(),e.createElementBlock("span",v,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(p),o=>(e.openBlock(),e.createBlock(r,{key:o,name:o,path:[...a.path,o],data:g(o),"expand-signal":e.unref(s),"collapse-signal":e.unref(c),expandOnCreatedAndUpdated:()=>!1,getKeys:a.getKeys,"aria-level":a.ariaLevel},null,8,["name","path","data","expand-signal","collapse-signal","expandOnCreatedAndUpdated","getKeys","aria-level"]))),128))])):e.createCommentVNode("",!0)],64)):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[e.unref(l)?(e.openBlock(),e.createElementBlock("span",ee,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(p),o=>(e.openBlock(),e.createBlock(r,{key:o,name:o,path:[...a.path,o],data:g(o),"expand-signal":e.unref(s),"collapse-signal":e.unref(c),expandOnCreatedAndUpdated:a.expandOnCreatedAndUpdated,getKeys:a.getKeys,"aria-level":a.ariaLevel},null,8,["name","path","data","expand-signal","collapse-signal","expandOnCreatedAndUpdated","getKeys","aria-level"]))),128))])):e.createCommentVNode("",!0)],64))],8,Z)}}}),ne=["role","aria-expanded","aria-level"],te={key:0,class:"value"},le={key:1,class:"value"},re=e.defineComponent({inheritAttrs:!1,components:{}}),h=e.defineComponent({...re,__name:"ObjectWrapper",props:{path:null,data:null,name:null,expandOnCreatedAndUpdated:null,getKeys:null,role:null,ariaLevel:null,collapseSignal:{type:Boolean,default:!1},expandSignal:{type:Boolean,default:!1}},setup(a){const n=a,{isExpanding:l,innerExpandSignal:s,innerCollapseSignal:c,handleClick:t}=u(n),p=e.computed(()=>n.getKeys(n.data,n.path)),g=k.has(n.data);return k.add(n.data),(f,i)=>{const d=e.resolveComponent("wrapper");return e.openBlock(),e.createElementBlock("span",{class:"object",role:a.role,"aria-expanded":e.unref(l),"aria-level":a.ariaLevel,onClick:i[4]||(i[4]=e.withModifiers((...r)=>e.unref(t)&&e.unref(t)(...r),["self"]))},[e.createElementVNode("span",{class:"indicator",onClick:i[0]||(i[0]=(...r)=>e.unref(t)&&e.unref(t)(...r))},e.toDisplayString(e.unref(l)?"\u25BC":"\u25B6"),1),e.createElementVNode("span",{class:"key",onClick:i[1]||(i[1]=(...r)=>e.unref(t)&&e.unref(t)(...r))},e.toDisplayString(a.name===""?"":a.name),1),e.createElementVNode("span",{class:"separator",onClick:i[2]||(i[2]=(...r)=>e.unref(t)&&e.unref(t)(...r))},e.toDisplayString(a.name===""?"":": "),1),e.createElementVNode("span",{class:"preview",onClick:i[3]||(i[3]=(...r)=>e.unref(t)&&e.unref(t)(...r))},e.toDisplayString(e.unref(l)?"":"{...}"),1),e.unref(g)?(e.openBlock(),e.createElementBlock(e.Fragment,{key:0},[e.unref(l)?(e.openBlock(),e.createElementBlock("span",te,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(p),r=>(e.openBlock(),e.createBlock(d,{key:r,class:"value",name:r,path:[...a.path,r],data:a.data[r],"expand-signal":e.unref(s),"collapse-signal":e.unref(c),expandOnCreatedAndUpdated:()=>!1,getKeys:a.getKeys,"aria-level":a.ariaLevel},null,8,["name","path","data","expand-signal","collapse-signal","expandOnCreatedAndUpdated","getKeys","aria-level"]))),128))])):e.createCommentVNode("",!0)],64)):e.withDirectives((e.openBlock(),e.createElementBlock("span",le,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(p),r=>(e.openBlock(),e.createBlock(d,{key:r,class:"value",name:r,path:[...a.path,r],data:a.data[r],"expand-signal":e.unref(s),"collapse-signal":e.unref(c),expandOnCreatedAndUpdated:a.expandOnCreatedAndUpdated,getKeys:a.getKeys,"aria-level":a.ariaLevel},null,8,["name","path","data","expand-signal","collapse-signal","expandOnCreatedAndUpdated","getKeys","aria-level"]))),128))],512)),[[e.vShow,e.unref(l)]])],8,ne)}}}),oe=a=>Object.prototype.toString.call(a).slice(8,-1),y=e.defineComponent({inheritAttrs:!1,props:{path:{required:!0,type:Array},data:{required:!0},name:{required:!0,type:String},collapseSignal:{default:!1,type:Boolean},expandSignal:{default:!1,type:Boolean},expandOnCreatedAndUpdated:{required:!0,type:Function},getKeys:{required:!0,type:Function},ariaLevel:{required:!0,type:Number}},setup(a){const n=e.computed(()=>oe(a.data)),l=e.computed(()=>{switch(n.value){case"Null":return"null-wrapper";case"Boolean":return a.data?"true-wrapper":"false-wrapper";case"Number":return"number-wrapper";case"String":return"string-wrapper";case"Array":return"array-wrapper";case"Object":return"object-wrapper"}}),s=e.computed(()=>a.ariaLevel===0?n.value==="Array"||n.value==="Object"?"tree":void 0:n.value==="Array"||n.value==="Object"?"group":"treeitem"),c=e.computed(()=>{const t={};return s.value!==void 0&&(t.role=s.value,t.ariaLevel=a.ariaLevel+1),t});return{is:l,role:s,attrs:c}},components:{NullWrapper:N,TrueWrapper:b,FalseWrapper:j,NumberWrapper:P,StringWrapper:Y,ArrayWrapper:B,ObjectWrapper:h}});B.components.Wrapper=y,h.components.Wrapper=y;const se=(a,n)=>{const l=a.__vccOpts||a;for(const[s,c]of n)l[s]=c;return l};function de(a,n,l,s,c,t){return e.openBlock(),e.createBlock(e.resolveDynamicComponent(a.is),e.mergeProps({name:a.name,path:a.path,data:a.data,"collapse-signal":a.collapseSignal,"expand-signal":a.expandSignal,expandOnCreatedAndUpdated:a.expandOnCreatedAndUpdated,getKeys:a.getKeys,class:a.ariaLevel===0?"object-visualizer":void 0},a.attrs),null,16,["name","path","data","collapse-signal","expand-signal","expandOnCreatedAndUpdated","getKeys","class"])}const ce=se(y,[["render",de]]),ie={class:"object-visualizer"},pe=e.defineComponent({__name:"ObjectVisualizer",props:{data:null,rootName:{default:""},expandOnCreatedAndUpdated:{type:Function,default:()=>!1},getKeys:{type:Function,default:(a,n)=>Object.keys(a)}},setup(a){return(n,l)=>(e.openBlock(),e.createElementBlock("section",ie,[e.createVNode(ce,{data:a.data,name:a.rootName,"expand-on-created-and-updated":a.expandOnCreatedAndUpdated,"get-keys":a.getKeys,path:[],"aria-level":0},null,8,["data","name","expand-on-created-and-updated","get-keys"])]))}});m.ObjectVisualizer=pe,Object.defineProperties(m,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});