@kyndryl-design-system/shidoka-charts 2.5.2 → 2.5.4
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.
- package/common/config/chartTypes/bar.js +1 -1
- package/common/config/chartTypes/bar.js.map +1 -1
- package/common/config/chartTypes/line.js +1 -1
- package/common/config/chartTypes/line.js.map +1 -1
- package/common/config/chartTypes/treemap.js +1 -1
- package/common/config/chartTypes/treemap.js.map +1 -1
- package/package.json +2 -2
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{getComputedColorPalette as t}from"../colorPalettes.js";const e="bar",o=t=>{const e="y"===t.options.indexAxis,o=t.datasets.find((t=>Array.isArray(t.data[0]))),
|
|
1
|
+
import{getComputedColorPalette as t}from"../colorPalettes.js";const e="bar",o=t=>{const e="y"===t.options.indexAxis,o=t.datasets.find((t=>Array.isArray(t.data[0]))),r=t.options.scales?.y?.stacked;return{interaction:{mode:r?"index":"nearest"},borderRadius:2,borderSkipped:!o&&"start",scales:{x:{grid:{display:o||e}},y:{grid:{display:!e}}},plugins:{tooltip:{callbacks:{title:t=>(e?t[0].chart.options.scales.y.title.text:t[0].chart.options.scales.x.title.text)+": "+t[0].label,footer:t=>{let o=0;t.forEach((function(t){o+=e?t.parsed.x:t.parsed.y}));const s=Math.round(100*(o+Number.EPSILON))/100;return r?"Total: "+s:null}}}}}},r=(e,o)=>{const r="y"===e.options.indexAxis,s=e.options.scales?.y?.stacked,a=e.datasets.filter((t=>"line"!==t.type)),l=t(e.options.colorPalette||"categorical"),i=Math.floor(o/(l.length-1));return{backgroundColor:l[o>l.length-1?o-(l.length-1)*i:o],borderWidth:{top:!r&&s&&o<a.length-1?2:0,right:r&&s&&o<a.length-1?2:0,bottom:0,left:0}}};export{r as datasetOptions,o as options,e as type};
|
|
2
2
|
//# sourceMappingURL=bar.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"bar.js","sources":["../../../../src/common/config/chartTypes/bar.js"],"sourcesContent":["import { getComputedColorPalette } from '../colorPalettes';\n\nexport const type = 'bar';\n\nexport const options = (ctx) => {\n const Horizontal = ctx.options.indexAxis === 'y';\n const FloatingBars = ctx.datasets.find((dataset) =>\n Array.isArray(dataset.data[0])\n );\n const Stacked = ctx.options.scales?.y?.stacked;\n\n return {\n interaction: {\n mode: Stacked ? 'index' : 'nearest',\n },\n borderRadius: 2,\n borderSkipped: FloatingBars ? false : 'start',\n scales: {\n x: {\n grid: {\n display: FloatingBars || Horizontal,\n },\n },\n y: {\n grid: {\n display: !Horizontal,\n },\n },\n },\n plugins: {\n tooltip: {\n callbacks: {\n title: (tooltipItems) => {\n // add axis label to tooltip title\n const AxisLabel = Horizontal\n ? tooltipItems[0].chart.options.scales.y.title.text\n : tooltipItems[0].chart.options.scales.x.title.text;\n const Label = tooltipItems[0].label;\n\n return AxisLabel + ': ' + Label;\n },\n footer: (tooltipItems) => {\n // add total row\n let sum = 0;\n\n tooltipItems.forEach(function (tooltipItem) {\n sum += Horizontal ? tooltipItem.parsed.x : tooltipItem.parsed.y;\n });\n\n return Stacked ? 'Total: ' +
|
|
1
|
+
{"version":3,"file":"bar.js","sources":["../../../../src/common/config/chartTypes/bar.js"],"sourcesContent":["import { getComputedColorPalette } from '../colorPalettes';\n\nexport const type = 'bar';\n\nexport const options = (ctx) => {\n const Horizontal = ctx.options.indexAxis === 'y';\n const FloatingBars = ctx.datasets.find((dataset) =>\n Array.isArray(dataset.data[0])\n );\n const Stacked = ctx.options.scales?.y?.stacked;\n\n return {\n interaction: {\n mode: Stacked ? 'index' : 'nearest',\n },\n borderRadius: 2,\n borderSkipped: FloatingBars ? false : 'start',\n scales: {\n x: {\n grid: {\n display: FloatingBars || Horizontal,\n },\n },\n y: {\n grid: {\n display: !Horizontal,\n },\n },\n },\n plugins: {\n tooltip: {\n callbacks: {\n title: (tooltipItems) => {\n // add axis label to tooltip title\n const AxisLabel = Horizontal\n ? tooltipItems[0].chart.options.scales.y.title.text\n : tooltipItems[0].chart.options.scales.x.title.text;\n const Label = tooltipItems[0].label;\n\n return AxisLabel + ': ' + Label;\n },\n footer: (tooltipItems) => {\n // add total row\n let sum = 0;\n\n tooltipItems.forEach(function (tooltipItem) {\n sum += Horizontal ? tooltipItem.parsed.x : tooltipItem.parsed.y;\n });\n\n // Fix floating point rounding issues, show up to 2 decimals max\n const formattedSum = Math.round((sum + Number.EPSILON) * 100) / 100;\n\n return Stacked ? 'Total: ' + formattedSum : null;\n },\n },\n },\n },\n };\n};\n\nexport const datasetOptions = (ctx, index) => {\n const Horizontal = ctx.options.indexAxis === 'y';\n const Stacked = ctx.options.scales?.y?.stacked;\n const Datasets = ctx.datasets;\n const BarDatasets = Datasets.filter((dataset) => dataset.type !== 'line');\n const Colors = getComputedColorPalette(\n ctx.options.colorPalette || 'categorical'\n );\n const ColorCycles = Math.floor(index / (Colors.length - 1));\n const Index =\n index > Colors.length - 1\n ? index - (Colors.length - 1) * ColorCycles\n : index;\n\n return {\n backgroundColor: Colors[Index],\n borderWidth: {\n top: !Horizontal && Stacked && index < BarDatasets.length - 1 ? 2 : 0, // stacked bars 2px gap\n right: Horizontal && Stacked && index < BarDatasets.length - 1 ? 2 : 0, // stacked bars 2px gap\n bottom: 0,\n left: 0,\n },\n };\n};\n"],"names":["type","options","ctx","Horizontal","indexAxis","FloatingBars","datasets","find","dataset","Array","isArray","data","Stacked","scales","y","stacked","interaction","mode","borderRadius","borderSkipped","x","grid","display","plugins","tooltip","callbacks","title","tooltipItems","chart","text","label","footer","sum","forEach","tooltipItem","parsed","formattedSum","Math","round","Number","EPSILON","datasetOptions","index","BarDatasets","filter","Colors","getComputedColorPalette","colorPalette","ColorCycles","floor","length","backgroundColor","borderWidth","top","right","bottom","left"],"mappings":"8DAEY,MAACA,EAAO,MAEPC,EAAWC,IACtB,MAAMC,EAAuC,MAA1BD,EAAID,QAAQG,UACzBC,EAAeH,EAAII,SAASC,MAAMC,GACtCC,MAAMC,QAAQF,EAAQG,KAAK,MAEvBC,EAAUV,EAAID,QAAQY,QAAQC,GAAGC,QAEvC,MAAO,CACLC,YAAa,CACXC,KAAML,EAAU,QAAU,WAE5BM,aAAc,EACdC,eAAed,GAAuB,QACtCQ,OAAQ,CACNO,EAAG,CACDC,KAAM,CACJC,QAASjB,GAAgBF,IAG7BW,EAAG,CACDO,KAAM,CACJC,SAAUnB,KAIhBoB,QAAS,CACPC,QAAS,CACPC,UAAW,CACTC,MAAQC,IAEYxB,EACdwB,EAAa,GAAGC,MAAM3B,QAAQY,OAAOC,EAAEY,MAAMG,KAC7CF,EAAa,GAAGC,MAAM3B,QAAQY,OAAOO,EAAEM,MAAMG,MAG9B,KAFLF,EAAa,GAAGG,MAIhCC,OAASJ,IAEP,IAAIK,EAAM,EAEVL,EAAaM,SAAQ,SAAUC,GAC7BF,GAAO7B,EAAa+B,EAAYC,OAAOf,EAAIc,EAAYC,OAAOrB,CAC5E,IAGY,MAAMsB,EAAeC,KAAKC,MAA+B,KAAxBN,EAAMO,OAAOC,UAAkB,IAEhE,OAAO5B,EAAU,UAAYwB,EAAe,IAAI,KAKzD,EAGUK,EAAiB,CAACvC,EAAKwC,KAClC,MAAMvC,EAAuC,MAA1BD,EAAID,QAAQG,UACzBQ,EAAUV,EAAID,QAAQY,QAAQC,GAAGC,QAEjC4B,EADWzC,EAAII,SACQsC,QAAQpC,GAA6B,SAAjBA,EAAQR,OACnD6C,EAASC,EACb5C,EAAID,QAAQ8C,cAAgB,eAExBC,EAAcX,KAAKY,MAAMP,GAASG,EAAOK,OAAS,IAMxD,MAAO,CACLC,gBAAiBN,EALjBH,EAAQG,EAAOK,OAAS,EACpBR,GAASG,EAAOK,OAAS,GAAKF,EAC9BN,GAIJU,YAAa,CACXC,KAAMlD,GAAcS,GAAW8B,EAAQC,EAAYO,OAAS,EAAI,EAAI,EACpEI,MAAOnD,GAAcS,GAAW8B,EAAQC,EAAYO,OAAS,EAAI,EAAI,EACrEK,OAAQ,EACRC,KAAM,GAET"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{getComputedColorPalette as t}from"../colorPalettes.js";const o="line",r=t=>{const o="y"===t.options.indexAxis,r=t.datasets.find((t=>Array.isArray(t.data[0]))),e=t.options.scales?.y?.stacked;return{interaction:{mode:e?"index":"nearest"},pointRadius:6,pointHoverRadius:7,pointBorderWidth:1,scales:{x:{grid:{display:r||o}},y:{beginAtZero:!0,grid:{display:!o}}},plugins:{tooltip:{callbacks:{title:t=>(o?t[0].chart.options.scales.y.title.text:t[0].chart.options.scales.x.title.text)+": "+t[0].label,footer:t=>{let r=0;
|
|
1
|
+
import{getComputedColorPalette as t}from"../colorPalettes.js";const o="line",r=t=>{const o="y"===t.options.indexAxis,r=t.datasets.find((t=>Array.isArray(t.data[0]))),e=t.options.scales?.y?.stacked;return{interaction:{mode:e?"index":"nearest"},pointRadius:6,pointHoverRadius:7,pointBorderWidth:1,scales:{x:{grid:{display:r||o}},y:{beginAtZero:!0,grid:{display:!o}}},plugins:{tooltip:{callbacks:{title:t=>(o?t[0].chart.options.scales.y.title.text:t[0].chart.options.scales.x.title.text)+": "+t[0].label,footer:t=>{let r=0;t.forEach((function(t){r+=o?t.parsed.x:t.parsed.y}));const a=Math.round(100*(r+Number.EPSILON))/100;return e?"Total: "+a:null}}}}}},e=(o,r)=>{const e=t(o.options.colorPalette||"categorical"),a=Math.floor(r/(e.length-1)),n=r>e.length-1?r-(e.length-1)*a:r;return{pointBackgroundColor:e[n]+"80",borderColor:e[r],backgroundColor:t=>{const o=t.chart.ctx.createLinearGradient(0,0,0,200);return o.addColorStop(0,e[n]+"99"),o.addColorStop(1,e[n]+"4D"),o},borderWidth:2}};export{e as datasetOptions,r as options,o as type};
|
|
2
2
|
//# sourceMappingURL=line.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"line.js","sources":["../../../../src/common/config/chartTypes/line.js"],"sourcesContent":["import { getComputedColorPalette } from '../colorPalettes';\n\nexport const type = 'line';\n\nexport const options = (ctx) => {\n const Horizontal = ctx.options.indexAxis === 'y';\n const FloatingBars = ctx.datasets.find((dataset) =>\n Array.isArray(dataset.data[0])\n );\n const Stacked = ctx.options.scales?.y?.stacked;\n\n return {\n interaction: {\n mode: Stacked ? 'index' : 'nearest',\n },\n pointRadius: 6,\n pointHoverRadius: 7,\n pointBorderWidth: 1,\n scales: {\n x: {\n grid: {\n display: FloatingBars || Horizontal,\n },\n },\n y: {\n beginAtZero: true,\n grid: {\n display: !Horizontal,\n },\n },\n },\n plugins: {\n tooltip: {\n callbacks: {\n title: (tooltipItems) => {\n // add axis label to tooltip title\n const AxisLabel = Horizontal\n ? tooltipItems[0].chart.options.scales.y.title.text\n : tooltipItems[0].chart.options.scales.x.title.text;\n const Label = tooltipItems[0].label;\n\n return AxisLabel + ': ' + Label;\n },\n footer: (tooltipItems) => {\n // add total row\n let sum = 0;\n\n tooltipItems.forEach(function (tooltipItem) {\n sum += Horizontal ? tooltipItem.parsed.x : tooltipItem.parsed.y;\n });\n\n return Stacked ? 'Total: ' +
|
|
1
|
+
{"version":3,"file":"line.js","sources":["../../../../src/common/config/chartTypes/line.js"],"sourcesContent":["import { getComputedColorPalette } from '../colorPalettes';\n\nexport const type = 'line';\n\nexport const options = (ctx) => {\n const Horizontal = ctx.options.indexAxis === 'y';\n const FloatingBars = ctx.datasets.find((dataset) =>\n Array.isArray(dataset.data[0])\n );\n const Stacked = ctx.options.scales?.y?.stacked;\n\n return {\n interaction: {\n mode: Stacked ? 'index' : 'nearest',\n },\n pointRadius: 6,\n pointHoverRadius: 7,\n pointBorderWidth: 1,\n scales: {\n x: {\n grid: {\n display: FloatingBars || Horizontal,\n },\n },\n y: {\n beginAtZero: true,\n grid: {\n display: !Horizontal,\n },\n },\n },\n plugins: {\n tooltip: {\n callbacks: {\n title: (tooltipItems) => {\n // add axis label to tooltip title\n const AxisLabel = Horizontal\n ? tooltipItems[0].chart.options.scales.y.title.text\n : tooltipItems[0].chart.options.scales.x.title.text;\n const Label = tooltipItems[0].label;\n\n return AxisLabel + ': ' + Label;\n },\n footer: (tooltipItems) => {\n // add total row\n let sum = 0;\n\n tooltipItems.forEach(function (tooltipItem) {\n sum += Horizontal ? tooltipItem.parsed.x : tooltipItem.parsed.y;\n });\n\n // Fix floating point rounding issues, show up to 2 decimals max\n const formattedSum = Math.round((sum + Number.EPSILON) * 100) / 100;\n\n return Stacked ? 'Total: ' + formattedSum : null;\n },\n },\n },\n },\n };\n};\n\nexport const datasetOptions = (ctx, index) => {\n const Colors = getComputedColorPalette(\n ctx.options.colorPalette || 'categorical'\n );\n const ColorCycles = Math.floor(index / (Colors.length - 1));\n const Index =\n index > Colors.length - 1\n ? index - (Colors.length - 1) * ColorCycles\n : index;\n\n return {\n // pointBorderColor:\n // getColorPalette(ctx.options.colorPalette || 'default')[index],\n pointBackgroundColor: Colors[Index] + '80', // 50% opacity\n borderColor: Colors[index],\n // backgroundColor: Colors[Index] + '80',\n backgroundColor: (context) => {\n const ctx = context.chart.ctx;\n const gradient = ctx.createLinearGradient(0, 0, 0, 200);\n gradient.addColorStop(0, Colors[Index] + '99'); // 60% opacity\n gradient.addColorStop(1, Colors[Index] + '4D'); // 30% opacity\n return gradient;\n },\n borderWidth: 2,\n };\n};\n"],"names":["type","options","ctx","Horizontal","indexAxis","FloatingBars","datasets","find","dataset","Array","isArray","data","Stacked","scales","y","stacked","interaction","mode","pointRadius","pointHoverRadius","pointBorderWidth","x","grid","display","beginAtZero","plugins","tooltip","callbacks","title","tooltipItems","chart","text","label","footer","sum","forEach","tooltipItem","parsed","formattedSum","Math","round","Number","EPSILON","datasetOptions","index","Colors","getComputedColorPalette","colorPalette","ColorCycles","floor","length","Index","pointBackgroundColor","borderColor","backgroundColor","context","gradient","createLinearGradient","addColorStop","borderWidth"],"mappings":"8DAEY,MAACA,EAAO,OAEPC,EAAWC,IACtB,MAAMC,EAAuC,MAA1BD,EAAID,QAAQG,UACzBC,EAAeH,EAAII,SAASC,MAAMC,GACtCC,MAAMC,QAAQF,EAAQG,KAAK,MAEvBC,EAAUV,EAAID,QAAQY,QAAQC,GAAGC,QAEvC,MAAO,CACLC,YAAa,CACXC,KAAML,EAAU,QAAU,WAE5BM,YAAa,EACbC,iBAAkB,EAClBC,iBAAkB,EAClBP,OAAQ,CACNQ,EAAG,CACDC,KAAM,CACJC,QAASlB,GAAgBF,IAG7BW,EAAG,CACDU,aAAa,EACbF,KAAM,CACJC,SAAUpB,KAIhBsB,QAAS,CACPC,QAAS,CACPC,UAAW,CACTC,MAAQC,IAEY1B,EACd0B,EAAa,GAAGC,MAAM7B,QAAQY,OAAOC,EAAEc,MAAMG,KAC7CF,EAAa,GAAGC,MAAM7B,QAAQY,OAAOQ,EAAEO,MAAMG,MAG9B,KAFLF,EAAa,GAAGG,MAIhCC,OAASJ,IAEP,IAAIK,EAAM,EAEVL,EAAaM,SAAQ,SAAUC,GAC7BF,GAAO/B,EAAaiC,EAAYC,OAAOhB,EAAIe,EAAYC,OAAOvB,CAC5E,IAGY,MAAMwB,EAAeC,KAAKC,MAA+B,KAAxBN,EAAMO,OAAOC,UAAkB,IAEhE,OAAO9B,EAAU,UAAY0B,EAAe,IAAI,KAKzD,EAGUK,EAAiB,CAACzC,EAAK0C,KAClC,MAAMC,EAASC,EACb5C,EAAID,QAAQ8C,cAAgB,eAExBC,EAAcT,KAAKU,MAAML,GAASC,EAAOK,OAAS,IAClDC,EACJP,EAAQC,EAAOK,OAAS,EACpBN,GAASC,EAAOK,OAAS,GAAKF,EAC9BJ,EAEN,MAAO,CAGLQ,qBAAsBP,EAAOM,GAAS,KACtCE,YAAaR,EAAOD,GAEpBU,gBAAkBC,IAChB,MACMC,EADMD,EAAQzB,MAAM5B,IACLuD,qBAAqB,EAAG,EAAG,EAAG,KAGnD,OAFAD,EAASE,aAAa,EAAGb,EAAOM,GAAS,MACzCK,EAASE,aAAa,EAAGb,EAAOM,GAAS,MAClCK,CAAQ,EAEjBG,YAAa,EACd"}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{getComputedColorPalette as
|
|
1
|
+
import{getComputedColorPalette as t}from"../colorPalettes.js";import{getTextColor as e}from"../../helpers/helpers.js";import{getTokenThemeVal as o}from'./../../../external/@kyndryl-design-system/shidoka-foundation/common/helpers/color.js';const r="treemap",n=t=>({plugins:{legend:{display:!1}},spacing:function(t){return void 0!==t.dataset.groups?0:1},borderWidth:function(t){return t.dataset.groups?1:0},borderColor:o("--kd-color-background-page-default"),labels:{align:"left",display:!0,color:function(t){return e(t.element.options.backgroundColor)},font:{size:12,weight:500},position:"top",overflow:"hidden"},captions:{align:"center",display:!0,color:function(t){return e(t.element.options.backgroundColor)},font:{size:12,weight:700},padding:2}}),a=(e,o)=>{const r=t(e.options?.colorPalette||"categorical");return{backgroundColor:function(t){const e=t.dataset,o="number"==typeof t.dataIndex?t.dataIndex:0,n=r&&r.length||1;if(e&&void 0!==e.groups){const e=s(t);return r[e%n]}if("object"==typeof(e&&e.tree)&&!Array.isArray(e&&e.tree)&&t.raw&&t.raw._data&&"string"==typeof t.raw._data.path){const o=String(t.raw._data.path).split(".")[0],a=Object.keys(e.tree||{}),s=Math.max(0,a.indexOf(o));return r[s%n]}return r[o%n]}}},s=t=>{const e=t.dataset;let o=0;if(void 0!==e.groups){const r=t.dataIndex,n=e.groups?e.groups[0]:null,a="object"==typeof e.tree&&!Array.isArray(e.tree);let s=[];if(a){if(s=Object.keys(e.tree),t.raw){const e=t.raw._data.path.split(".")[0];o=s.indexOf(e)}}else{e.tree.forEach((t=>{s.includes(t[n])||s.push(t[n])}));const t=e.data[r];t&&(o=s.indexOf(t._data[n]))}}return o<0?0:o};export{a as datasetOptions,n as options,r as type};
|
|
2
2
|
//# sourceMappingURL=treemap.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"treemap.js","sources":["../../../../src/common/config/chartTypes/treemap.js"],"sourcesContent":["import { getComputedColorPalette } from '../colorPalettes';\nimport { getTextColor } from '../../helpers/helpers';\nimport { getTokenThemeVal } from '@kyndryl-design-system/shidoka-foundation/common/helpers/color';\n\nexport const type = 'treemap';\n\nexport const options = (ctx) => {\n const BorderColor = getTokenThemeVal('--kd-color-background-page-default');\n\n return {\n plugins: {\n legend: {\n display: false,\n },\n },\n spacing: function (context) {\n const Dataset = context.dataset;\n const Grouped = Dataset.groups !== undefined;\n\n return Grouped ? 0 : 1;\n },\n borderWidth: function (context) {\n const Dataset = context.dataset;\n return Dataset.groups ? 1 : 0;\n },\n borderColor: BorderColor,\n labels: {\n align: 'left',\n display: true,\n color: function (context) {\n return getTextColor(context.element.options.backgroundColor);\n },\n font: {\n size: 12,\n weight: 500,\n },\n position: 'top',\n overflow: 'hidden',\n },\n captions: {\n align: 'center',\n display: true,\n color: function (context) {\n return getTextColor(context.element.options.backgroundColor);\n },\n font: {\n size: 12,\n weight: 700,\n },\n padding: 2,\n },\n };\n};\n\nexport const datasetOptions = (ctx, index) => {\n return {\n backgroundColor: function (context) {\n
|
|
1
|
+
{"version":3,"file":"treemap.js","sources":["../../../../src/common/config/chartTypes/treemap.js"],"sourcesContent":["import { getComputedColorPalette } from '../colorPalettes';\nimport { getTextColor } from '../../helpers/helpers';\nimport { getTokenThemeVal } from '@kyndryl-design-system/shidoka-foundation/common/helpers/color';\n\nexport const type = 'treemap';\n\nexport const options = (ctx) => {\n const BorderColor = getTokenThemeVal('--kd-color-background-page-default');\n\n return {\n plugins: {\n legend: {\n display: false,\n },\n },\n spacing: function (context) {\n const Dataset = context.dataset;\n const Grouped = Dataset.groups !== undefined;\n\n return Grouped ? 0 : 1;\n },\n borderWidth: function (context) {\n const Dataset = context.dataset;\n return Dataset.groups ? 1 : 0;\n },\n borderColor: BorderColor,\n labels: {\n align: 'left',\n display: true,\n color: function (context) {\n return getTextColor(context.element.options.backgroundColor);\n },\n font: {\n size: 12,\n weight: 500,\n },\n position: 'top',\n overflow: 'hidden',\n },\n captions: {\n align: 'center',\n display: true,\n color: function (context) {\n return getTextColor(context.element.options.backgroundColor);\n },\n font: {\n size: 12,\n weight: 700,\n },\n padding: 2,\n },\n };\n};\n\nexport const datasetOptions = (ctx, index) => {\n const palette = getComputedColorPalette(\n ctx.options?.colorPalette || 'categorical'\n );\n\n return {\n backgroundColor: function (context) {\n const Dataset = context.dataset;\n const dataIndex =\n typeof context.dataIndex === 'number' ? context.dataIndex : 0;\n const paletteLen = (palette && palette.length) || 1;\n\n if (Dataset && Dataset.groups !== undefined) {\n const groupIndex = getGroupColorIndex(context);\n return palette[groupIndex % paletteLen];\n }\n\n const nested =\n typeof (Dataset && Dataset.tree) === 'object' &&\n !Array.isArray(Dataset && Dataset.tree);\n if (\n nested &&\n context.raw &&\n context.raw._data &&\n typeof context.raw._data.path === 'string'\n ) {\n const parent = String(context.raw._data.path).split('.')[0];\n const groups = Object.keys(Dataset.tree || {});\n const idx = Math.max(0, groups.indexOf(parent));\n return palette[idx % paletteLen];\n }\n\n return palette[dataIndex % paletteLen];\n },\n };\n};\n\n/**\n * The function `getGroupColorIndex` returns the index of a group color based on the context provided.\n * Works for grouped charts, not nested data charts yet.\n * @param context - The `context` parameter is an object that contains information about the current\n * context or state of the program. It is used to determine the group color index based on the dataset\n * and data index.\n * @returns the index of the group color for a given context.\n */\nconst getGroupColorIndex = (context) => {\n const Dataset = context.dataset;\n let index = 0;\n\n if (Dataset.groups !== undefined) {\n const DataIndex = context.dataIndex;\n const GroupKey = Dataset.groups ? Dataset.groups[0] : null;\n const Nested =\n typeof Dataset.tree === 'object' && !Array.isArray(Dataset.tree);\n let Groups = [];\n\n if (Nested) {\n Groups = Object.keys(Dataset.tree);\n\n if (context.raw) {\n const Path = context.raw._data.path;\n const Parent = Path.split('.')[0];\n\n index = Groups.indexOf(Parent);\n }\n } else {\n Dataset.tree.forEach((leaf) => {\n if (!Groups.includes(leaf[GroupKey])) {\n Groups.push(leaf[GroupKey]);\n }\n });\n\n const Leaf = Dataset.data[DataIndex];\n\n if (Leaf) {\n index = Groups.indexOf(Leaf._data[GroupKey]);\n }\n }\n }\n\n return index < 0 ? 0 : index;\n};\n"],"names":["type","options","ctx","plugins","legend","display","spacing","context","undefined","dataset","groups","borderWidth","borderColor","getTokenThemeVal","labels","align","color","getTextColor","element","backgroundColor","font","size","weight","position","overflow","captions","padding","datasetOptions","index","palette","getComputedColorPalette","colorPalette","Dataset","dataIndex","paletteLen","length","groupIndex","getGroupColorIndex","tree","Array","isArray","raw","_data","path","parent","String","split","Object","keys","idx","Math","max","indexOf","DataIndex","GroupKey","Nested","Groups","Parent","forEach","leaf","includes","push","Leaf","data"],"mappings":"iPAIY,MAACA,EAAO,UAEPC,EAAWC,IAGf,CACLC,QAAS,CACPC,OAAQ,CACNC,SAAS,IAGbC,QAAS,SAAUC,GAIjB,YAFmCC,IADnBD,EAAQE,QACAC,OAEP,EAAI,CACtB,EACDC,YAAa,SAAUJ,GAErB,OADgBA,EAAQE,QACTC,OAAS,EAAI,CAC7B,EACDE,YAlBkBC,EAAiB,sCAmBnCC,OAAQ,CACNC,MAAO,OACPV,SAAS,EACTW,MAAO,SAAUT,GACf,OAAOU,EAAaV,EAAQW,QAAQjB,QAAQkB,gBAC7C,EACDC,KAAM,CACJC,KAAM,GACNC,OAAQ,KAEVC,SAAU,MACVC,SAAU,UAEZC,SAAU,CACRV,MAAO,SACPV,SAAS,EACTW,MAAO,SAAUT,GACf,OAAOU,EAAaV,EAAQW,QAAQjB,QAAQkB,gBAC7C,EACDC,KAAM,CACJC,KAAM,GACNC,OAAQ,KAEVI,QAAS,KAKFC,EAAiB,CAACzB,EAAK0B,KAClC,MAAMC,EAAUC,EACd5B,EAAID,SAAS8B,cAAgB,eAG/B,MAAO,CACLZ,gBAAiB,SAAUZ,GACzB,MAAMyB,EAAUzB,EAAQE,QAClBwB,EACyB,iBAAtB1B,EAAQ0B,UAAyB1B,EAAQ0B,UAAY,EACxDC,EAAcL,GAAWA,EAAQM,QAAW,EAElD,GAAIH,QAA8BxB,IAAnBwB,EAAQtB,OAAsB,CAC3C,MAAM0B,EAAaC,EAAmB9B,GACtC,OAAOsB,EAAQO,EAAaF,EACpC,CAKM,GAFuC,iBAA7BF,GAAWA,EAAQM,QAC1BC,MAAMC,QAAQR,GAAWA,EAAQM,OAGlC/B,EAAQkC,KACRlC,EAAQkC,IAAIC,OACsB,iBAA3BnC,EAAQkC,IAAIC,MAAMC,KACzB,CACA,MAAMC,EAASC,OAAOtC,EAAQkC,IAAIC,MAAMC,MAAMG,MAAM,KAAK,GACnDpC,EAASqC,OAAOC,KAAKhB,EAAQM,MAAQ,CAAA,GACrCW,EAAMC,KAAKC,IAAI,EAAGzC,EAAO0C,QAAQR,IACvC,OAAOf,EAAQoB,EAAMf,EAC7B,CAEM,OAAOL,EAAQI,EAAYC,EAC5B,EACF,EAWGG,EAAsB9B,IAC1B,MAAMyB,EAAUzB,EAAQE,QACxB,IAAImB,EAAQ,EAEZ,QAAuBpB,IAAnBwB,EAAQtB,OAAsB,CAChC,MAAM2C,EAAY9C,EAAQ0B,UACpBqB,EAAWtB,EAAQtB,OAASsB,EAAQtB,OAAO,GAAK,KAChD6C,EACoB,iBAAjBvB,EAAQM,OAAsBC,MAAMC,QAAQR,EAAQM,MAC7D,IAAIkB,EAAS,GAEb,GAAID,GAGF,GAFAC,EAAST,OAAOC,KAAKhB,EAAQM,MAEzB/B,EAAQkC,IAAK,CACf,MACMgB,EADOlD,EAAQkC,IAAIC,MAAMC,KACXG,MAAM,KAAK,GAE/BlB,EAAQ4B,EAAOJ,QAAQK,EAC/B,MACW,CACLzB,EAAQM,KAAKoB,SAASC,IACfH,EAAOI,SAASD,EAAKL,KACxBE,EAAOK,KAAKF,EAAKL,GAC3B,IAGM,MAAMQ,EAAO9B,EAAQ+B,KAAKV,GAEtBS,IACFlC,EAAQ4B,EAAOJ,QAAQU,EAAKpB,MAAMY,IAE1C,CACA,CAEE,OAAO1B,EAAQ,EAAI,EAAIA,CAAK"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@kyndryl-design-system/shidoka-charts",
|
|
3
|
-
"version": "2.5.
|
|
3
|
+
"version": "2.5.4",
|
|
4
4
|
"description": "Shidoka Charts",
|
|
5
5
|
"license": "MIT",
|
|
6
6
|
"main": "index.js",
|
|
@@ -26,7 +26,7 @@
|
|
|
26
26
|
"prepare": "npx husky install"
|
|
27
27
|
},
|
|
28
28
|
"dependencies": {
|
|
29
|
-
"@kyndryl-design-system/shidoka-foundation": "^2.
|
|
29
|
+
"@kyndryl-design-system/shidoka-foundation": "^2.7.0",
|
|
30
30
|
"@kyndryl-design-system/shidoka-icons": "^2.0.0",
|
|
31
31
|
"@sgratzl/chartjs-chart-boxplot": "^4.4.4",
|
|
32
32
|
"chart.js": "^4.4.0",
|