vue-data-ui-hq
Version:
A user-empowering data visualization Vue 3 components library for eloquent data storytelling
2 lines (1 loc) • 8.48 kB
JavaScript
Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),a=require("./index-ZfICPrrM.cjs"),$=require("./useNestedProp-C14rfl0j.cjs"),w=require("./usePrinter-B-gh2f22.cjs"),q=require("./Shape-C3YtaYr4.cjs"),G=require("./useUserOptionState-BgepsfED.cjs"),H=require("./_plugin-vue_export-helper-BHFhmbuH.cjs"),L=["id"],A={role:"cell"},D={role:"row"},X=["data-cell"],W={key:0,style:{display:"flex","flex-direction":"row",gap:"2px","align-items":"center"}},J=["height","width"],K={key:0,role:"cell","data-cell":"sum"},Q={key:1,role:"cell","data-cell":"average"},Y={key:2,role:"cell","data-cell":"median"},Z={key:1,ref:"source",dir:"auto"},j={__name:"vue-ui-table-heatmap",props:{config:{type:Object,default(){return{}}},dataset:{type:Array,default(){return[]}}},setup(N,{expose:P}){e.useCssVars(t=>({"2473e67e":e.unref(T),"27aaf659":e.unref(R)}));const{vue_ui_table_heatmap:E}=a.useConfig(),d=N,p=e.ref(a.createUid()),l=e.ref(!1),c=e.ref(null),f=e.ref(!1),v=e.ref(0),V=e.useSlots();e.onMounted(()=>{V["chart-background"]&&console.warn("VueUiTableHeatmap does not support the #chart-background slot.")});const n=e.computed({get:()=>y(),set:t=>t}),{userOptionsVisible:m,setUserOptionsVisibility:g,keepUserOptionState:h}=G.useUserOptionState({config:n.value});function y(){const t=$.useNestedProp({userConfig:d.config,defaultConfig:E});return t.theme?{...$.useNestedProp({userConfig:a.themes.vue_ui_table_heatmap[t.theme]||d.config,defaultConfig:t})}:t}e.watch(()=>d.config,t=>{n.value=y(),m.value=!n.value.showOnChartHover,C()},{deep:!0});const{isPrinting:x,isImaging:O,generatePdf:k,generateImage:b}=w.usePrinter({elementId:`table_heatmap_${p.value}`,fileName:"vue-ui-table-heatmap"}),F=e.computed(()=>n.value.table.responsiveBreakpoint),z=e.computed(()=>!!d.dataset&&d.dataset.length);e.onMounted(()=>{C()});function C(){a.objectIsEmpty(d.dataset)&&a.error({componentName:"VueUiTableHeatmap",type:"dataset"});const t=new ResizeObserver(r=>{r.forEach(o=>{l.value=o.contentRect.width<F.value})});c.value&&t.observe(c.value)}const _=e.computed(()=>d.dataset.map(t=>{const r=t.values.map(s=>isNaN(s)?0:s),o=r.reduce((s,i)=>s+i,0);return{...t,values:r,serieExtremes:{max:Math.max(...r),min:Math.min(...r)},sum:o,average:o/r.length,median:a.calcMedian(r),displayValues:[t.name,...t.values],id:a.createUid()}})),B=e.computed(()=>{const t=_.value.flatMap(r=>r.values);return{min:Math.min(...t),max:Math.max(...t)}});function M(t,r){const o=n.value.style.heatmapColors.useIndividualScale;return a.interpolateColorHex(n.value.style.heatmapColors.min,n.value.style.heatmapColors.max,o?r.min:B.value.min,o?r.max:B.value.max,t)}const I=e.computed(()=>_.value.map(t=>({...t,colors:t.displayValues.map(r=>isNaN(r)?n.value.style.backgroundColor:M(r,t.serieExtremes))}))),R=e.computed(()=>n.value.style.backgroundColor),T=e.computed(()=>`${n.value.table.borderWidth}px`);function S(){e.nextTick(()=>{const t=I.value.map(s=>[[s.name],s.displayValues,[s.sum],[s.average],[s.median]]),r=[[[""],n.value.table.head.values,["sum"],["average"],["median"]]].concat(t),o=a.createCsvContent(r);a.downloadCsv({csvContent:o,title:"vue-ui-table-heatmap"})})}function U(t){f.value=t,v.value+=1}return P({generatePdf:k,generateCsv:S,generateImage:b}),(t,r)=>(e.openBlock(),e.createElementBlock("div",{ref_key:"tableContainer",ref:c,style:e.normalizeStyle(`width:100%; overflow-x:auto; container-type: inline-size;padding-top:${e.unref(n).userOptions.show?"36px":""}; ${e.unref(f)?"vue-data-ui-wrapper-fullscreen":""}; position:relative;`),class:e.normalizeClass({"vue-ui-responsive":e.unref(l)}),id:`table_heatmap_${e.unref(p)}`,onMouseenter:r[0]||(r[0]=()=>e.unref(g)(!0)),onMouseleave:r[1]||(r[1]=()=>e.unref(g)(!1))},[e.unref(n).userOptions.show&&e.unref(z)&&(e.unref(h)||e.unref(m))?(e.openBlock(),e.createBlock(w.UserOptions,{ref:"details",key:`user_option_${e.unref(v)}`,backgroundColor:e.unref(n).style.backgroundColor,color:e.unref(n).style.color,isPrinting:e.unref(x),isImaging:e.unref(O),uid:e.unref(p),hasPdf:e.unref(n).userOptions.buttons.pdf,hasXls:e.unref(n).userOptions.buttons.csv,hasImg:e.unref(n).userOptions.buttons.img,hasFullscreen:e.unref(n).userOptions.buttons.fullscreen,isFullscreen:e.unref(f),titles:{...e.unref(n).userOptions.buttonTitles},chartElement:e.unref(c),position:e.unref(n).userOptions.position,onToggleFullscreen:U,onGeneratePdf:e.unref(k),onGenerateCsv:S,onGenerateImage:e.unref(b),style:e.normalizeStyle({visibility:e.unref(h)?e.unref(m)?"visible":"hidden":"visible"})},e.createSlots({_:2},[t.$slots.optionPdf?{name:"optionPdf",fn:e.withCtx(()=>[e.renderSlot(t.$slots,"optionPdf",{},void 0,!0)]),key:"0"}:void 0,t.$slots.optionCsv?{name:"optionCsv",fn:e.withCtx(()=>[e.renderSlot(t.$slots,"optionCsv",{},void 0,!0)]),key:"1"}:void 0,t.$slots.optionImg?{name:"optionImg",fn:e.withCtx(()=>[e.renderSlot(t.$slots,"optionImg",{},void 0,!0)]),key:"2"}:void 0,t.$slots.optionFullscreen?{name:"optionFullscreen",fn:e.withCtx(({toggleFullscreen:o,isFullscreen:s})=>[e.renderSlot(t.$slots,"optionFullscreen",e.normalizeProps(e.guardReactiveProps({toggleFullscreen:o,isFullscreen:s})),void 0,!0)]),key:"3"}:void 0]),1032,["backgroundColor","color","isPrinting","isImaging","uid","hasPdf","hasXls","hasImg","hasFullscreen","isFullscreen","titles","chartElement","position","onGeneratePdf","onGenerateImage","style"])):e.createCommentVNode("",!0),e.createElementVNode("table",{class:e.normalizeClass({"vue-ui-table-heatmap":!0}),style:e.normalizeStyle(`width:100%;font-family:${e.unref(n).style.fontFamily};background:${e.unref(n).style.backgroundColor};`)},[e.createElementVNode("caption",null,[e.renderSlot(t.$slots,"caption",{},void 0,!0)]),e.createElementVNode("thead",null,[e.createElementVNode("tr",{role:"row",style:e.normalizeStyle(`background:${e.unref(n).table.head.backgroundColor};color:${e.unref(n).table.head.color}`)},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(n).table.head.values,(o,s)=>(e.openBlock(),e.createElementBlock("th",A,[e.renderSlot(t.$slots,"head",e.mergeProps({ref_for:!0},{value:o,rowIndex:s,type:typeof o,isResponsive:e.unref(l)}),void 0,!0)]))),256))],4)]),e.createElementVNode("tbody",null,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(e.unref(I),(o,s)=>(e.openBlock(),e.createElementBlock("tr",D,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(o.displayValues,(i,u)=>(e.openBlock(),e.createElementBlock("td",{role:"cell","data-cell":e.unref(n).table.head.values[u]},[o.color&&u===0?(e.openBlock(),e.createElementBlock("div",W,[o.color?(e.openBlock(),e.createElementBlock("svg",{key:0,height:e.unref(n).style.shapeSize,width:e.unref(n).style.shapeSize,viewBox:"0 0 20 20",style:{background:"none",overflow:"visible"}},[e.createVNode(q._sfc_main,{plot:{x:10,y:10},color:o.color,radius:9,shape:o.shape||"circle"},null,8,["color","shape"])],8,J)):e.createCommentVNode("",!0),e.renderSlot(t.$slots,"rowTitle",e.mergeProps({ref_for:!0},{value:i,rowIndex:s,colIndex:u,type:typeof i,isResponsive:e.unref(l)}),void 0,!0)])):(e.openBlock(),e.createElementBlock(e.Fragment,{key:1},[u===0?e.renderSlot(t.$slots,"rowTitle",e.mergeProps({key:0,ref_for:!0},{value:i,rowIndex:s,colIndex:u,type:typeof i,isResponsive:e.unref(l)}),void 0,!0):e.createCommentVNode("",!0),u>0?e.renderSlot(t.$slots,"cell",e.mergeProps({key:1,ref_for:!0},{value:i,rowIndex:s,colIndex:u,type:typeof i,isResponsive:e.unref(l),color:o.colors[u],textColor:e.unref(a.adaptColorToBackground)(o.colors[u])}),void 0,!0):e.createCommentVNode("",!0)],64))],8,X))),256)),e.unref(n).table.showSum?(e.openBlock(),e.createElementBlock("td",K,[e.renderSlot(t.$slots,"sum",e.mergeProps({ref_for:!0},{value:o.sum,rowIndex:s,isResponsive:e.unref(l)}),void 0,!0)])):e.createCommentVNode("",!0),e.unref(n).table.showAverage?(e.openBlock(),e.createElementBlock("td",Q,[e.renderSlot(t.$slots,"average",e.mergeProps({ref_for:!0},{value:o.average,rowIndex:s,isResponsive:e.unref(l)}),void 0,!0)])):e.createCommentVNode("",!0),e.unref(n).table.showMedian?(e.openBlock(),e.createElementBlock("td",Y,[e.renderSlot(t.$slots,"median",e.mergeProps({ref_for:!0},{value:o.median,rowIndex:s,isResponsive:e.unref(l)}),void 0,!0)])):e.createCommentVNode("",!0)]))),256))])],4),t.$slots.source?(e.openBlock(),e.createElementBlock("div",Z,[e.renderSlot(t.$slots,"source",{},void 0,!0)],512)):e.createCommentVNode("",!0)],46,L))}},ee=H._export_sfc(j,[["__scopeId","data-v-8c5d9edd"]]);exports.default=ee;
;