@nebula.js/sn-funnel-chart 1.5.2 → 1.6.0

package/dist/sn-funnel-chart.systemjs.js

@@ -1,7 +1,7 @@
 /*
-* @nebula.js/sn-funnel-chart v1.5.2
+* @nebula.js/sn-funnel-chart v1.6.0
 * Copyright (c) 2023 QlikTech International AB
 * Released under the MIT license.
 */
 
-System.register(["picasso.js","picasso-plugin-q","@nebula.js/stardust","qlik-chart-modules"],(function(e){"use strict";var t,n,o,a,s,i,l,r,u,c,d,h,m,f,p,g,b,y,v,x,R,M;return{setters:[function(e){t=e.default},function(e){n=e.default},function(e){o=e.useElement,a=e.useSelections,s=e.useModel,i=e.useApp,l=e.useTranslator,r=e.useOptions,u=e.useState,c=e.useEffect,d=e.useStaleLayout,h=e.useTheme,m=e.useConstraints,f=e.useRect,p=e.usePlugins,g=e.useAppLayout,b=e.usePromise,y=e.onTakeSnapshot},function(e){v=e.colorService,x=e.selectionService,R=e.cache,M=e.pluginService}],execute:function(){e("default",(function(e){const o=t();o.use(n),o.component("funnel",H);const{flags:a}=e;return{ext:T,qae:{properties:{initial:$},data:{targets:A}},component(){!function({picasso:e,flags:t}){const n=d(),o=h(),a=m(),s=f(),i=p(),l=g().qLocaleInfo,[u,v,x,R]=_({picasso:e,layout:n}),C=r(),D=()=>{const e=u.element.clientWidth!==R.get("width")||u.element.clientHeight!==R.get("height");return!1!==C.chartAnimations&&t.isEnabled("IM_1355_ANIMATIONS_FUNNEL")&&!a.active&&!e},[L]=b((()=>{if(!v)return Promise.resolve();const t=({getUseBaseColors:e})=>({theme:o,colorProps:{...n.color,useBaseColors:e(n)},layout:n,hc:n.qHyperCube}),a=function(e){return{layout:e,keys:{SCALE:{FILL:"fill"},COMPONENT:{FUNNEL:"fun",FUNNEL_LABELS:"funnel-labels",DIMENSION_TITLE:"dimension-title"}}}}(n),s=M({picassoInstance:e,plugins:i,pluginArgs:a});return Promise.all([v.initialize({createConfig:t}),s.initialize()]).then((()=>s))}),[n,v]);c((()=>{if(!u||!v||!L)return;const e=[{type:"q",key:"qHyperCube",data:n.qHyperCube,config:{localeInfo:l}},...v.getData()],t=function({layout:e,constraints:t,colorService:n,theme:o,pluginService:a,animationsEnabled:s}){const i=function(e){return{...e.getScales()}}(n),l=n.getPalettes(),r=[F({layout:e,constraints:t,colorService:n,animationsEnabled:s}),W(e,o,s),V(e)];return{palettes:l,style:{"$font-family":o.getStyle("","","fontFamily"),"$font-color":o.getStyle("","","color"),"$font-size":o.getStyle("","","fontSize")},scales:i,components:a.extendComponents(r),formatters:B()}}({layout:n,constraints:a,colorService:v,theme:o,pluginService:L,animationsEnabled:D});u.update({data:e,settings:t}),R.set("width",u.element.clientWidth),R.set("height",u.element.clientHeight)}),[u,v,o.name(),L,a]),c((()=>{u&&(u.update(),R.set("width",u.element.clientWidth),R.set("height",u.element.clientHeight))}),[s.width,s.height]),c((()=>{x&&x.setLayout(n)}),[n]),y((e=>v.getSnapshotData().then((t=>(e.snapshotData=e.snapshotData||{},e.snapshotData.content=e.snapshotData.content||{},e.snapshotData.content.chartData=t,e))).catch((()=>e))))}({picasso:o,flags:a})}}}));const C={fill:"steelblue",num:1},D=.9,L=150,S=(e,t,n)=>{let o=0,a=0,s=0,i={},l=0;if("labelCenter"===e)o=t.bottomLeft.x,a=t.topRight.y,s=t.bottomRight.x-t.bottomLeft.x,l=t.bottomRight.y-t.topRight.y,i={share:n.share,fill:n.fill};else{const e=180/Math.PI*Math.atan((t.bottomRight.y-t.topRight.y)/(t.topRight.x-t.bottomRight.x));o=e<15&&e>=0?t.topRight.x:e>-15&&e<0?t.bottomRight.x:e<-15?(t.bottomRight.x-t.topRight.x)/2+t.topRight.x+15:(t.topRight.x-t.bottomRight.x)/2+t.bottomRight.x+15,a=t.topRight.y,s=t.width-o,l=t.bottomRight.y-t.topRight.y,i={fill:n.fill}}return{tag:e,type:"rect",x:o,y:a,width:s,height:l,data:n.data,desc:i,fill:"none"}},q=(e,t)=>{const n=(e=>{const t=(e=>{let t=0;return e.forEach((e=>{e.num>t&&(t=e.num)})),t})(e);let n=0;return e.slice().reverse().map((e=>{const o={datum:e,s:n/t,e:e.num/t};return n=e.num,o})).reverse()})(e),o=t.width*D,a=t.height*D,s=(t.width-o)/2,i=(t.height-a)/2,l=o-(o>L&&a>L?100:0),r=(a-1*(n.length-1))/n.length,u=[];return n.forEach(((e,o)=>{const a=(c=e.e,d=o<n.length-1?e.s:e.e,[.5-.5*c,.5+.5*c,.5+.5*d,.5-.5*d]).map((e=>Math.round(e*l+s)));var c,d;const h=r*o+1*o+i,m={bottomRight:{x:a[2],y:Math.round(h+r)},bottomLeft:{x:a[3],y:Math.round(h+r)},topRight:{x:a[1],y:Math.round(h)},topLeft:{x:a[0],y:Math.round(h)},width:t.width},f=`M${m.topLeft.x},${m.topLeft.y} L${m.topRight.x},${m.topRight.y} ${m.bottomRight.x},${m.bottomRight.y} ${m.bottomLeft.x},${m.bottomLeft.y}Z`;u.push({tag:"section",type:"path",d:f,data:e.datum.data,fill:e.datum.fill});const p={share:e.e,fill:e.datum.fill,data:e.datum.data};r>12&&(m.bottomRight.x-m.bottomLeft.x>32&&u.push(S("labelCenter",m,p)),u.push(S("labelLeft",m,p)))})),u},w=(e,t,n,o)=>(o-e)/o*(t-n)+n,I=(e,t,n)=>{const o=e.filter((e=>"NaN"!==e.num&&e.num>0)),a=o.length,s=n.width*D,i=n.height*D,l=Math.round((n.width-s)/2),r=Math.round((n.height-i)/2),u=s-(s>L&&i>L?100:0),c=i-1*(a-1),d=[],h=o[0].data.num.value;let m=r;return o.forEach(((e,o)=>{const a=t[o]*c,s=Math.round(w(m-r,u,.2*u,i)/2),f=Math.round(w(m-r+a,u,.2*u,i)/2),p=l+Math.round(u/2),g={bottomRight:{x:p+f,y:Math.round(m+a)},bottomLeft:{x:p-f,y:Math.round(m+a)},topRight:{x:p+s,y:m},topLeft:{x:p-s,y:m},width:n.width},b=`M${g.topLeft.x},${g.topLeft.y} L${g.topRight.x},${g.topRight.y} ${g.bottomRight.x},${g.bottomRight.y} ${g.bottomLeft.x},${g.bottomLeft.y}Z`;d.push({tag:"section",type:"path",d:b,data:e.data,fill:e.fill});const y={share:e.data.num.value/h,fill:e.fill,data:e.data};a>2&&(g.bottomRight.x-g.bottomLeft.x>32&&d.push(S("labelCenter",g,y)),d.push(S("labelLeft",g,y))),m+=a+1})),d},E=(e,t,n)=>{const o=e.filter((e=>"NaN"!==e.num&&e.num>0));if(o&&o.length>0)switch(t){case"WIDTH":return q(o,n);case"ORDER":return I(o,o.map((()=>1/o.length)),n);case"HEIGHT":return I(o,(e=>{const t=e.reduce(((e,t)=>e+t.data.num.value),0);return e.map((e=>e.data.num.value/t))})(o),n);case"AREA":return I(o,((e,t,n)=>{const o=e.reduce(((e,t)=>e+t.data.num.value),0),a=t.width*D,s=t.height*D,i=a*n,l=s*(a+i)/2,r=(a-i)/2/s,u=[];let c=0;for(let t=e.length-1;t>=0;t--){const n=e[t].data.num.value/o,a=2*r*c+i,d=-a/(2*r)+Math.sqrt(a*a/(4*r*r)+n*l/r);u[t]=d/s,c+=d}return u})(o,n,.2),n);default:return q(o,n)}return[]};var H={require:["resolver"],defaultSettings:{settings:{},data:{},style:{item:"$shape"}},render({data:e}){const t=this.resolver.resolve({data:e,defaults:{...C,...this.style.item},settings:this.settings.settings});return E(t.items,this.settings.settings.mode,this.rect)}};const $={version:"1.5.2",color:{auto:!0,autoMinMax:!0,byDimDef:void 0,byMeasureDef:void 0,colorExpression:void 0,dimensionScheme:"12",expressionIsColor:!0,expressionLabel:"",measureMin:void 0,measureMax:void 0,measureScheme:"sg",mode:"primary",paletteColor:{index:6},persistent:!1,reverseScheme:!1,singleColor:void 0,useBaseColors:"off",useDimColVal:!0,useMeasureGradient:!0},dataPoint:{auto:!0,labelMode:"share"},footnote:"",funnel:{mode:"WIDTH"},qHyperCubeDef:{qDimensions:[],qMeasures:[],qInterColumnSortOrder:[],qInitialDataFetch:[{qWidth:2,qHeight:5e3}],qSuppressMissing:!0,qSuppressZero:!1},showDimensionTitle:!0,showTitles:!0,subtitle:"",title:""};var T={definition:{type:"items",component:"accordion",items:{data:{uses:"data",items:{dimensions:{uses:"dimensions",items:{others:{items:{suppressOther:{defaultValue:!0,show:!1}}}},disabledRef:""},measures:{uses:"measures",disabledRef:""}}},sorting:{uses:"sorting"},settings:{uses:"settings",items:{presentation:{type:"items",label:"Presentation",grouped:!0,items:{funnelmode:{ref:"funnel.mode",label:"Funnel Mode",type:"string",component:"dropdown",options:[{value:"AREA",label:"Area"},{value:"HEIGHT",label:"Height"},{value:"WIDTH",label:"Width"},{value:"ORDER",label:"Ordering"}],defaultValue:"WIDTH"},dimensionTitle:{ref:"showDimensionTitle",type:"boolean",component:"switch",label:"Dimension title",defaultValue:!0,options:[{value:!0,label:"Auto"},{value:!1,label:"Off"}]},valuesAuto:{ref:"dataPoint.auto",type:"boolean",label:"Value labels",component:"switch",defaultValue:!0,options:[{value:!0,label:"Auto"},{value:!1,label:"Custom"}]},labelMode:{ref:"dataPoint.labelMode",type:"string",component:"dropdown",options:[{value:"none",label:"None"},{value:"share",label:"Share"},{value:"value",label:"Values"}],defaultValue:"share",show:e=>!e.dataPoint.auto}}},colorsAndLegend:{uses:"colorsAndLegend",translation:"Colors",items:{colors:{items:{colorByLabel:{show:!1},expressionLabel:{show:!1}}},legend:{show:!1}}}}}}},support:{export:!0,exportData:!0,snapshot:!0,viewData:!1},importProperties:null,exportProperties:null};const A=[{path:"/qHyperCubeDef",dimensions:{min:1,max:1,description:()=>"Segments"},measures:{min:1,max:1,description(e){switch(e.funnel.mode){case"WIDTH":return"Width";case"AREA":return"Area";case"HEIGHT":return"Height";case"ORDER":return"Order";default:return""}},added(e,t){2===t.qHyperCubeDef.qInterColumnSortOrder.length&&1!==t.qHyperCubeDef.qInterColumnSortOrder[0]&&(t.qHyperCubeDef.qInterColumnSortOrder=[1,0])}}}];function P(e){const t=e.node.desc&&e.node.desc.share;return t?e.formatter("share")(t):""}function N(e){return e.formatter("num")(e.node.data.num.value)}function O({data:e}){return e?e.label:""}function k(e){if(e.dataPoint.auto)return P;switch(e.dataPoint.labelMode){case"share":return P;case"value":return N;case"none":return null;default:return P}}function W(e,t,n){const o=(n,o=1)=>({component:"fun",selector:n,strategy:{type:"rows",settings:{align:o,fill:".labelCenter"===n?({node:e})=>t.getContrastingColorTo(e.desc.fill):t.getStyle("","","color"),labels:".labelCenter"===n?[{label:k(e)}]:[{label:O}],linkData:t=>".labelCenter"===n?"none"===e.dataPoint.labelMode?Math.random():`${t.data.value} ${k(e)(t)}`:`${t.data.value} ${O(t)}`}}});return{key:"funnel-labels",type:"labels",layout:{displayOrder:2},settings:{sources:[o(".labelLeft",0),o(".labelCenter",.5)]},animations:{enabled:n,trackBy:e=>e.data}}}function F({layout:e,constraints:t,colorService:n,animationsEnabled:o}){const a=n.getDatumProps(),s=n.getColor();return{type:"funnel",key:"fun",data:{extract:{field:"qDimensionInfo/0",props:{num:{field:"qMeasureInfo/0"},...a}}},brush:t.select||t.active?{}:{trigger:[{contexts:["selection"],data:[""]}],consume:[{context:"selection",filter:e=>"section"===e.tag,style:{inactive:{opacity:.3}}}]},settings:{num:{ref:"num"},fill:s,mode:e.funnel.mode},animations:{enabled:o,isMainComponent:!0,trackBy:e=>`${e.tag}: ${e.data.value}`}}}function V(e){if(!e.showDimensionTitle||!e.qHyperCube.qDimensionInfo[0].qFallbackTitle)return!1;return{key:"dimension-title",type:"text",text:e.qHyperCube.qDimensionInfo[0].qFallbackTitle,layout:{dock:"top"}}}function B(){return{share:{type:"d3-number",format:".1%"},num:{data:{field:"qMeasureInfo/0"}}}}function _({picasso:e}){const t=o(),n=a(),d=s(),h=i(),m=l(),f=r(),[p,g]=u(),[b,y]=u(),[M,C]=u(),[D,L]=u();return c((()=>{const o=v({picasso:e,model:d,app:h,translator:m,config:{auto:!1,key:"fill"}});t.style.overflow="hidden";const a=e({renderer:{prio:[f.renderer||"svg"]}}).chart({element:t,data:[],settings:{}}),s=x({chart:a,selections:n,config:{selectionActions:!1}});return C(s),y(o),g(a),L(R()),()=>{s.destroy(),a.destroy()}}),[]),[p,b,M,D]}}}}));
+System.register(["picasso.js","picasso-plugin-q","@nebula.js/stardust","qlik-chart-modules"],(function(e){"use strict";var t,n,o,a,s,i,l,r,u,c,d,h,m,f,p,g,b,y,v,x,R,M;return{setters:[function(e){t=e.default},function(e){n=e.default},function(e){o=e.useElement,a=e.useSelections,s=e.useModel,i=e.useApp,l=e.useTranslator,r=e.useOptions,u=e.useState,c=e.useEffect,d=e.useStaleLayout,h=e.useTheme,m=e.useConstraints,f=e.useRect,p=e.usePlugins,g=e.useAppLayout,b=e.usePromise,y=e.onTakeSnapshot},function(e){v=e.colorService,x=e.selectionService,R=e.cache,M=e.pluginService}],execute:function(){e("default",(function(e){const o=t();o.use(n),o.component("funnel",H);const{flags:a}=e;return{ext:T,qae:{properties:{initial:$},data:{targets:A}},component(){!function({picasso:e,flags:t}){const n=d(),o=h(),a=m(),s=f(),i=p(),l=g().qLocaleInfo,[u,v,x,R]=_({picasso:e,layout:n}),C=r(),D=()=>{const e=u.element.clientWidth!==R.get("width")||u.element.clientHeight!==R.get("height");return!1!==C.chartAnimations&&t.isEnabled("IM_1355_ANIMATIONS_FUNNEL")&&!a.active&&!e},[L]=b((()=>{if(!v)return Promise.resolve();const t=({getUseBaseColors:e})=>({theme:o,colorProps:{...n.color,useBaseColors:e(n)},layout:n,hc:n.qHyperCube}),a=function(e){return{layout:e,keys:{SCALE:{FILL:"fill"},COMPONENT:{FUNNEL:"fun",FUNNEL_LABELS:"funnel-labels",DIMENSION_TITLE:"dimension-title"}}}}(n),s=M({picassoInstance:e,plugins:i,pluginArgs:a});return Promise.all([v.initialize({createConfig:t}),s.initialize()]).then((()=>s))}),[n,v]);c((()=>{if(!u||!v||!L)return;const e=[{type:"q",key:"qHyperCube",data:n.qHyperCube,config:{localeInfo:l}},...v.getData()],t=function({layout:e,constraints:t,colorService:n,theme:o,pluginService:a,animationsEnabled:s}){const i=function(e){return{...e.getScales()}}(n),l=n.getPalettes(),r=[F({layout:e,constraints:t,colorService:n,animationsEnabled:s}),W(e,o,s),V(e)];return{palettes:l,style:{"$font-family":o.getStyle("","","fontFamily"),"$font-color":o.getStyle("","","color"),"$font-size":o.getStyle("","","fontSize")},scales:i,components:a.extendComponents(r),formatters:B()}}({layout:n,constraints:a,colorService:v,theme:o,pluginService:L,animationsEnabled:D});u.update({data:e,settings:t}),R.set("width",u.element.clientWidth),R.set("height",u.element.clientHeight)}),[u,v,o.name(),L,a]),c((()=>{u&&(u.update(),R.set("width",u.element.clientWidth),R.set("height",u.element.clientHeight))}),[s.width,s.height]),c((()=>{x&&x.setLayout(n)}),[n]),y((e=>v.getSnapshotData().then((t=>(e.snapshotData=e.snapshotData||{},e.snapshotData.content=e.snapshotData.content||{},e.snapshotData.content.chartData=t,e))).catch((()=>e))))}({picasso:o,flags:a})}}}));const C={fill:"steelblue",num:1},D=.9,L=150,S=(e,t,n)=>{let o=0,a=0,s=0,i={},l=0;if("labelCenter"===e)o=t.bottomLeft.x,a=t.topRight.y,s=t.bottomRight.x-t.bottomLeft.x,l=t.bottomRight.y-t.topRight.y,i={share:n.share,fill:n.fill};else{const e=180/Math.PI*Math.atan((t.bottomRight.y-t.topRight.y)/(t.topRight.x-t.bottomRight.x));o=e<15&&e>=0?t.topRight.x:e>-15&&e<0?t.bottomRight.x:e<-15?(t.bottomRight.x-t.topRight.x)/2+t.topRight.x+15:(t.topRight.x-t.bottomRight.x)/2+t.bottomRight.x+15,a=t.topRight.y,s=t.width-o,l=t.bottomRight.y-t.topRight.y,i={fill:n.fill}}return{tag:e,type:"rect",x:o,y:a,width:s,height:l,data:n.data,desc:i,fill:"none"}},q=(e,t)=>{const n=(e=>{const t=(e=>{let t=0;return e.forEach((e=>{e.num>t&&(t=e.num)})),t})(e);let n=0;return e.slice().reverse().map((e=>{const o={datum:e,s:n/t,e:e.num/t};return n=e.num,o})).reverse()})(e),o=t.width*D,a=t.height*D,s=(t.width-o)/2,i=(t.height-a)/2,l=o-(o>L&&a>L?100:0),r=(a-1*(n.length-1))/n.length,u=[];return n.forEach(((e,o)=>{const a=(c=e.e,d=o<n.length-1?e.s:e.e,[.5-.5*c,.5+.5*c,.5+.5*d,.5-.5*d]).map((e=>Math.round(e*l+s)));var c,d;const h=r*o+1*o+i,m={bottomRight:{x:a[2],y:Math.round(h+r)},bottomLeft:{x:a[3],y:Math.round(h+r)},topRight:{x:a[1],y:Math.round(h)},topLeft:{x:a[0],y:Math.round(h)},width:t.width},f=`M${m.topLeft.x},${m.topLeft.y} L${m.topRight.x},${m.topRight.y} ${m.bottomRight.x},${m.bottomRight.y} ${m.bottomLeft.x},${m.bottomLeft.y}Z`;u.push({tag:"section",type:"path",d:f,data:e.datum.data,fill:e.datum.fill});const p={share:e.e,fill:e.datum.fill,data:e.datum.data};r>12&&(m.bottomRight.x-m.bottomLeft.x>32&&u.push(S("labelCenter",m,p)),u.push(S("labelLeft",m,p)))})),u},w=(e,t,n,o)=>(o-e)/o*(t-n)+n,I=(e,t,n)=>{const o=e.filter((e=>"NaN"!==e.num&&e.num>0)),a=o.length,s=n.width*D,i=n.height*D,l=Math.round((n.width-s)/2),r=Math.round((n.height-i)/2),u=s-(s>L&&i>L?100:0),c=i-1*(a-1),d=[],h=o[0].data.num.value;let m=r;return o.forEach(((e,o)=>{const a=t[o]*c,s=Math.round(w(m-r,u,.2*u,i)/2),f=Math.round(w(m-r+a,u,.2*u,i)/2),p=l+Math.round(u/2),g={bottomRight:{x:p+f,y:Math.round(m+a)},bottomLeft:{x:p-f,y:Math.round(m+a)},topRight:{x:p+s,y:m},topLeft:{x:p-s,y:m},width:n.width},b=`M${g.topLeft.x},${g.topLeft.y} L${g.topRight.x},${g.topRight.y} ${g.bottomRight.x},${g.bottomRight.y} ${g.bottomLeft.x},${g.bottomLeft.y}Z`;d.push({tag:"section",type:"path",d:b,data:e.data,fill:e.fill});const y={share:e.data.num.value/h,fill:e.fill,data:e.data};a>2&&(g.bottomRight.x-g.bottomLeft.x>32&&d.push(S("labelCenter",g,y)),d.push(S("labelLeft",g,y))),m+=a+1})),d},E=(e,t,n)=>{const o=e.filter((e=>"NaN"!==e.num&&e.num>0));if(o&&o.length>0)switch(t){case"WIDTH":return q(o,n);case"ORDER":return I(o,o.map((()=>1/o.length)),n);case"HEIGHT":return I(o,(e=>{const t=e.reduce(((e,t)=>e+t.data.num.value),0);return e.map((e=>e.data.num.value/t))})(o),n);case"AREA":return I(o,((e,t,n)=>{const o=e.reduce(((e,t)=>e+t.data.num.value),0),a=t.width*D,s=t.height*D,i=a*n,l=s*(a+i)/2,r=(a-i)/2/s,u=[];let c=0;for(let t=e.length-1;t>=0;t--){const n=e[t].data.num.value/o,a=2*r*c+i,d=-a/(2*r)+Math.sqrt(a*a/(4*r*r)+n*l/r);u[t]=d/s,c+=d}return u})(o,n,.2),n);default:return q(o,n)}return[]};var H={require:["resolver"],defaultSettings:{settings:{},data:{},style:{item:"$shape"}},render({data:e}){const t=this.resolver.resolve({data:e,defaults:{...C,...this.style.item},settings:this.settings.settings});return E(t.items,this.settings.settings.mode,this.rect)}};const $={version:"1.6.0",color:{auto:!0,autoMinMax:!0,byDimDef:void 0,byMeasureDef:void 0,colorExpression:void 0,dimensionScheme:"12",expressionIsColor:!0,expressionLabel:"",measureMin:void 0,measureMax:void 0,measureScheme:"sg",mode:"primary",paletteColor:{index:6},persistent:!1,reverseScheme:!1,singleColor:void 0,useBaseColors:"off",useDimColVal:!0,useMeasureGradient:!0},dataPoint:{auto:!0,labelMode:"share"},footnote:"",funnel:{mode:"WIDTH"},qHyperCubeDef:{qDimensions:[],qMeasures:[],qInterColumnSortOrder:[],qInitialDataFetch:[{qWidth:2,qHeight:5e3}],qSuppressMissing:!0,qSuppressZero:!1},showDimensionTitle:!0,showTitles:!0,subtitle:"",title:""};var T={definition:{type:"items",component:"accordion",items:{data:{uses:"data",items:{dimensions:{uses:"dimensions",items:{others:{items:{suppressOther:{defaultValue:!0,show:!1}}}},disabledRef:""},measures:{uses:"measures",disabledRef:""}}},sorting:{uses:"sorting"},settings:{uses:"settings",items:{presentation:{type:"items",label:"Presentation",grouped:!0,items:{funnelmode:{ref:"funnel.mode",label:"Funnel Mode",type:"string",component:"dropdown",options:[{value:"AREA",label:"Area"},{value:"HEIGHT",label:"Height"},{value:"WIDTH",label:"Width"},{value:"ORDER",label:"Ordering"}],defaultValue:"WIDTH"},dimensionTitle:{ref:"showDimensionTitle",type:"boolean",component:"switch",label:"Dimension title",defaultValue:!0,options:[{value:!0,label:"Auto"},{value:!1,label:"Off"}]},valuesAuto:{ref:"dataPoint.auto",type:"boolean",label:"Value labels",component:"switch",defaultValue:!0,options:[{value:!0,label:"Auto"},{value:!1,label:"Custom"}]},labelMode:{ref:"dataPoint.labelMode",type:"string",component:"dropdown",options:[{value:"none",label:"None"},{value:"share",label:"Share"},{value:"value",label:"Values"}],defaultValue:"share",show:e=>!e.dataPoint.auto}}},colorsAndLegend:{uses:"colorsAndLegend",translation:"Colors",items:{colors:{items:{colorByLabel:{show:!1},expressionLabel:{show:!1}}},legend:{show:!1}}}}}}},support:{export:!0,exportData:!0,snapshot:!0,viewData:!1},importProperties:null,exportProperties:null};const A=[{path:"/qHyperCubeDef",dimensions:{min:1,max:1,description:()=>"Segments"},measures:{min:1,max:1,description(e){switch(e.funnel.mode){case"WIDTH":return"Width";case"AREA":return"Area";case"HEIGHT":return"Height";case"ORDER":return"Order";default:return""}},added(e,t){2===t.qHyperCubeDef.qInterColumnSortOrder.length&&1!==t.qHyperCubeDef.qInterColumnSortOrder[0]&&(t.qHyperCubeDef.qInterColumnSortOrder=[1,0])}}}];function P(e){const t=e.node.desc&&e.node.desc.share;return t?e.formatter("share")(t):""}function N(e){return e.formatter("num")(e.node.data.num.value)}function O({data:e}){return e?e.label:""}function k(e){if(e.dataPoint.auto)return P;switch(e.dataPoint.labelMode){case"share":return P;case"value":return N;case"none":return null;default:return P}}function W(e,t,n){const o=(n,o=1)=>({component:"fun",selector:n,strategy:{type:"rows",settings:{align:o,fill:".labelCenter"===n?({node:e})=>t.getContrastingColorTo(e.desc.fill):t.getStyle("","","color"),labels:".labelCenter"===n?[{label:k(e)}]:[{label:O}],linkData:t=>".labelCenter"===n?"none"===e.dataPoint.labelMode?Math.random():`${t.data.value} ${k(e)(t)}`:`${t.data.value} ${O(t)}`}}});return{key:"funnel-labels",type:"labels",layout:{displayOrder:2},settings:{sources:[o(".labelLeft",0),o(".labelCenter",.5)]},animations:{enabled:n,trackBy:e=>e.data}}}function F({layout:e,constraints:t,colorService:n,animationsEnabled:o}){const a=n.getDatumProps(),s=n.getColor();return{type:"funnel",key:"fun",data:{extract:{field:"qDimensionInfo/0",props:{num:{field:"qMeasureInfo/0"},...a}}},brush:t.select||t.active?{}:{trigger:[{contexts:["selection"],data:[""]}],consume:[{context:"selection",filter:e=>"section"===e.tag,style:{inactive:{opacity:.3}}}]},settings:{num:{ref:"num"},fill:s,mode:e.funnel.mode},animations:{enabled:o,isMainComponent:!0,trackBy:e=>`${e.tag}: ${e.data.value}`}}}function V(e){if(!e.showDimensionTitle||!e.qHyperCube.qDimensionInfo[0].qFallbackTitle)return!1;return{key:"dimension-title",type:"text",text:e.qHyperCube.qDimensionInfo[0].qFallbackTitle,layout:{dock:"top"}}}function B(){return{share:{type:"d3-number",format:".1%"},num:{data:{field:"qMeasureInfo/0"}}}}function _({picasso:e}){const t=o(),n=a(),d=s(),h=i(),m=l(),f=r(),[p,g]=u(),[b,y]=u(),[M,C]=u(),[D,L]=u();return c((()=>{const o=v({picasso:e,model:d,app:h,translator:m,config:{auto:!1,key:"fill"}});t.style.overflow="hidden";const a=e({renderer:{prio:[f.renderer||"svg"]}}).chart({element:t,data:[],settings:{}}),s=x({chart:a,selections:n,config:{selectionActions:!1}});return C(s),y(o),g(a),L(R()),()=>{s.destroy(),a.destroy()}}),[]),[p,b,M,D]}}}}));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nebula.js/sn-funnel-chart",
-  "version": "1.5.2",
+  "version": "1.6.0",
   "description": "A sequential chart visualizing a linear process with connected stages, for example a sales process with potential revenue at each stage.",
   "author": "QlikTech International AB",
   "license": "MIT",