chartjs-chart-sankey 0.15.3 → 0.16.1

package/README.md

@@ -1,7 +1,5 @@
 # chartjs-chart-sankey
 
-[Chart.js](https://www.chartjs.org/) **^3.3** module for creating sankey diagrams
-
 [![npm](https://img.shields.io/npm/v/chartjs-chart-sankey.svg)](https://www.npmjs.com/package/chartjs-chart-sankey)
 [![release](https://img.shields.io/github/release/kurkle/chartjs-chart-sankey.svg?style=flat-square)](https://github.com/kurkle/chartjs-chart-sankey/releases/latest)
 ![npm bundle size](https://img.shields.io/bundlephobia/min/chartjs-chart-sankey.svg)
@@ -10,165 +8,60 @@
 [![documentation](https://img.shields.io/static/v1?message=Documentation&color=informational)](https://chartjs-chart-sankey.pages.dev)
 ![GitHub](https://img.shields.io/github/license/kurkle/chartjs-chart-sankey.svg)
 
-## Browser support
-
-All modern and up-to-date browsers are supported, including, but not limited to:
-
-- Chrome
-- Edge
-- Firefox
-- Safari
-
-Internet Explorer 11 is not supported.
-
-## Typescript
-
-Typescript 3.x and higher is supported.
+[Chart.js](https://www.chartjs.org/) **v3.3+, v4+** module that adds a sankey chart type, drawing flows between named nodes as directional bands whose width is proportional to the flow value — useful for visualizing energy transfers, budgets, funnels, and other flow-style data, for anyone already charting with Chart.js.
 
-## Documentation
-
-You can find documentation for chartjs-chart-sankey at [https://chartjs-chart-sankey.pages.dev/](https://chartjs-chart-sankey.pages.dev/).
-
-## Integration
+## Example
 
-You can use **chartjs-chart-sankey.js** as ES module. You'll need to manually register two components
+![Sankey Example Image](test/fixtures/energy.png)
 
-```js
-import {Chart} from 'chart.js';
-import {SankeyController, Flow} from 'chartjs-chart-sankey';
+## Installation
 
-Chart.register(SankeyController, Flow);
+```bash
+npm install chartjs-chart-sankey
 ```
 
-For script tag usage, load the browser bundle after Chart.js. The browser bundle registers the sankey controller
-and flow element automatically.
+Or via CDN:
 
 ```html
 <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
 <script src="https://cdn.jsdelivr.net/npm/chartjs-chart-sankey"></script>
 ```
 
-The same bundle can be loaded from UNPKG:
-
-```html
-<script src="https://unpkg.com/chart.js"></script>
-<script src="https://unpkg.com/chartjs-chart-sankey"></script>
-```
-
-If a CDN does not use the package metadata for its default file, reference the browser bundle directly:
-
-```html
-<script src="https://cdn.jsdelivr.net/npm/chartjs-chart-sankey/dist/chartjs-chart-sankey.min.js"></script>
-```
-
-To create a sankey chart, include chartjs-chart-sankey.js after chart.js and then create the chart by setting the `type`
-attribute to `'sankey'`
+## Quickstart
 
 ```js
-const chart = new Chart(ctx, {
-  type: 'sankey',
-  data: dataObject
-});
-```
-
-## Configuration
-
-Example:
-
-```js
-const colors = {
-  a: 'red',
-  b: 'green',
-  c: 'blue',
-  d: 'gray'
-};
-
-const getHover = (key) => colors[key];
-const getColor = (key) => colors[key];
-
-const chart = new Chart(ctx, {
-  type: 'sankey',
-  data: {
-    datasets: [{
-      label: 'My sankey',
-      data: [
-        {from: 'a', to: 'b', flow: 10},
-        {from: 'a', to: 'c', flow: 5},
-        {from: 'b', to: 'c', flow: 10},
-        {from: 'd', to: 'c', flow: 7}
-      ],
-      colorFrom: (c) => getColor(c.dataset.data[c.dataIndex].from),
-      colorTo: (c) => getColor(c.dataset.data[c.dataIndex].to),
-      hoverColorFrom: (c) => getHover(c.dataset.data[c.dataIndex].from),
-      hoverColorTo: (c) => getHover(c.dataset.data[c.dataIndex].to),
-      colorMode: 'gradient', // or 'from' or 'to'
-      /* optionally override default alpha (0.5) applied to colorFrom and colorTo */
-      alpha: 1,
-      /* optional labels */
-      labels: {
-        a: 'Label A',
-        b: 'Label B',
-        c: 'Label C',
-        d: 'Label D'
-      },
-      /* optional priority */
-      priority: {
-        b: 1,
-        d: 0
-      },
-      /* optional column overrides */
-      column: {
-        d: 1
-      },
-      size: 'max', // or 'min' if flow overlap is preferred
-    }]
-  },
-});
-```
-
-### Custom data structure
+import { Chart, LinearScale } from 'chart.js';
+import { Flow, SankeyController } from 'chartjs-chart-sankey';
 
-Custom data structure can be used by specifying the custom data keys in `options.parsing`.
-For example:
+Chart.register(LinearScale, SankeyController, Flow);
 
-```js
-const chart = new Chart(ctx, {
+new Chart(document.getElementById('chart'), {
   type: 'sankey',
   data: {
     datasets: [
       {
+        label: 'My sankey',
         data: [
-          {source: 'a', destination: 'b', value: 20},
-          {source: 'c', destination: 'd', value: 10},
-          {source: 'c', destination: 'e', value: 5},
+          {from: 'a', to: 'b', flow: 10},
+          {from: 'a', to: 'c', flow: 5},
+          {from: 'b', to: 'd', flow: 6},
+          {from: 'c', to: 'd', flow: 4},
         ],
-        colorFrom: 'red',
-        colorTo: 'green'
-      }
-    ]
+      },
+    ],
   },
-  options: {
-    parsing: {
-      from: 'source',
-      to: 'destination',
-      flow: 'value'
-    }
-  }
 });
 ```
 
-## Example
+See more integration options (script tag, other module loaders) in the [documentation](https://chartjs-chart-sankey.pages.dev/integration/).
 
-![Sankey Example Image](test/fixtures/energy.png)
-
-## Online examples
+## Documentation
 
-[codepen](https://codepen.io/kurkle/pen/bGVKPOM)
-[Vue.js 2](https://codesandbox.io/s/reverent-boyd-od2fr?file=/src/App.vue)
+You can find documentation for chartjs-chart-sankey at [https://chartjs-chart-sankey.pages.dev/](https://chartjs-chart-sankey.pages.dev/). The full dataset and options reference lives there, not in this README — this file stays a quickstart.
 
 ## Development
 
-You first need to install node dependencies  (requires [Node.js](https://nodejs.org/)):
+You first need to install node dependencies (requires [Node.js](https://nodejs.org/)):
 
 ```bash
 > npm install
@@ -177,12 +70,10 @@ You first need to install node dependencies  (requires [Node.js](https://nodejs.
 The following commands will then be available from the repository root:
 
 ```bash
-> npm run build         // build dist files
+> npm run build        // build dist files
 > npm run autobuild     // build and watch for changes
 > npm test              // run all tests
-> npm autotest          // run all tests and watch for changes
-> npm lint              // perform code linting
-> npm package           // create an archive with dist files and samples
+> npm run lint          // perform code linting
 ```
 
 ## License

package/dist/chartjs-chart-sankey.cjs

@@ -1,5 +1,5 @@
 /*!
- * chartjs-chart-sankey v0.15.3
+ * chartjs-chart-sankey v0.16.1
  * https://chartjs-chart-sankey.pages.dev/
  * (c) 2026 Jukka Kurkela
  * Released under the MIT license
@@ -854,6 +854,14 @@ SankeyController.defaults = {
                 }
             }
         },
+        resize: {
+            animations: {
+                progress: {
+                    delay: 0,
+                    duration: 0
+                }
+            }
+        },
         show: {
             animations: {
                 colors: {

package/dist/chartjs-chart-sankey.esm.js

@@ -1,5 +1,5 @@
 /*!
- * chartjs-chart-sankey v0.15.3
+ * chartjs-chart-sankey v0.16.1
  * https://chartjs-chart-sankey.pages.dev/
  * (c) 2026 Jukka Kurkela
  * Released under the MIT license
@@ -851,6 +851,14 @@ SankeyController.defaults = {
                 }
             }
         },
+        resize: {
+            animations: {
+                progress: {
+                    delay: 0,
+                    duration: 0
+                }
+            }
+        },
         show: {
             animations: {
                 colors: {

package/dist/chartjs-chart-sankey.min.js

@@ -1,7 +1,7 @@
 /*!
- * chartjs-chart-sankey v0.15.3
+ * chartjs-chart-sankey v0.16.1
  * https://chartjs-chart-sankey.pages.dev/
  * (c) 2026 Jukka Kurkela
  * Released under the MIT license
  */
-!function(t,o){"object"==typeof exports&&"undefined"!=typeof module?o(exports,require("chart.js"),require("chart.js/helpers")):"function"==typeof define&&define.amd?define(["exports","chart.js","chart.js/helpers"],o):o((t="undefined"!=typeof globalThis?globalThis:t||self)["chartjs-chart-sankey"]={},t.Chart,t.Chart.helpers)}(this,function(t,o,e){"use strict";const r=t=>void 0!==t;function n(t){return t&&-1!==["min","max"].indexOf(t)?t:"max"}function i(t,o){return"function"==typeof t?t(o):t&&"object"==typeof t&&!function(t){const o=Object.prototype.toString.call(t);return"[object CanvasPattern]"===o||"[object CanvasGradient]"===o}(t)?t[o.key]:t}function a(t,o,e,r,n,i,a){t.save(),t.fillStyle=o,a>0?(!function(t,o,e,r,n,i){const a=Math.max(0,Math.min(i,r/2,n/2));t.beginPath(),t.moveTo(o+a,e),t.lineTo(o+r-a,e),t.quadraticCurveTo(o+r,e,o+r,e+a),t.lineTo(o+r,e+n-a),t.quadraticCurveTo(o+r,e+n,o+r-a,e+n),t.lineTo(o+a,e+n),t.quadraticCurveTo(o,e+n,o,e+n-a),t.lineTo(o,e+a),t.quadraticCurveTo(o,e,o+a,e),t.closePath()}(t,e,r,n,i,a),t.fill()):t.fillRect(e,r,n,i),t.restore()}function s(t,o,e){const r=function(t){if(!t)return[];const o=[],e=Array.isArray(t)?t:[t];for(;e.length;){const t=e.pop();"string"==typeof t?o.unshift(...t.split("\n")):Array.isArray(t)?e.push(...t):t&&o.unshift(`${t}`)}return o}(o);if(!r.length)return;const{backgroundColor:n,borderRadius:i,color:s,font:l,lineOffset:h,padding:c}=e,d=function(t,o){return"auto"===t?o:t}(e.position,e.autoPosition),f=Number(l.lineHeight);t.font=l.string;const u=Math.max(...r.map(o=>t.measureText(o).width)),p=f*r.length,y=function(t,o,e){const{borderWidth:r,height:n,padding:i,width:a,x:s,y:l}=o,h={align:"center",x:s+a/2,y:l+n/2};return"left"===t?(h.align="right",h.x=s-r-i):"right"===t?(h.align="left",h.x=s+a+r+i):"top"===t?h.y=l-i-e/2:"bottom"===t&&(h.y=l+n+i+e/2),h}(d,e,p);t.textAlign=y.align,t.textBaseline="middle";const x=u+2*c,g=p+2*c,m=function(t,o,e,r,n){return"left"===t?o-n:"right"===t?o-e-n:o-r/2}(y.align,y.x,u,x,c),w=1===r.length?y.y:y.y-p/2+h,b=w+(r.length-1)*f/2;void 0!==n&&a(t,n,m,b-g/2,x,g,i),t.fillStyle=s;for(let o=0;o<r.length;o++)t.fillText(r[o],y.x,w+o*f)}const l=(t,o)=>o.flow===t.flow?t.index-o.index:o.flow-t.flow;function h(t,{size:o,priority:e,column:r}){const i=new Map;for(let o=0;o<t.length;o++){const{from:e,to:r,flow:n}=t[o],a=i.get(e)??{from:[],in:0,key:e,out:0,size:0,to:[]},s=(e===r?a:i.get(r))??{from:[],in:0,key:r,out:0,size:0,to:[]};a.out+=n,a.to.push({addY:0,flow:n,index:o,key:r,node:s}),1===a.to.length&&i.set(e,a),s.in+=n,s.from.push({addY:0,flow:n,index:o,key:e,node:a}),1===s.from.length&&i.set(r,s)}return((t,o)=>{const e=n(o);for(const o of t.values())o.from.sort(l),o.to.sort(l),o.size=Math[e](o.in||o.out,o.out||o.in)})(i,o),((t,o)=>{if(o)for(const e of t.values())e.key in o&&(e.priority=o[e.key])})(i,e),((t,o)=>{if(o)for(const e of t.values())e.key in o&&(e.column=!0,e.x=o[e.key])})(i,r),i}const c=1e-6;function d(t){return t.x??0}function f(t){return t.y??0}const u=(t,o=new Set)=>{const e=[];for(const r of t)o.has(r.key)||(o.add(r.key),e.push(r.key,...u(r.to.map(t=>t.node),o)));return e},p=(t,o)=>{const e=o.filter(t=>0===t.from.length),r=e.map(t=>t.key),n=u(e),i=new Set(n);for(const o of t)i.has(o.from)||i.has(o.to)||(r.push(o.from),i.add(o.from)),i.add(o.to);return r},y=(t,o)=>{const e=new Set(t.filter(t=>o.has(t.from)).map(t=>t.to)),r=[...o],n=r.filter(t=>!e.has(t));return n.length?n:r.slice(0,1)};let x=-1;function g(t,o,e=function(){return x=x<100?x+1:0,x}()){let r=0;for(const n of t)n.node._visited!==e&&(n.node._visited=e,r+=n.node[o].length+g(n.node[o],o,e));return r}const m=t=>(o,e)=>g(o.node[t],t)-g(e.node[t],t)||o.node[t].length-e.node[t].length;function w(t,o){if(!t.from.length)return o;t.from.sort(m("from"));for(const e of t.from){const t=e.node;r(t.y)||(t.y=o,w(t,o?o+c:0)),o=Math.max(t.y+t.out,o)}return f(t)+t.size}const b=(t,o)=>Boolean(o&&d(o)<d(t));function M(t,o){if(!t.to.length)return o;t.to.sort(m("to"));for(let e=0;e<t.to.length;e++){const n=t.to[e],i=n.node;r(i.y)||(i.y=o,M(i,o?o+c:0)),b(i,t.to[e+1]?.node)?o+=n.flow:o=Math.max(i.y+Math.max(i.in,i.out),o)}return f(t)+t.size}function v(t,o){return r(t.y)?t.y:(t.y=o,o)}function k(t,o){if(!t.length)return 0;const e=((t,o)=>{const e=[...t].sort((t,o)=>t.size-o.size),r=e[e.length-1].size,n=t.filter(t=>t.size===r),i=n[0];if(1===n.length)return i;if(n.sort((t,o)=>d(t)-d(o)),0===d(i))return i;const a=n[n.length-1];return d(a)===o?a:n[Math.floor(n.length/2)]})(t,o);return e.y=0,w(e,0),M(e,0),function(t,o){const e=t.filter(t=>0===t.x),n=t.filter(t=>t.x===o),i=e.filter(t=>!r(t.y)),a=n.filter(t=>!r(t.y)),s=t.filter(t=>d(t)>0&&d(t)<o&&!r(t.y));let l=e.reduce((t,o)=>Math.max(t,f(o)+o.out||0),0)+c,h=n.reduce((t,o)=>Math.max(t,f(o)+o.in||0),0)+c,u=0;l>=h?(i.forEach(t=>{l=v(t,l),l=Math.max(l+t.out,M(t,l))}),a.forEach(t=>{h=v(t,h),h=Math.max(h+t.in,w(t,h))})):(i.forEach(t=>{l=v(t,l)}),a.forEach(t=>{h=v(t,h),h=Math.max(h+t.in,w(t,h))})),s.forEach(o=>{let e=t.filter(t=>d(t)===d(o)&&r(t.y)).reduce((t,o)=>Math.max(t,f(o)+Math.max(o.in,o.out)),0);e=v(o,e),e=Math.max(e+o.in,w(o,e)),e=Math.max(e+o.out,M(o,e)),u=Math.max(u,e)}),Math.max(l,h,u)}(t,o),((t,o)=>{let e=0;for(let r=0;r<=o;r++){const o=t.filter(t=>d(t)===r).sort((t,o)=>f(t)-f(o));let n=0;for(const t of o)f(t)<n&&(t.y=n),n=f(t)+t.size;e=Math.max(e,n)}return e})(t,o)}const _=(t,o)=>d(t)!==d(o)?d(t)-d(o):f(t)===f(o)?t.size-o.size:f(t)-f(o);function C(t,o,{priority:e,height:n,nodePadding:i,modeX:a}){const s=[...t.values()],l=function(t,o,e){const n=o.filter(t=>t.from!==t.to),i=[...t.keys()],a=[...t.values()],s=new Set(i);let l=0;for(;s.size;){const e=0===l?p(o,a):y(n,s);if(!e.length)throw new Error("Fatal error: Unable to place nodes to columns. Please report this issue.");for(const o of e){const e=t.get(o);e&&!r(e.x)&&(e.x=l),s.delete(o)}s.size&&l++}const h=a.reduce((t,o)=>Math.max(t,d(o)),0);if("edge"===e){const e=new Set(o.map(t=>t.from));i.filter(t=>!e.has(t)).forEach(o=>{const e=t.get(o);e&&!e.column&&(e.x=h)})}return h}(t,o,a??"edge"),h=e?function(t,o){let e=0,r=0;for(let n=0;n<=o;n++){let o=r;const i=t.filter(t=>d(t)===n).sort((t,o)=>(t.priority??0)-(o.priority??0));if(i.length){const o=t.reduce((t,o)=>d(o)>n?Math.min(t,d(o)):t,1/0);r=i[0].to.filter(t=>d(t.node)>o).reduce((t,o)=>t+o.flow,0)||0}for(const t of i)t.y=o,o+=Math.max(t.out,t.in);e=Math.max(o,e)}return e}(s,l):k(s,l),c=function(t,o){let e=0;const r=new Map,n=[],i=t=>{if(!r.has(t)){const o=n.length;return r.set(t,o),n.push([]),o}return r.get(t)??0};t.sort(_);for(const r of t){const t=i(d(r)),a=n[t]??[];if(f(r)){a.push(f(r));let e=a.length;if(r.in){for(let o=0;o<t;o++){const t=n[o]??[];for(let o=0;o<t.length&&!(t[o]>f(r));o++)e=Math.max(o+1,e)}for(;a.length<e;)a.push(f(r))}r.y=f(r)+e*o}e=Math.max(e,f(r)+Math.max(r.in,r.out))}return e}(s,h/n*i);return function(t){t.forEach(t=>{const o=t.size,e=o<t.in,r=o<t.out;let n=0,i=t.from.length;t.from.sort((t,o)=>f(t.node)+t.node.out/2-(f(o.node)+o.node.out/2)).forEach((t,r)=>{e?t.addY=r*(o-t.flow)/(i-1):(t.addY=n,n+=t.flow)}),n=0,i=t.to.length,t.to.sort((t,o)=>f(t.node)+t.node.in/2-(f(o.node)+o.node.in/2)).forEach((t,e)=>{r?t.addY=e*(o-t.flow)/(i-1):(t.addY=n,n+=t.flow)})})}(s),{maxX:l,maxY:c}}function P(t){return t.x??0}function T(t){return t.y??0}function S(t,o){return Math[o](t.in||t.out,t.out||t.in)}function z(t,o,e,r){return"vertical"===r?o<(e.top+e.bottom)/2?"bottom":"top":t<(e.left+e.right)/2?"right":"left"}function F(t,o,e){for(const r of t)if(r.key===o&&r.index===e)return r.addY;return 0}function E(t,o,e,r,n,i,a,s,l){return"vertical"===l?{_custom:{flow:n,from:t,height:a.parse(n,i),to:o,x:a.parse(r,i),y:s.parse(P(o),i)},x:a.parse(e,i),y:s.parse(P(t),i)}:{_custom:{flow:n,from:t,height:s.parse(n,i),to:o,x:a.parse(P(o),i),y:s.parse(r,i)},x:a.parse(P(t),i),y:s.parse(e,i)}}function R(t,o,e,r,n,i,a,s){const l=t._custom,h=o.getPixelForValue(t.x),c=e.getPixelForValue(t.y);return"vertical"===s?{flow:l.flow,from:l.from,height:0,to:l.to,width:Math.abs(o.getPixelForValue(t.x+l.height)-h),x:h,x2:o.getPixelForValue(l.x),y:W(e,t.y,r,i)+n+a,y2:W(e,l.y,r,i)-a}:{flow:l.flow,from:l.from,height:Math.abs(e.getPixelForValue(t.y+l.height)-c),to:l.to,width:0,x:W(o,t.x,r,i)+n+a,x2:W(o,l.x,r,i)-a,y:c,y2:e.getPixelForValue(l.y)}}function W(t,o,e,r){const n=t.getPixelForValue(o);return e?n-o/e*r:n}function X(t,o,e){const r="vertical"===o?e.height-e.chartArea.bottom:e.width-e.chartArea.right;return Math.max(0,t+3-r)}function Y(t,o,e,r,n,i,a,s){if("vertical"===s){const s=e.getPixelForValue(T(t));return{height:i,width:Math.abs(e.getPixelForValue(T(t)+o)-s),x:s,y:W(r,P(t),n,a)}}const l=r.getPixelForValue(T(t));return{height:Math.abs(r.getPixelForValue(T(t)+o)-l),width:i,x:W(e,P(t),n,a),y:l}}function j(t,o){const{backgroundColor:e,borderRadius:r=0,color:n,display:a,font:s,padding:l=4,position:h}=t.nodeLabels??{};return{backgroundColor:i(e,o),borderRadius:r,color:i(n,o)??t.color??"black",display:i(a,o)??!0,font:s,padding:l,position:i(h,o)??"auto"}}class O extends o.DatasetController{parseObjectData(t,o,e,r){const n=((t,o)=>{const{from:e="from",to:r="to",flow:n="flow"}=o;return t.map(({[e]:t,[r]:o,[n]:i})=>({flow:i,from:t,to:o}))})(o,this.options.parsing),{xScale:i,yScale:a}=t,s=[],l=h(n,this.options),c=this.options.orientation??"horizontal";this._nodes=l;const{maxX:d,maxY:f}=C(l,n,{height:"vertical"===c?this.chart.canvas.width:this.chart.canvas.height,modeX:this.options.modeX,nodePadding:this.options.nodePadding??10,priority:!!this.options.priority});if(this._maxX=d,this._maxY=f,!i||!a)return[];for(let t=0,o=n.length;t<o;++t){const o=n[t],e=l.get(o.from),r=l.get(o.to);if(!e||!r)continue;const h=T(e)+F(e.to,o.to,t),d=T(r)+F(r.from,o.from,t);s.push(E(e,r,h,d,o.flow,t,i,a,c))}return s.slice(e,e+r)}getMinMax(t){return{max:t===("vertical"===this.options.orientation?this._cachedMeta.yScale:this._cachedMeta.xScale)?this._maxX:this._maxY,min:0}}update(t){const{data:o}=this._cachedMeta;this.updateElements(o,0,o.length,t)}updateElements(t,o,e,r){const{xScale:n,yScale:i}=this._cachedMeta;if(!n||!i)return;const a=this.resolveDataElementOptions(o,r),s=this.getSharedOptions(a),{borderWidth:l,nodeWidth:h=10,orientation:c="horizontal"}=this.options,d=X(h,c,this.chart),f=l?l/2+.5:0;for(let a=o;a<o+e;a++){const o=this.getParsed(a);this.updateElement(t[a],a,{options:this.resolveDataElementOptions(a,r),progress:"reset"===r?0:1,...R(o,n,i,this._maxX,h,d,f,c)},r)}s&&this.updateSharedOptions(s,r,a)}_drawLabels(){const t=this.chart.ctx,r=this.options,i=this._nodes||new Map,a=n(r.size),l=r.labels,{borderWidth:h=1,nodeWidth:c=10,orientation:d="horizontal"}=r,f=X(c,d,this.chart),u=r.font??this.chart.options.font??o.Chart.defaults.font,{xScale:p,yScale:y}=this._cachedMeta;if(!p||!y)return;t.save();const x=this.chart.chartArea;for(const o of i.values()){const n=S(o,a),{height:i,width:g,x:m,y:w}=Y(o,n,p,y,this._maxX,c,f,d),b=l?.[o.key]??o.key,M=j(r,o);if(M.display){const o=e.toFont(M.font??u);s(t,b,{autoPosition:z(m,w,x,d),backgroundColor:M.backgroundColor,borderRadius:M.borderRadius,borderWidth:h,color:M.color,font:o,height:i,lineOffset:e.valueOrDefault(r.padding,o.lineHeight/2),padding:M.padding,position:M.position,width:g,x:m,y:w})}}t.restore()}_drawNodes(){const t=this.chart.ctx,o=this._nodes||new Map,{borderColor:e,borderWidth:r=0,nodeWidth:i=10,orientation:a="horizontal",size:s}=this.options,l=X(i,a,this.chart),h=n(s),{xScale:c,yScale:d}=this._cachedMeta;t.save(),e&&r&&(t.strokeStyle=e,t.lineWidth=r);for(const e of o.values()){if(t.fillStyle=e.color??"black",!c||!d)return;const o=Math[h](e.in||e.out,e.out||e.in),{height:n,width:s,x:f,y:u}=Y(e,o,c,d,this._maxX,i,l,a);r&&t.strokeRect(f,u,s,n),t.fillRect(f,u,s,n)}t.restore()}draw(){const t=this.chart.ctx,o=this.getMeta().data??[],e=[];for(let t=0,r=o.length;t<r;++t){const r=o[t];r.from&&r.to&&(r.from.color=r.options.colorFrom,r.to.color=r.options.colorTo,r.active&&e.push(r))}for(const t of e)t.from&&t.to&&(t.from.color=t.options.colorFrom,t.to.color=t.options.colorTo);this._drawNodes();for(let e=0,r=o.length;e<r;++e)o[e].draw(t);this._drawLabels()}constructor(...t){super(...t),this._nodes=new Map,this._maxX=0,this._maxY=0}}O.id="sankey",O.descriptors={_indexable:!1,_scriptable:!0,nodeLabels:{_indexable:!1,_scriptable:!1}},O.defaults={animations:{colors:{properties:["colorFrom","colorTo"],type:"color"},numbers:{properties:["x","y","x2","y2","height","width"],type:"number"},progress:{delay:t=>"data"===t.type?500*t.parsed["vertical"===t.dataset.orientation?"y":"x"]+20*t.dataIndex:void 0,duration:t=>"data"===t.type?200*(t.parsed._custom["vertical"===t.dataset.orientation?"y":"x"]-t.parsed["vertical"===t.dataset.orientation?"y":"x"]):void 0,easing:"linear"}},borderColor:"black",borderWidth:1,color:"black",dataElementType:"flow",modeX:"edge",nodePadding:10,nodeWidth:10,orientation:"horizontal",transitions:{hide:{animations:{colors:{properties:["colorFrom","colorTo"],to:"transparent",type:"color"}}},show:{animations:{colors:{from:"transparent",properties:["colorFrom","colorTo"],type:"color"}}}}},O.overrides={datasets:{clip:!1,parsing:{flow:"flow",from:"from",to:"to"}},interaction:{intersect:!0,mode:"nearest"},layout:{padding:{bottom:3,left:3,right:13,top:3}},plugins:{legend:{display:!1},tooltip:{callbacks:{label(t){const o=t.parsed._custom;return`${o.from.key} -> ${o.to.key}: ${o.flow}`},title:()=>""}}},scales:{x:{bounds:"data",display:!1,min:0,offset:!1,type:"linear"},y:{bounds:"data",display:!1,min:0,offset:!1,reverse:!0,type:"linear"}}};const V=(t,o,e,r,n)=>"vertical"===n?o<r?{cp1:{x:t,y:o+(r-o)/3*2},cp2:{x:e,y:o+(r-o)/3}}:{cp1:{x:0,y:o-(o-r)/3},cp2:{x:0,y:r+(o-r)/3}}:t<e?{cp1:{x:t+(e-t)/3*2,y:o},cp2:{x:t+(e-t)/3,y:r}}:{cp1:{x:t-(t-e)/3,y:0},cp2:{x:e+(t-e)/3,y:0}},L=(t,o,e)=>({x:t.x+e*(o.x-t.x),y:t.y+e*(o.y-t.y)}),A=(t,o)=>e.color(t).alpha(o).rgbString(),q=(t,o)=>"string"==typeof t?A(t,o):t,D=t=>"string"==typeof t?e.getHoverColor(t):t;class $ extends o.Element{draw(t){const{x:r,x2:n,y:i,y2:a,height:l,progress:h,width:c}=this,d=this.options.orientation,f=V(r,i,n,a,d),u={height:l,width:c,x:r,x2:n,y:i,y2:a};if(0===h)return;t.save(),h<1&&function(t,{height:o,width:e,x:r,x2:n,y:i,y2:a},s,l){t.beginPath(),"vertical"===l?t.rect(Math.min(r,n),i,Math.abs(n-r)+e+1,(a-i)*s+1):t.rect(r,Math.min(i,a),(n-r)*s+1,Math.abs(a-i)+o+1),t.clip()}(t,u,h,d),function(t,{x:o,x2:e,y:r,y2:n,options:i}){let a="black";null!==i.flowColor?a=i.flowColor:"from"===i.colorMode?a=q(i.colorFrom,i.alpha):"to"===i.colorMode?a=q(i.colorTo,i.alpha):"string"==typeof i.colorFrom&&"string"==typeof i.colorTo&&(a="vertical"===i.orientation?t.createLinearGradient(0,r,0,n):t.createLinearGradient(o,0,e,0),a.addColorStop(0,A(i.colorFrom,i.alpha)),a.addColorStop(1,A(i.colorTo,i.alpha))),t.fillStyle=a,t.strokeStyle=a,t.lineWidth=.5}(t,this),function(t,{height:o,width:e,x:r,x2:n,y:i,y2:a},{cp1:s,cp2:l},h){t.beginPath(),t.moveTo(r,i),t.bezierCurveTo(s.x,s.y,l.x,l.y,n,a),"vertical"===h?(t.lineTo(n+e,a),t.bezierCurveTo(l.x+e,l.y,s.x+e,s.y,r+e,i)):(t.lineTo(n,a+o),t.bezierCurveTo(l.x,l.y+o,s.x,s.y+o,r,i+o)),t.lineTo(r,i),t.stroke(),t.closePath(),t.fill()}(t,u,f,d);const p=this.options.flowLabels;if(p.display){const r=e.toFont(p.font??o.Chart.defaults.font),n=function({height:t,width:o,x:e,x2:r,y:n,y2:i},a){return"vertical"===a?{height:i-n,width:Math.abs(r-e)+o,x:Math.min(e,r),y:n}:{height:Math.abs(i-n)+t,width:r-e,x:e,y:Math.min(n,i)}}(u,d);s(t,`${this.flow}`,{autoPosition:"center",backgroundColor:p.backgroundColor,borderRadius:p.borderRadius,borderWidth:0,color:p.color,font:r,height:n.height,lineOffset:r.lineHeight/2,padding:p.padding,position:p.position,width:n.width,x:n.x,y:n.y})}t.restore()}inRange(t,o,e){const{x:r,y:n,x2:i,y2:a,height:s,width:l}=this.getProps(["x","y","x2","y2","height","width"],e),h="vertical"===this.options.orientation;if(h?o<n||o>a:t<r||t>i)return!1;const{cp1:c,cp2:d}=V(r,n,i,a,this.options.orientation),f=h?(o-n)/(a-n):(t-r)/(i-r),u={x:i,y:a},p=L({x:r,y:n},c,f),y=L(c,d,f),x=L(d,u,f),g=L(p,y,f),m=L(y,x,f),w=L(g,m,f);return h?t>=w.x&&t<=w.x+l:o>=w.y&&o<=w.y+s}inXRange(t,o){const{x:e,x2:r,width:n}=this.getProps(["x","x2","width"],o),i=Math.min(e,r),a=Math.max(e,r)+("vertical"===this.options.orientation?n:0);return t>=i&&t<=a}inYRange(t,o){const{y:e,y2:r,height:n}=this.getProps(["y","y2","height"],o),i=Math.min(e,r),a=Math.max(e,r)+("vertical"===this.options.orientation?0:n);return t>=i&&t<=a}getCenterPoint(t){const{x:o,y:e,x2:r,y2:n,height:i,width:a}=this.getProps(["x","y","x2","y2","height","width"],t),s="vertical"===this.options.orientation;return{x:(o+r+(s?a:0))/2,y:(e+n+(s?0:i))/2}}tooltipPosition(t=!1){return this.getCenterPoint(t)}getRange(t){const o="vertical"===this.options.orientation;return"x"===t?o?this.width/2:0:o?0:this.height/2}constructor(t){super(),this.flow=0,this.x2=0,this.y2=0,this.width=0,this.height=0,this.progress=1,t&&Object.assign(this,t)}}$.id="flow",$.defaults={alpha:.5,colorFrom:"red",colorMode:"gradient",colorTo:"green",flowColor:null,flowLabels:{borderRadius:0,color:"black",display:!1,padding:4,position:"center"},hoverColorFrom:(t,o)=>D(o.colorFrom),hoverColorTo:(t,o)=>D(o.colorTo),orientation:"horizontal"},$.descriptors={_scriptable:!0,flowLabels:{_scriptable:!0}},o.Chart.register(O,$),t.Flow=$,t.SankeyController=O});
+!function(t,o){"object"==typeof exports&&"undefined"!=typeof module?o(exports,require("chart.js"),require("chart.js/helpers")):"function"==typeof define&&define.amd?define(["exports","chart.js","chart.js/helpers"],o):o((t="undefined"!=typeof globalThis?globalThis:t||self)["chartjs-chart-sankey"]={},t.Chart,t.Chart.helpers)}(this,function(t,o,e){"use strict";const r=t=>void 0!==t;function n(t){return t&&-1!==["min","max"].indexOf(t)?t:"max"}function i(t,o){return"function"==typeof t?t(o):t&&"object"==typeof t&&!function(t){const o=Object.prototype.toString.call(t);return"[object CanvasPattern]"===o||"[object CanvasGradient]"===o}(t)?t[o.key]:t}function a(t,o,e,r,n,i,a){t.save(),t.fillStyle=o,a>0?(!function(t,o,e,r,n,i){const a=Math.max(0,Math.min(i,r/2,n/2));t.beginPath(),t.moveTo(o+a,e),t.lineTo(o+r-a,e),t.quadraticCurveTo(o+r,e,o+r,e+a),t.lineTo(o+r,e+n-a),t.quadraticCurveTo(o+r,e+n,o+r-a,e+n),t.lineTo(o+a,e+n),t.quadraticCurveTo(o,e+n,o,e+n-a),t.lineTo(o,e+a),t.quadraticCurveTo(o,e,o+a,e),t.closePath()}(t,e,r,n,i,a),t.fill()):t.fillRect(e,r,n,i),t.restore()}function s(t,o,e){const r=function(t){if(!t)return[];const o=[],e=Array.isArray(t)?t:[t];for(;e.length;){const t=e.pop();"string"==typeof t?o.unshift(...t.split("\n")):Array.isArray(t)?e.push(...t):t&&o.unshift(`${t}`)}return o}(o);if(!r.length)return;const{backgroundColor:n,borderRadius:i,color:s,font:l,lineOffset:h,padding:c}=e,d=function(t,o){return"auto"===t?o:t}(e.position,e.autoPosition),f=Number(l.lineHeight);t.font=l.string;const u=Math.max(...r.map(o=>t.measureText(o).width)),p=f*r.length,y=function(t,o,e){const{borderWidth:r,height:n,padding:i,width:a,x:s,y:l}=o,h={align:"center",x:s+a/2,y:l+n/2};return"left"===t?(h.align="right",h.x=s-r-i):"right"===t?(h.align="left",h.x=s+a+r+i):"top"===t?h.y=l-i-e/2:"bottom"===t&&(h.y=l+n+i+e/2),h}(d,e,p);t.textAlign=y.align,t.textBaseline="middle";const g=u+2*c,x=p+2*c,m=function(t,o,e,r,n){return"left"===t?o-n:"right"===t?o-e-n:o-r/2}(y.align,y.x,u,g,c),w=1===r.length?y.y:y.y-p/2+h,b=w+(r.length-1)*f/2;void 0!==n&&a(t,n,m,b-x/2,g,x,i),t.fillStyle=s;for(let o=0;o<r.length;o++)t.fillText(r[o],y.x,w+o*f)}const l=(t,o)=>o.flow===t.flow?t.index-o.index:o.flow-t.flow;function h(t,{size:o,priority:e,column:r}){const i=new Map;for(let o=0;o<t.length;o++){const{from:e,to:r,flow:n}=t[o],a=i.get(e)??{from:[],in:0,key:e,out:0,size:0,to:[]},s=(e===r?a:i.get(r))??{from:[],in:0,key:r,out:0,size:0,to:[]};a.out+=n,a.to.push({addY:0,flow:n,index:o,key:r,node:s}),1===a.to.length&&i.set(e,a),s.in+=n,s.from.push({addY:0,flow:n,index:o,key:e,node:a}),1===s.from.length&&i.set(r,s)}return((t,o)=>{const e=n(o);for(const o of t.values())o.from.sort(l),o.to.sort(l),o.size=Math[e](o.in||o.out,o.out||o.in)})(i,o),((t,o)=>{if(o)for(const e of t.values())e.key in o&&(e.priority=o[e.key])})(i,e),((t,o)=>{if(o)for(const e of t.values())e.key in o&&(e.column=!0,e.x=o[e.key])})(i,r),i}const c=1e-6;function d(t){return t.x??0}function f(t){return t.y??0}const u=(t,o=new Set)=>{const e=[];for(const r of t)o.has(r.key)||(o.add(r.key),e.push(r.key,...u(r.to.map(t=>t.node),o)));return e},p=(t,o)=>{const e=o.filter(t=>0===t.from.length),r=e.map(t=>t.key),n=u(e),i=new Set(n);for(const o of t)i.has(o.from)||i.has(o.to)||(r.push(o.from),i.add(o.from)),i.add(o.to);return r},y=(t,o)=>{const e=new Set(t.filter(t=>o.has(t.from)).map(t=>t.to)),r=[...o],n=r.filter(t=>!e.has(t));return n.length?n:r.slice(0,1)};let g=-1;function x(t,o,e=function(){return g=g<100?g+1:0,g}()){let r=0;for(const n of t)n.node._visited!==e&&(n.node._visited=e,r+=n.node[o].length+x(n.node[o],o,e));return r}const m=t=>(o,e)=>x(o.node[t],t)-x(e.node[t],t)||o.node[t].length-e.node[t].length;function w(t,o){if(!t.from.length)return o;t.from.sort(m("from"));for(const e of t.from){const t=e.node;r(t.y)||(t.y=o,w(t,o?o+c:0)),o=Math.max(t.y+t.out,o)}return f(t)+t.size}const b=(t,o)=>Boolean(o&&d(o)<d(t));function M(t,o){if(!t.to.length)return o;t.to.sort(m("to"));for(let e=0;e<t.to.length;e++){const n=t.to[e],i=n.node;r(i.y)||(i.y=o,M(i,o?o+c:0)),b(i,t.to[e+1]?.node)?o+=n.flow:o=Math.max(i.y+Math.max(i.in,i.out),o)}return f(t)+t.size}function v(t,o){return r(t.y)?t.y:(t.y=o,o)}function k(t,o){if(!t.length)return 0;const e=((t,o)=>{const e=[...t].sort((t,o)=>t.size-o.size),r=e[e.length-1].size,n=t.filter(t=>t.size===r),i=n[0];if(1===n.length)return i;if(n.sort((t,o)=>d(t)-d(o)),0===d(i))return i;const a=n[n.length-1];return d(a)===o?a:n[Math.floor(n.length/2)]})(t,o);return e.y=0,w(e,0),M(e,0),function(t,o){const e=t.filter(t=>0===t.x),n=t.filter(t=>t.x===o),i=e.filter(t=>!r(t.y)),a=n.filter(t=>!r(t.y)),s=t.filter(t=>d(t)>0&&d(t)<o&&!r(t.y));let l=e.reduce((t,o)=>Math.max(t,f(o)+o.out||0),0)+c,h=n.reduce((t,o)=>Math.max(t,f(o)+o.in||0),0)+c,u=0;l>=h?(i.forEach(t=>{l=v(t,l),l=Math.max(l+t.out,M(t,l))}),a.forEach(t=>{h=v(t,h),h=Math.max(h+t.in,w(t,h))})):(i.forEach(t=>{l=v(t,l)}),a.forEach(t=>{h=v(t,h),h=Math.max(h+t.in,w(t,h))})),s.forEach(o=>{let e=t.filter(t=>d(t)===d(o)&&r(t.y)).reduce((t,o)=>Math.max(t,f(o)+Math.max(o.in,o.out)),0);e=v(o,e),e=Math.max(e+o.in,w(o,e)),e=Math.max(e+o.out,M(o,e)),u=Math.max(u,e)}),Math.max(l,h,u)}(t,o),((t,o)=>{let e=0;for(let r=0;r<=o;r++){const o=t.filter(t=>d(t)===r).sort((t,o)=>f(t)-f(o));let n=0;for(const t of o)f(t)<n&&(t.y=n),n=f(t)+t.size;e=Math.max(e,n)}return e})(t,o)}const _=(t,o)=>d(t)!==d(o)?d(t)-d(o):f(t)===f(o)?t.size-o.size:f(t)-f(o);function C(t,o,{priority:e,height:n,nodePadding:i,modeX:a}){const s=[...t.values()],l=function(t,o,e){const n=o.filter(t=>t.from!==t.to),i=[...t.keys()],a=[...t.values()],s=new Set(i);let l=0;for(;s.size;){const e=0===l?p(o,a):y(n,s);if(!e.length)throw new Error("Fatal error: Unable to place nodes to columns. Please report this issue.");for(const o of e){const e=t.get(o);e&&!r(e.x)&&(e.x=l),s.delete(o)}s.size&&l++}const h=a.reduce((t,o)=>Math.max(t,d(o)),0);if("edge"===e){const e=new Set(o.map(t=>t.from));i.filter(t=>!e.has(t)).forEach(o=>{const e=t.get(o);e&&!e.column&&(e.x=h)})}return h}(t,o,a??"edge"),h=e?function(t,o){let e=0,r=0;for(let n=0;n<=o;n++){let o=r;const i=t.filter(t=>d(t)===n).sort((t,o)=>(t.priority??0)-(o.priority??0));if(i.length){const o=t.reduce((t,o)=>d(o)>n?Math.min(t,d(o)):t,1/0);r=i[0].to.filter(t=>d(t.node)>o).reduce((t,o)=>t+o.flow,0)||0}for(const t of i)t.y=o,o+=Math.max(t.out,t.in);e=Math.max(o,e)}return e}(s,l):k(s,l),c=function(t,o){let e=0;const r=new Map,n=[],i=t=>{if(!r.has(t)){const o=n.length;return r.set(t,o),n.push([]),o}return r.get(t)??0};t.sort(_);for(const r of t){const t=i(d(r)),a=n[t]??[];if(f(r)){a.push(f(r));let e=a.length;if(r.in){for(let o=0;o<t;o++){const t=n[o]??[];for(let o=0;o<t.length&&!(t[o]>f(r));o++)e=Math.max(o+1,e)}for(;a.length<e;)a.push(f(r))}r.y=f(r)+e*o}e=Math.max(e,f(r)+Math.max(r.in,r.out))}return e}(s,h/n*i);return function(t){t.forEach(t=>{const o=t.size,e=o<t.in,r=o<t.out;let n=0,i=t.from.length;t.from.sort((t,o)=>f(t.node)+t.node.out/2-(f(o.node)+o.node.out/2)).forEach((t,r)=>{e?t.addY=r*(o-t.flow)/(i-1):(t.addY=n,n+=t.flow)}),n=0,i=t.to.length,t.to.sort((t,o)=>f(t.node)+t.node.in/2-(f(o.node)+o.node.in/2)).forEach((t,e)=>{r?t.addY=e*(o-t.flow)/(i-1):(t.addY=n,n+=t.flow)})})}(s),{maxX:l,maxY:c}}function P(t){return t.x??0}function T(t){return t.y??0}function z(t,o){return Math[o](t.in||t.out,t.out||t.in)}function S(t,o,e,r){return"vertical"===r?o<(e.top+e.bottom)/2?"bottom":"top":t<(e.left+e.right)/2?"right":"left"}function F(t,o,e){for(const r of t)if(r.key===o&&r.index===e)return r.addY;return 0}function E(t,o,e,r,n,i,a,s,l){return"vertical"===l?{_custom:{flow:n,from:t,height:a.parse(n,i),to:o,x:a.parse(r,i),y:s.parse(P(o),i)},x:a.parse(e,i),y:s.parse(P(t),i)}:{_custom:{flow:n,from:t,height:s.parse(n,i),to:o,x:a.parse(P(o),i),y:s.parse(r,i)},x:a.parse(P(t),i),y:s.parse(e,i)}}function R(t,o,e,r,n,i,a,s){const l=t._custom,h=o.getPixelForValue(t.x),c=e.getPixelForValue(t.y);return"vertical"===s?{flow:l.flow,from:l.from,height:0,to:l.to,width:Math.abs(o.getPixelForValue(t.x+l.height)-h),x:h,x2:o.getPixelForValue(l.x),y:W(e,t.y,r,i)+n+a,y2:W(e,l.y,r,i)-a}:{flow:l.flow,from:l.from,height:Math.abs(e.getPixelForValue(t.y+l.height)-c),to:l.to,width:0,x:W(o,t.x,r,i)+n+a,x2:W(o,l.x,r,i)-a,y:c,y2:e.getPixelForValue(l.y)}}function W(t,o,e,r){const n=t.getPixelForValue(o);return e?n-o/e*r:n}function X(t,o,e){const r="vertical"===o?e.height-e.chartArea.bottom:e.width-e.chartArea.right;return Math.max(0,t+3-r)}function Y(t,o,e,r,n,i,a,s){if("vertical"===s){const s=e.getPixelForValue(T(t));return{height:i,width:Math.abs(e.getPixelForValue(T(t)+o)-s),x:s,y:W(r,P(t),n,a)}}const l=r.getPixelForValue(T(t));return{height:Math.abs(r.getPixelForValue(T(t)+o)-l),width:i,x:W(e,P(t),n,a),y:l}}function j(t,o){const{backgroundColor:e,borderRadius:r=0,color:n,display:a,font:s,padding:l=4,position:h}=t.nodeLabels??{};return{backgroundColor:i(e,o),borderRadius:r,color:i(n,o)??t.color??"black",display:i(a,o)??!0,font:s,padding:l,position:i(h,o)??"auto"}}class O extends o.DatasetController{parseObjectData(t,o,e,r){const n=((t,o)=>{const{from:e="from",to:r="to",flow:n="flow"}=o;return t.map(({[e]:t,[r]:o,[n]:i})=>({flow:i,from:t,to:o}))})(o,this.options.parsing),{xScale:i,yScale:a}=t,s=[],l=h(n,this.options),c=this.options.orientation??"horizontal";this._nodes=l;const{maxX:d,maxY:f}=C(l,n,{height:"vertical"===c?this.chart.canvas.width:this.chart.canvas.height,modeX:this.options.modeX,nodePadding:this.options.nodePadding??10,priority:!!this.options.priority});if(this._maxX=d,this._maxY=f,!i||!a)return[];for(let t=0,o=n.length;t<o;++t){const o=n[t],e=l.get(o.from),r=l.get(o.to);if(!e||!r)continue;const h=T(e)+F(e.to,o.to,t),d=T(r)+F(r.from,o.from,t);s.push(E(e,r,h,d,o.flow,t,i,a,c))}return s.slice(e,e+r)}getMinMax(t){return{max:t===("vertical"===this.options.orientation?this._cachedMeta.yScale:this._cachedMeta.xScale)?this._maxX:this._maxY,min:0}}update(t){const{data:o}=this._cachedMeta;this.updateElements(o,0,o.length,t)}updateElements(t,o,e,r){const{xScale:n,yScale:i}=this._cachedMeta;if(!n||!i)return;const a=this.resolveDataElementOptions(o,r),s=this.getSharedOptions(a),{borderWidth:l,nodeWidth:h=10,orientation:c="horizontal"}=this.options,d=X(h,c,this.chart),f=l?l/2+.5:0;for(let a=o;a<o+e;a++){const o=this.getParsed(a);this.updateElement(t[a],a,{options:this.resolveDataElementOptions(a,r),progress:"reset"===r?0:1,...R(o,n,i,this._maxX,h,d,f,c)},r)}s&&this.updateSharedOptions(s,r,a)}_drawLabels(){const t=this.chart.ctx,r=this.options,i=this._nodes||new Map,a=n(r.size),l=r.labels,{borderWidth:h=1,nodeWidth:c=10,orientation:d="horizontal"}=r,f=X(c,d,this.chart),u=r.font??this.chart.options.font??o.Chart.defaults.font,{xScale:p,yScale:y}=this._cachedMeta;if(!p||!y)return;t.save();const g=this.chart.chartArea;for(const o of i.values()){const n=z(o,a),{height:i,width:x,x:m,y:w}=Y(o,n,p,y,this._maxX,c,f,d),b=l?.[o.key]??o.key,M=j(r,o);if(M.display){const o=e.toFont(M.font??u);s(t,b,{autoPosition:S(m,w,g,d),backgroundColor:M.backgroundColor,borderRadius:M.borderRadius,borderWidth:h,color:M.color,font:o,height:i,lineOffset:e.valueOrDefault(r.padding,o.lineHeight/2),padding:M.padding,position:M.position,width:x,x:m,y:w})}}t.restore()}_drawNodes(){const t=this.chart.ctx,o=this._nodes||new Map,{borderColor:e,borderWidth:r=0,nodeWidth:i=10,orientation:a="horizontal",size:s}=this.options,l=X(i,a,this.chart),h=n(s),{xScale:c,yScale:d}=this._cachedMeta;t.save(),e&&r&&(t.strokeStyle=e,t.lineWidth=r);for(const e of o.values()){if(t.fillStyle=e.color??"black",!c||!d)return;const o=Math[h](e.in||e.out,e.out||e.in),{height:n,width:s,x:f,y:u}=Y(e,o,c,d,this._maxX,i,l,a);r&&t.strokeRect(f,u,s,n),t.fillRect(f,u,s,n)}t.restore()}draw(){const t=this.chart.ctx,o=this.getMeta().data??[],e=[];for(let t=0,r=o.length;t<r;++t){const r=o[t];r.from&&r.to&&(r.from.color=r.options.colorFrom,r.to.color=r.options.colorTo,r.active&&e.push(r))}for(const t of e)t.from&&t.to&&(t.from.color=t.options.colorFrom,t.to.color=t.options.colorTo);this._drawNodes();for(let e=0,r=o.length;e<r;++e)o[e].draw(t);this._drawLabels()}constructor(...t){super(...t),this._nodes=new Map,this._maxX=0,this._maxY=0}}O.id="sankey",O.descriptors={_indexable:!1,_scriptable:!0,nodeLabels:{_indexable:!1,_scriptable:!1}},O.defaults={animations:{colors:{properties:["colorFrom","colorTo"],type:"color"},numbers:{properties:["x","y","x2","y2","height","width"],type:"number"},progress:{delay:t=>"data"===t.type?500*t.parsed["vertical"===t.dataset.orientation?"y":"x"]+20*t.dataIndex:void 0,duration:t=>"data"===t.type?200*(t.parsed._custom["vertical"===t.dataset.orientation?"y":"x"]-t.parsed["vertical"===t.dataset.orientation?"y":"x"]):void 0,easing:"linear"}},borderColor:"black",borderWidth:1,color:"black",dataElementType:"flow",modeX:"edge",nodePadding:10,nodeWidth:10,orientation:"horizontal",transitions:{hide:{animations:{colors:{properties:["colorFrom","colorTo"],to:"transparent",type:"color"}}},resize:{animations:{progress:{delay:0,duration:0}}},show:{animations:{colors:{from:"transparent",properties:["colorFrom","colorTo"],type:"color"}}}}},O.overrides={datasets:{clip:!1,parsing:{flow:"flow",from:"from",to:"to"}},interaction:{intersect:!0,mode:"nearest"},layout:{padding:{bottom:3,left:3,right:13,top:3}},plugins:{legend:{display:!1},tooltip:{callbacks:{label(t){const o=t.parsed._custom;return`${o.from.key} -> ${o.to.key}: ${o.flow}`},title:()=>""}}},scales:{x:{bounds:"data",display:!1,min:0,offset:!1,type:"linear"},y:{bounds:"data",display:!1,min:0,offset:!1,reverse:!0,type:"linear"}}};const V=(t,o,e,r,n)=>"vertical"===n?o<r?{cp1:{x:t,y:o+(r-o)/3*2},cp2:{x:e,y:o+(r-o)/3}}:{cp1:{x:0,y:o-(o-r)/3},cp2:{x:0,y:r+(o-r)/3}}:t<e?{cp1:{x:t+(e-t)/3*2,y:o},cp2:{x:t+(e-t)/3,y:r}}:{cp1:{x:t-(t-e)/3,y:0},cp2:{x:e+(t-e)/3,y:0}},L=(t,o,e)=>({x:t.x+e*(o.x-t.x),y:t.y+e*(o.y-t.y)}),A=(t,o)=>e.color(t).alpha(o).rgbString(),q=(t,o)=>"string"==typeof t?A(t,o):t,D=t=>"string"==typeof t?e.getHoverColor(t):t;class $ extends o.Element{draw(t){const{x:r,x2:n,y:i,y2:a,height:l,progress:h,width:c}=this,d=this.options.orientation,f=V(r,i,n,a,d),u={height:l,width:c,x:r,x2:n,y:i,y2:a};if(0===h)return;t.save(),h<1&&function(t,{height:o,width:e,x:r,x2:n,y:i,y2:a},s,l){t.beginPath(),"vertical"===l?t.rect(Math.min(r,n),i,Math.abs(n-r)+e+1,(a-i)*s+1):t.rect(r,Math.min(i,a),(n-r)*s+1,Math.abs(a-i)+o+1),t.clip()}(t,u,h,d),function(t,{x:o,x2:e,y:r,y2:n,options:i}){let a="black";null!==i.flowColor?a=i.flowColor:"from"===i.colorMode?a=q(i.colorFrom,i.alpha):"to"===i.colorMode?a=q(i.colorTo,i.alpha):"string"==typeof i.colorFrom&&"string"==typeof i.colorTo&&(a="vertical"===i.orientation?t.createLinearGradient(0,r,0,n):t.createLinearGradient(o,0,e,0),a.addColorStop(0,A(i.colorFrom,i.alpha)),a.addColorStop(1,A(i.colorTo,i.alpha))),t.fillStyle=a,t.strokeStyle=a,t.lineWidth=.5}(t,this),function(t,{height:o,width:e,x:r,x2:n,y:i,y2:a},{cp1:s,cp2:l},h){t.beginPath(),t.moveTo(r,i),t.bezierCurveTo(s.x,s.y,l.x,l.y,n,a),"vertical"===h?(t.lineTo(n+e,a),t.bezierCurveTo(l.x+e,l.y,s.x+e,s.y,r+e,i)):(t.lineTo(n,a+o),t.bezierCurveTo(l.x,l.y+o,s.x,s.y+o,r,i+o)),t.lineTo(r,i),t.stroke(),t.closePath(),t.fill()}(t,u,f,d);const p=this.options.flowLabels;if(p.display){const r=e.toFont(p.font??o.Chart.defaults.font),n=function({height:t,width:o,x:e,x2:r,y:n,y2:i},a){return"vertical"===a?{height:i-n,width:Math.abs(r-e)+o,x:Math.min(e,r),y:n}:{height:Math.abs(i-n)+t,width:r-e,x:e,y:Math.min(n,i)}}(u,d);s(t,`${this.flow}`,{autoPosition:"center",backgroundColor:p.backgroundColor,borderRadius:p.borderRadius,borderWidth:0,color:p.color,font:r,height:n.height,lineOffset:r.lineHeight/2,padding:p.padding,position:p.position,width:n.width,x:n.x,y:n.y})}t.restore()}inRange(t,o,e){const{x:r,y:n,x2:i,y2:a,height:s,width:l}=this.getProps(["x","y","x2","y2","height","width"],e),h="vertical"===this.options.orientation;if(h?o<n||o>a:t<r||t>i)return!1;const{cp1:c,cp2:d}=V(r,n,i,a,this.options.orientation),f=h?(o-n)/(a-n):(t-r)/(i-r),u={x:i,y:a},p=L({x:r,y:n},c,f),y=L(c,d,f),g=L(d,u,f),x=L(p,y,f),m=L(y,g,f),w=L(x,m,f);return h?t>=w.x&&t<=w.x+l:o>=w.y&&o<=w.y+s}inXRange(t,o){const{x:e,x2:r,width:n}=this.getProps(["x","x2","width"],o),i=Math.min(e,r),a=Math.max(e,r)+("vertical"===this.options.orientation?n:0);return t>=i&&t<=a}inYRange(t,o){const{y:e,y2:r,height:n}=this.getProps(["y","y2","height"],o),i=Math.min(e,r),a=Math.max(e,r)+("vertical"===this.options.orientation?0:n);return t>=i&&t<=a}getCenterPoint(t){const{x:o,y:e,x2:r,y2:n,height:i,width:a}=this.getProps(["x","y","x2","y2","height","width"],t),s="vertical"===this.options.orientation;return{x:(o+r+(s?a:0))/2,y:(e+n+(s?0:i))/2}}tooltipPosition(t=!1){return this.getCenterPoint(t)}getRange(t){const o="vertical"===this.options.orientation;return"x"===t?o?this.width/2:0:o?0:this.height/2}constructor(t){super(),this.flow=0,this.x2=0,this.y2=0,this.width=0,this.height=0,this.progress=1,t&&Object.assign(this,t)}}$.id="flow",$.defaults={alpha:.5,colorFrom:"red",colorMode:"gradient",colorTo:"green",flowColor:null,flowLabels:{borderRadius:0,color:"black",display:!1,padding:4,position:"center"},hoverColorFrom:(t,o)=>D(o.colorFrom),hoverColorTo:(t,o)=>D(o.colorTo),orientation:"horizontal"},$.descriptors={_scriptable:!0,flowLabels:{_scriptable:!0}},o.Chart.register(O,$),t.Flow=$,t.SankeyController=O});

package/dist/controller.d.cts

@@ -0,0 +1,135 @@
+import type { ChartMeta } from 'chart.js' with { 'resolution-mode': 'import' };
+import type Flow from './flow.cjs';
+import type { AnyObject, SankeyControllerDatasetOptions, SankeyParsedData } from './types.cjs';
+import type { DatasetController } from 'chart.js' with { 'resolution-mode': 'import' };
+export default class SankeyController extends DatasetController {
+    static readonly id = "sankey";
+    static readonly descriptors: {
+        _indexable: boolean;
+        _scriptable: boolean;
+        nodeLabels: {
+            _indexable: boolean;
+            _scriptable: boolean;
+        };
+    };
+    static readonly defaults: {
+        animations: {
+            colors: {
+                properties: string[];
+                type: string;
+            };
+            numbers: {
+                properties: string[];
+                type: string;
+            };
+            progress: {
+                delay: (ctx: any) => number | undefined;
+                duration: (ctx: any) => number | undefined;
+                easing: string;
+            };
+        };
+        borderColor: string;
+        borderWidth: number;
+        color: string;
+        dataElementType: string;
+        modeX: string;
+        nodePadding: number;
+        nodeWidth: number;
+        orientation: string;
+        transitions: {
+            hide: {
+                animations: {
+                    colors: {
+                        properties: string[];
+                        to: string;
+                        type: string;
+                    };
+                };
+            };
+            resize: {
+                animations: {
+                    progress: {
+                        delay: number;
+                        duration: number;
+                    };
+                };
+            };
+            show: {
+                animations: {
+                    colors: {
+                        from: string;
+                        properties: string[];
+                        type: string;
+                    };
+                };
+            };
+        };
+    };
+    static readonly overrides: {
+        datasets: {
+            clip: boolean;
+            parsing: {
+                flow: string;
+                from: string;
+                to: string;
+            };
+        };
+        interaction: {
+            intersect: boolean;
+            mode: string;
+        };
+        layout: {
+            padding: {
+                bottom: number;
+                left: number;
+                right: number;
+                top: number;
+            };
+        };
+        plugins: {
+            legend: {
+                display: boolean;
+            };
+            tooltip: {
+                callbacks: {
+                    label(context: any): string;
+                    title(): string;
+                };
+            };
+        };
+        scales: {
+            x: {
+                bounds: string;
+                display: boolean;
+                min: number;
+                offset: boolean;
+                type: string;
+            };
+            y: {
+                bounds: string;
+                display: boolean;
+                min: number;
+                offset: boolean;
+                reverse: boolean;
+                type: string;
+            };
+        };
+    };
+    options: SankeyControllerDatasetOptions;
+    private _nodes;
+    private _maxX;
+    private _maxY;
+    parseObjectData(meta: ChartMeta<'sankey', Flow>, data: AnyObject[], start: number, count: number): SankeyParsedData[];
+    getMinMax(scale: any): {
+        max: number;
+        min: number;
+    };
+    update(mode: any): void;
+    updateElements(elems: Flow[], start: number, count: number, mode: 'default' | 'resize' | 'reset' | 'none' | 'hide' | 'show' | 'active'): void;
+    private _drawLabels;
+    private _drawNodes;
+    /**
+     * That's where the drawing process happens
+     */
+    draw(): void;
+}

package/dist/controller.d.ts

@@ -46,6 +46,14 @@ export default class SankeyController extends DatasetController {
                     };
                 };
             };
+            resize: {
+                animations: {
+                    progress: {
+                        delay: number;
+                        duration: number;
+                    };
+                };
+            };
             show: {
                 animations: {
                     colors: {

package/dist/flow.d.cts

@@ -0,0 +1,78 @@
+import type { Color } from 'chart.js' with { 'resolution-mode': 'import' };
+import type { FlowConfig, FlowOptions, FlowProps, SankeyNode } from './types.cjs';
+import type { Element } from 'chart.js' with { 'resolution-mode': 'import' };
+export default class Flow extends Element<FlowProps, FlowOptions> {
+    static readonly id = "flow";
+    static readonly defaults: {
+        alpha: number;
+        colorFrom: string;
+        colorMode: string;
+        colorTo: string;
+        flowColor: null;
+        flowLabels: {
+            borderRadius: number;
+            color: string;
+            display: boolean;
+            padding: number;
+            position: string;
+        };
+        hoverColorFrom: (_ctx: unknown, options: FlowOptions) => Color;
+        hoverColorTo: (_ctx: unknown, options: FlowOptions) => Color;
+        orientation: string;
+    };
+    static readonly descriptors: {
+        _scriptable: boolean;
+        flowLabels: {
+            _scriptable: boolean;
+        };
+    };
+    flow: number;
+    x2: number;
+    y2: number;
+    width: number;
+    height: number;
+    progress: number;
+    from?: SankeyNode;
+    to?: SankeyNode;
+    constructor(cfg: FlowConfig);
+    /**
+     * @param {CanvasRenderingContext2D} ctx
+     */
+    draw(ctx: CanvasRenderingContext2D): void;
+    /**
+     * @param {number} mouseX
+     * @param {number} mouseY
+     * @param {boolean} useFinalPosition
+     * @return {boolean}
+     */
+    inRange(mouseX: number, mouseY: number, useFinalPosition: boolean): boolean;
+    /**
+     * @param {number} mouseX
+     * @param {boolean} useFinalPosition
+     * @return {boolean}
+     */
+    inXRange(mouseX: number, useFinalPosition: boolean): boolean;
+    /**
+     * @param {number} mouseY
+     * @param {boolean} useFinalPosition
+     * @return {boolean}
+     */
+    inYRange(mouseY: number, useFinalPosition: boolean): boolean;
+    /**
+     * @param {boolean} useFinalPosition
+     * @return {{x: number, y:number}}
+     */
+    getCenterPoint(useFinalPosition: boolean): {
+        x: number;
+        y: number;
+    };
+    tooltipPosition(useFinalPosition?: boolean): {
+        x: number;
+        y: number;
+    };
+    /**
+     * @param {"x" | "y"} axis
+     * @return {number}
+     */
+    getRange(axis: 'x' | 'y'): number;
+}

package/dist/index.d.cts

@@ -0,0 +1,4 @@
+import Sankey from './controller.cjs';
+import Flow from './flow.cjs';
+export type { FlowConfig, FlowOptions, FlowProps, SankeyControllerDatasetFlowLabelsOptions, SankeyControllerDatasetNodeLabelsOptions, SankeyControllerDatasetOptions, SankeyDataPoint, SankeyLabelPosition, SankeyNodeLabelOption, SankeyNodeLabelPosition, SankeyOrientation, SankeyParsedData, SankeyParsingOptions, SankeyScriptableContext, } from './types.cjs';
+export { Flow, Sankey as SankeyController };

package/dist/index.esm.d.cts

@@ -0,0 +1,3 @@
+export type { FlowConfig, FlowOptions, FlowProps, SankeyControllerDatasetFlowLabelsOptions, SankeyControllerDatasetNodeLabelsOptions, SankeyControllerDatasetOptions, SankeyDataPoint, SankeyLabelPosition, SankeyNodeLabelOption, SankeyNodeLabelPosition, SankeyOrientation, SankeyParsedData, SankeyParsingOptions, SankeyScriptableContext, } from './types.cjs';
+export { default as SankeyController } from './controller.cjs';
+export { default as Flow } from './flow.cjs';

package/dist/labels.d.cts

@@ -0,0 +1,22 @@
+import type { CanvasFontSpec, Color } from 'chart.js' with { 'resolution-mode': 'import' };
+import type { SankeyLabelPosition, SankeyNode, SankeyNodeLabelOption } from './types.cjs';
+type ResolvableNodeLabelValue = boolean | Color | SankeyLabelPosition;
+type ResolvedLabelPosition = Exclude<SankeyLabelPosition, 'auto'>;
+export interface DrawLabelOptions {
+    autoPosition: ResolvedLabelPosition;
+    backgroundColor?: Color;
+    borderRadius: number;
+    borderWidth: number;
+    color: Color;
+    font: CanvasFontSpec;
+    height: number;
+    lineOffset: number;
+    padding: number;
+    position: SankeyLabelPosition;
+    width: number;
+    x: number;
+    y: number;
+}
+export declare function resolveNodeLabelOption<T extends ResolvableNodeLabelValue>(option: SankeyNodeLabelOption<T> | undefined, node: SankeyNode): T | undefined;
+export declare function drawLabel(ctx: CanvasRenderingContext2D, label: string, options: DrawLabelOptions): void;
+export {};

package/dist/types.d.cts

@@ -0,0 +1,140 @@
+import type {} from './types.js' with { 'resolution-mode': 'import' };
+import type { CartesianScaleTypeRegistry, Color, ControllerDatasetOptions, CoreChartOptions, FontSpec, Scriptable, ScriptableAndArray, ScriptableContext } from 'chart.js' with { 'resolution-mode': 'import' };
+export type AnyObject = Record<string, unknown>;
+export interface SankeyDataPoint {
+    from: string;
+    to: string;
+    flow: number;
+}
+export type SankeyScriptableContext = ScriptableContext<'sankey'> & {
+    raw: SankeyDataPoint;
+};
+export type SankeyLabelPosition = 'auto' | 'bottom' | 'center' | 'left' | 'right' | 'top';
+export type SankeyNodeLabelPosition = SankeyLabelPosition;
+export type SankeyOrientation = 'horizontal' | 'vertical';
+export type SankeyNodeLabelOption<T> = T | Record<string, T> | ((node: SankeyNode) => T | undefined);
+export interface SankeyControllerDatasetNodeLabelsOptions {
+    backgroundColor?: SankeyNodeLabelOption<Color>;
+    borderRadius?: number;
+    color?: SankeyNodeLabelOption<Color>;
+    display?: SankeyNodeLabelOption<boolean>;
+    font?: Partial<FontSpec>;
+    padding?: number;
+    position?: SankeyNodeLabelOption<SankeyLabelPosition>;
+}
+export interface SankeyControllerDatasetFlowLabelsOptions {
+    backgroundColor?: Scriptable<Color, SankeyScriptableContext>;
+    borderRadius?: Scriptable<number, SankeyScriptableContext>;
+    color?: Scriptable<Color, SankeyScriptableContext>;
+    display?: Scriptable<boolean, SankeyScriptableContext>;
+    font?: Scriptable<Partial<FontSpec>, SankeyScriptableContext>;
+    padding?: Scriptable<number, SankeyScriptableContext>;
+    position?: Scriptable<SankeyLabelPosition, SankeyScriptableContext>;
+}
+export interface SankeyParsingOptions {
+    from: string;
+    to: string;
+    flow: string;
+}
+export interface SankeyControllerDatasetOptions extends Omit<ControllerDatasetOptions, 'parsing'> {
+    alpha?: number;
+    backgroundColor?: never;
+    borderColor?: Color;
+    borderWidth?: number;
+    color?: Color;
+    colorFrom?: ScriptableAndArray<Color, SankeyScriptableContext>;
+    colorMode?: 'gradient' | 'from' | 'to';
+    colorTo?: ScriptableAndArray<Color, SankeyScriptableContext>;
+    column?: Record<string, number>;
+    font?: Partial<FontSpec>;
+    flowLabels?: SankeyControllerDatasetFlowLabelsOptions;
+    hoverColorFrom?: ScriptableAndArray<Color, SankeyScriptableContext>;
+    hoverColorTo?: ScriptableAndArray<Color, SankeyScriptableContext>;
+    hoverFlowColor?: ScriptableAndArray<Color, SankeyScriptableContext>;
+    labels?: Record<string, string>;
+    flowColor?: ScriptableAndArray<Color, SankeyScriptableContext>;
+    modeX?: 'edge' | 'even';
+    nodeLabels?: SankeyControllerDatasetNodeLabelsOptions;
+    nodePadding?: number;
+    nodeWidth?: number;
+    orientation?: SankeyOrientation;
+    padding?: number;
+    parsing: SankeyParsingOptions;
+    priority?: Record<string, number>;
+    size?: 'min' | 'max';
+}
+export interface FromToElement {
+    addY: number;
+    flow: number;
+    key: string;
+    node: SankeyNode;
+    index: number;
+}
+export interface SankeyNode {
+    key: string;
+    in: number;
+    out: number;
+    size: number;
+    from: FromToElement[];
+    to: FromToElement[];
+    column?: boolean;
+    priority?: number;
+    y?: number;
+    x?: number;
+    color?: Color;
+    _visited?: number;
+}
+export interface SankeyParsedData {
+    x: number;
+    y: number;
+    _custom: {
+        from: SankeyNode;
+        to: SankeyNode;
+        x: number;
+        y: number;
+        height: number;
+        flow: number;
+    };
+}
+
+export interface FlowProps {
+    flow: number;
+    x: number;
+    y: number;
+    x2: number;
+    y2: number;
+    height: number;
+    width: number;
+}
+export interface FlowOptions {
+    alpha: number;
+    colorMode: 'gradient' | 'from' | 'to';
+    colorFrom: Color;
+    colorTo: Color;
+    hoverColorFrom: Color;
+    hoverColorTo: Color;
+    flowColor: Color | null;
+    orientation: SankeyOrientation;
+    flowLabels: {
+        backgroundColor?: Color;
+        borderRadius: number;
+        color: Color;
+        display: boolean;
+        font?: Partial<FontSpec>;
+        padding: number;
+        position: SankeyLabelPosition;
+    };
+}
+export interface FlowConfig {
+    flow?: number;
+    x: number;
+    y: number;
+    x2: number;
+    y2: number;
+    height: number;
+    width?: number;
+    progress?: number;
+    from?: SankeyNode;
+    to?: SankeyNode;
+    options: FlowOptions;
+}

package/package.json

@@ -12,43 +12,43 @@
     "@emnapi/core": "^1.11.2",
     "@emnapi/runtime": "^1.11.2",
     "@kurkle/astro-chartjs-editor": "^1.0.0",
-    "@kurkle/configs": "^1.0.1",
+    "@kurkle/configs": "^1.5.1",
     "@napi-rs/canvas": "^1.0.0",
     "@rollup/plugin-node-resolve": "^16.0.0",
     "@rollup/plugin-swc": "^0.4.0",
     "@rollup/plugin-terser": "^1.0.0",
-    "@swc/cli": "^0.8.1",
     "@swc/core": "^1.7.40",
-    "@types/jasmine": "^6.0.0",
     "@types/node": "^26.1.0",
+    "@vitest/browser": "^5.0.0",
+    "@vitest/browser-playwright": "^5.0.0",
+    "@vitest/coverage-istanbul": "^5.0.0",
+    "@vitest/coverage-v8": "^5.0.0",
     "astro": "^7.0.6",
-    "c8": "^12.0.0",
     "chart.js": "^4.4.5",
-    "chartjs-test-utils": "^0.5.0",
-    "cross-env": "^10.1.0",
     "globals": "^17.0.0",
-    "jasmine": "^7.0.0",
-    "karma": "^6.3.2",
-    "karma-chrome-launcher": "^3.1.0",
-    "karma-coverage": "^2.0.3",
-    "karma-firefox-launcher": "^2.1.3",
-    "karma-jasmine": "^5.0.1",
-    "karma-jasmine-html-reporter": "^2.0.0",
-    "karma-rollup-preprocessor": "^7.0.8",
-    "karma-spec-reporter": "^0.0.36",
+    "pixelmatch": "^7.1.0",
+    "playwright": "^1.63.0",
     "png-to-ico": "^3.0.2",
     "rollup": "^4.24.0",
     "rollup-plugin-cleanup": "^3.2.1",
-    "rollup-plugin-istanbul": "^5.0.0",
     "semantic-release": "^25.0.3",
     "sharp": "^0.35.4",
-    "typescript": "^6.0.3"
+    "typescript": "^6.0.3",
+    "vitest": "^5.0.0"
   },
   "exports": {
-    "import": "./dist/chartjs-chart-sankey.esm.js",
-    "require": "./dist/chartjs-chart-sankey.cjs",
-    "script": "./dist/chartjs-chart-sankey.min.js",
-    "types": "./dist/index.esm.d.ts"
+    ".": {
+      "import": {
+        "types": "./dist/index.esm.d.ts",
+        "default": "./dist/chartjs-chart-sankey.esm.js"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./dist/chartjs-chart-sankey.cjs"
+      },
+      "script": "./dist/chartjs-chart-sankey.min.js"
+    },
+    "./package.json": "./package.json"
   },
   "files": [
     "dist/*",
@@ -74,27 +74,27 @@
   },
   "scripts": {
     "autobuild": "rollup -c -w",
-    "build": "rollup -c && tsc -p tsconfig.json --emitDeclarationOnly",
-    "dev": "karma start ./karma.conf.cjs --no-single-run --auto-watch --browsers chrome",
-    "dev:ff": "karma start ./karma.conf.cjs --no-single-run --auto-watch --browsers firefox",
+    "build": "rollup -c && tsc -p tsconfig.json --emitDeclarationOnly && kurkle-build-cjs-types",
+    "dev": "vitest --config vitest.browser.config.ts",
     "docs": "npm run build && astro build",
     "docs:dev": "npm run build && astro dev",
     "docs:version": "node ./docs/scripts/write-docs-version.cjs",
+    "fixtures:update": "node scripts/update-fixtures.mjs",
     "format": "biome check --write",
-    "icons": "node ./docs/scripts/generate-icons.mjs",
+    "icons": "kurkle-generate-icons",
     "lint": "biome check",
     "predocs": "npm run docs:version",
     "predocs:dev": "npm run docs:version",
     "prepack": "npm run build",
     "prepare": "git config core.hooksPath .githooks || true",
-    "pretest:unit": "swc --config-file .swcrc-spec src -d build",
-    "test": "npm run test:unit && npm run test:fixture && npm run test:integration:browser-module && npm run test:integration:node-commonjs && npm run test:integration:node-module",
-    "test:fixture": "cross-env NODE_ENV=test karma start ./karma.conf.cjs --no-auto-watch --single-run",
-    "test:integration:browser-module": "karma start ./karma.integration.cjs --single-run",
+    "test": "npm run test:unit && npm run test:fixture && npm run test:integration:browser-module && npm run test:integration:node-commonjs && npm run test:integration:node-module && npm run test:pack",
+    "test:fixture": "vitest run --config vitest.browser.config.ts --coverage",
+    "test:integration:browser-module": "vitest run --config vitest.integration.config.ts",
     "test:integration:node-commonjs": "node test/integration/node-commonjs/test.cjs",
     "test:integration:node-module": "node test/integration/node-module/test.mjs",
-    "test:unit": "cross-env JASMINE_CONFIG_PATH=jasmine.json c8 --src=src --reporter=text --reporter=lcov -o=coverage/unit jasmine",
-    "typecheck": "tsc --noEmit && tsc --noEmit -p tsconfig.test.json && tsc -p tsconfig.json --emitDeclarationOnly && tsc --noEmit -p test/types/",
+    "test:pack": "kurkle-check-package",
+    "test:unit": "vitest run --config vitest.config.ts --coverage",
+    "typecheck": "tsc --noEmit && tsc --noEmit -p tsconfig.test.json && tsc -p tsconfig.json --emitDeclarationOnly && tsc --noEmit -p test/types/ && tsc --noEmit -p tsconfig.tooling.json",
     "typecheck:docs": "astro check"
   },
   "sideEffects": [
@@ -104,5 +104,5 @@
   "type": "module",
   "types": "dist/index.esm.d.ts",
   "unpkg": "dist/chartjs-chart-sankey.min.js",
-  "version": "0.15.3"
+  "version": "0.16.1"
 }