@unovis/ts 1.1.1-beta.7 → 1.1.1-beta.9

package/components/sankey/modules/link.js

@@ -0,0 +1,108 @@
+import { interpolateNumber } from 'd3-interpolate';
+import { getColor } from '../../../utils/color.js';
+import { getString } from '../../../utils/data.js';
+import { smartTransition } from '../../../utils/d3.js';
+import { linkPath as linkPath$1, linkSelectionHelper } from '../style.js';
+
+function linkPath({ x0, x1, y0, y1, width }) {
+    const top0 = y0 - width / 2;
+    const top1 = y1 - width / 2;
+    const bottom0 = y0 + width / 2;
+    const bottom1 = y1 + width / 2;
+    const centerX = (x0 + x1) / 2;
+    return `
+    M ${x0}, ${top0}
+
+    C ${centerX}, ${top0}
+      ${centerX}, ${top1}
+      ${x1}, ${top1}
+
+    L ${x1}, ${bottom1}
+
+    C ${centerX}, ${bottom1}
+      ${centerX}, ${bottom0}
+      ${x0}, ${bottom0}
+    z
+  `;
+}
+function createLinks(sel) {
+    sel.append('path').attr('class', linkPath$1)
+        .attr('d', (d, i, el) => {
+        // eslint-disable-next-line dot-notation
+        el[i]['_animState'] = {
+            x0: d.source.x1,
+            x1: d.target.x0,
+            y0: d.y0,
+            y1: d.y1,
+            width: Math.max(1, d.width),
+        };
+        // eslint-disable-next-line dot-notation
+        return linkPath(el[i]['_animState']);
+    });
+    sel.append('path').attr('class', linkSelectionHelper);
+    sel.style('opacity', 0);
+}
+function updateLinks(sel, config, duration) {
+    smartTransition(sel, duration)
+        .style('opacity', (d) => d._state.greyout ? 0.2 : 1);
+    const linkSelection = sel.select(`.${linkPath$1}`)
+        .style('cursor', (d) => getString(d, config.linkCursor));
+    const selectionTransition = smartTransition(linkSelection, duration)
+        .style('fill', (link) => getColor(link, config.linkColor));
+    if (duration) {
+        selectionTransition
+            .attrTween('d', (d, i, el) => {
+            // eslint-disable-next-line dot-notation
+            const previous = el[i]['_animState'];
+            const next = {
+                x0: d.source.x1,
+                x1: d.target.x0,
+                y0: d.y0,
+                y1: d.y1,
+                width: Math.max(1, d.width),
+            };
+            const interpolator = {
+                x0: interpolateNumber(previous.x0, next.x0),
+                x1: interpolateNumber(previous.x1, next.x1),
+                y0: interpolateNumber(previous.y0, next.y0),
+                y1: interpolateNumber(previous.y1, next.y1),
+                width: interpolateNumber(previous.width, next.width),
+            };
+            // eslint-disable-next-line dot-notation
+            el[i]['_animState'] = next;
+            return function (t) {
+                return linkPath({
+                    x0: interpolator.x0(t),
+                    x1: interpolator.x1(t),
+                    y0: interpolator.y0(t),
+                    y1: interpolator.y1(t),
+                    width: interpolator.width(t),
+                });
+            };
+        });
+    }
+    else {
+        linkSelection.attr('d', (d) => linkPath({
+            x0: d.source.x1,
+            x1: d.target.x0,
+            y0: d.y0,
+            y1: d.y1,
+            width: Math.max(1, d.width),
+        }));
+    }
+    sel.select(`.${linkSelectionHelper}`)
+        .attr('d', (d) => linkPath({
+        x0: d.source.x1,
+        x1: d.target.x0,
+        y0: d.y0,
+        y1: d.y1,
+        width: Math.max(10, d.width),
+    }))
+        .style('cursor', d => getString(d, config.linkCursor));
+}
+function removeLinks(sel) {
+    sel.remove();
+}
+
+export { createLinks, linkPath, removeLinks, updateLinks };
+//# sourceMappingURL=link.js.map

package/components/sankey/modules/link.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"link.js","sources":["../../../../src/components/sankey/modules/link.ts"],"sourcesContent":["import { Selection } from 'd3-selection'\nimport { Transition } from 'd3-transition'\nimport { interpolateNumber } from 'd3-interpolate'\n\n// Utils\nimport { getColor } from 'utils/color'\nimport { getString } from 'utils/data'\nimport { smartTransition } from 'utils/d3'\n\n// Local Types\nimport { SankeyInputLink, SankeyInputNode, SankeyLink } from '../types'\n\n// Config\nimport { SankeyConfig } from '../config'\n\n// Styles\nimport * as s from '../style'\n\nexport type LinkPathOptions = {\n  x0: number;\n  x1: number;\n  y0: number;\n  y1: number;\n  width: number;\n}\n\nexport function linkPath ({ x0, x1, y0, y1, width }: LinkPathOptions): string {\n  const top0 = y0 - width / 2\n  const top1 = y1 - width / 2\n  const bottom0 = y0 + width / 2\n  const bottom1 = y1 + width / 2\n  const centerX = (x0 + x1) / 2\n\n  return `\n    M ${x0}, ${top0}\n\n    C ${centerX}, ${top0}\n      ${centerX}, ${top1}\n      ${x1}, ${top1}\n\n    L ${x1}, ${bottom1}\n\n    C ${centerX}, ${bottom1}\n      ${centerX}, ${bottom0}\n      ${x0}, ${bottom0}\n    z\n  `\n}\n\nexport function createLinks<N extends SankeyInputNode, L extends SankeyInputLink> (\n  sel: Selection<SVGGElement, SankeyLink<N, L>, SVGGElement, unknown>\n): void {\n  sel.append('path').attr('class', s.linkPath)\n    .attr('d', (d: SankeyLink<N, L>, i, el) => {\n    // eslint-disable-next-line dot-notation\n      el[i]['_animState'] = {\n        x0: d.source.x1,\n        x1: d.target.x0,\n        y0: d.y0,\n        y1: d.y1,\n        width: Math.max(1, d.width),\n      }\n      // eslint-disable-next-line dot-notation\n      return linkPath(el[i]['_animState'])\n    })\n  sel.append('path').attr('class', s.linkSelectionHelper)\n  sel.style('opacity', 0)\n}\n\nexport function updateLinks<N extends SankeyInputNode, L extends SankeyInputLink> (\n  sel: Selection<SVGGElement, SankeyLink<N, L>, SVGGElement, unknown>,\n  config: SankeyConfig<N, L>,\n  duration: number\n): void {\n  smartTransition(sel, duration)\n    .style('opacity', (d: SankeyLink<N, L>) => d._state.greyout ? 0.2 : 1)\n\n  const linkSelection = sel.select<SVGPathElement>(`.${s.linkPath}`)\n    .style('cursor', (d: SankeyLink<N, L>) => getString(d, config.linkCursor))\n\n  const selectionTransition = smartTransition(linkSelection, duration)\n    .style('fill', (link: SankeyLink<N, L>) => getColor(link, config.linkColor))\n\n  if (duration) {\n    (selectionTransition as Transition<SVGPathElement, SankeyLink<N, L>, SVGGElement, unknown>)\n      .attrTween('d', (d: SankeyLink<N, L>, i, el) => {\n      // eslint-disable-next-line dot-notation\n        const previous = el[i]['_animState']\n        const next = {\n          x0: d.source.x1,\n          x1: d.target.x0,\n          y0: d.y0,\n          y1: d.y1,\n          width: Math.max(1, d.width),\n        }\n        const interpolator = {\n          x0: interpolateNumber(previous.x0, next.x0),\n          x1: interpolateNumber(previous.x1, next.x1),\n          y0: interpolateNumber(previous.y0, next.y0),\n          y1: interpolateNumber(previous.y1, next.y1),\n          width: interpolateNumber(previous.width, next.width),\n        }\n        // eslint-disable-next-line dot-notation\n        el[i]['_animState'] = next\n\n        return function (t: number) {\n          return linkPath({\n            x0: interpolator.x0(t),\n            x1: interpolator.x1(t),\n            y0: interpolator.y0(t),\n            y1: interpolator.y1(t),\n            width: interpolator.width(t),\n          })\n        }\n      })\n  } else {\n    linkSelection.attr('d', (d: SankeyLink<N, L>) => linkPath({\n      x0: d.source.x1,\n      x1: d.target.x0,\n      y0: d.y0,\n      y1: d.y1,\n      width: Math.max(1, d.width),\n    }))\n  }\n\n  sel.select(`.${s.linkSelectionHelper}`)\n    .attr('d', (d: SankeyLink<N, L>) => linkPath({\n      x0: d.source.x1,\n      x1: d.target.x0,\n      y0: d.y0,\n      y1: d.y1,\n      width: Math.max(10, d.width),\n    }))\n    .style('cursor', d => getString(d, config.linkCursor))\n}\n\nexport function removeLinks<N extends SankeyInputNode, L extends SankeyInputLink> (\n  sel: Selection<SVGGElement, SankeyLink<N, L>, SVGGElement, unknown>\n): void {\n  sel.remove()\n}\n"],"names":["s.linkPath","s.linkSelectionHelper"],"mappings":"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"}

package/components/sankey/modules/node.d.ts

@@ -0,0 +1,10 @@
+import { Selection } from 'd3-selection';
+import { Spacing } from "../../../types/spacing";
+import { SankeyInputLink, SankeyInputNode, SankeyNode } from '../types';
+import { SankeyConfig } from '../config';
+export declare function createNodes<N extends SankeyInputNode, L extends SankeyInputLink>(sel: Selection<SVGGElement, SankeyNode<N, L>, SVGGElement, unknown>, config: SankeyConfig<N, L>, width: number, bleed: Spacing): void;
+export declare function updateNodes<N extends SankeyInputNode, L extends SankeyInputLink>(sel: Selection<SVGGElement, SankeyNode<N, L>, SVGGElement, unknown>, config: SankeyConfig<N, L>, width: number, bleed: Spacing, hasLinks: boolean, duration: number): void;
+export declare function renderNodeLabels<N extends SankeyInputNode, L extends SankeyInputLink>(sel: Selection<SVGGElement, SankeyNode<N, L>, SVGGElement, unknown>, config: SankeyConfig<N, L>, width: number, duration: number, enforceNodeVisibility?: SankeyNode<N, L>): void;
+export declare function removeNodes<N extends SankeyInputNode, L extends SankeyInputLink>(selection: Selection<SVGGElement, SankeyNode<N, L>, SVGGElement, unknown>, config: SankeyConfig<N, L>, duration: number): void;
+export declare function onNodeMouseOver<N extends SankeyInputNode, L extends SankeyInputLink>(d: SankeyNode<N, L>, nodeSelection: Selection<SVGGElement, SankeyNode<N, L>, SVGGElement, unknown>, config: SankeyConfig<N, L>, width: number): void;
+export declare function onNodeMouseOut<N extends SankeyInputNode, L extends SankeyInputLink>(d: SankeyNode<N, L>, nodeSelection: Selection<SVGGElement, SankeyNode<N, L>, SVGGElement, unknown>, config: SankeyConfig<N, L>, width: number): void;

package/components/sankey/modules/node.js

@@ -0,0 +1,156 @@
+import { select } from 'd3-selection';
+import { getColor } from '../../../utils/color.js';
+import { getString } from '../../../utils/data.js';
+import { smartTransition } from '../../../utils/d3.js';
+import { SankeyEnterTransitionType, SankeyNodeAlign, SankeyExitTransitionType } from '../types.js';
+import { renderLabel } from './label.js';
+import { node, labelGroup, labelBackground, label, sublabel, nodeIcon, SANKEY_ICON_SIZE, hidden, labelTrimmed, forceShow } from '../style.js';
+
+function createNodes(sel, config, width, bleed) {
+    const { enterTransitionType } = config;
+    // Node
+    sel.append('rect')
+        .attr('class', node)
+        .attr('width', config.nodeWidth)
+        .attr('height', d => d.y1 - d.y0)
+        .style('fill', node => getColor(node, config.nodeColor));
+    // Labels
+    const labelGroup$1 = sel.append('g').attr('class', labelGroup);
+    labelGroup$1.append('path').attr('class', labelBackground);
+    labelGroup$1.append('text').attr('class', label);
+    labelGroup$1.append('text').attr('class', sublabel);
+    // Node icon
+    sel.append('text').attr('class', nodeIcon)
+        .attr('text-anchor', 'middle')
+        .attr('dy', '0.5px');
+    sel
+        .attr('transform', d => {
+        var _a;
+        const x = (enterTransitionType === SankeyEnterTransitionType.FromAncestor && ((_a = d.targetLinks) === null || _a === void 0 ? void 0 : _a[0])) ? d.targetLinks[0].source.x0 : d.x0;
+        return `translate(${sel.size() === 1 ? width * 0.5 - bleed.left : x}, ${d.y0})`;
+    })
+        .style('opacity', 0);
+}
+function getNodeXPos(d, config, width, bleed, hasLinks) {
+    if (hasLinks)
+        return d.x0;
+    switch (config.nodeAlign) {
+        case SankeyNodeAlign.Left: return d.x0;
+        case SankeyNodeAlign.Right: return width - bleed.right;
+        case SankeyNodeAlign.Center:
+        case SankeyNodeAlign.Justify:
+        default: return width * 0.5 - bleed.left;
+    }
+}
+function updateNodes(sel, config, width, bleed, hasLinks, duration) {
+    smartTransition(sel, duration)
+        .attr('transform', d => `translate(${getNodeXPos(d, config, width, bleed, hasLinks)},${d.y0})`)
+        .style('opacity', d => d._state.greyout ? 0.2 : 1);
+    // Node
+    smartTransition(sel.select(`.${node}`), duration)
+        .attr('width', config.nodeWidth)
+        .attr('height', (d) => d.y1 - d.y0)
+        .style('cursor', (d) => getString(d, config.nodeCursor))
+        .style('fill', (d) => getColor(d, config.nodeColor));
+    // Label Rendering
+    // eslint-disable-next-line @typescript-eslint/no-use-before-define
+    renderNodeLabels(sel, config, width, duration);
+    // Node Icon
+    const nodeIcon$1 = sel.select(`.${nodeIcon}`);
+    if (config.nodeIcon) {
+        nodeIcon$1
+            .attr('visibility', null)
+            .attr('text-anchor', 'middle')
+            .attr('alignment-baseline', 'middle')
+            .style('stroke', (d) => getColor(d, config.nodeIconColor))
+            .style('fill', (d) => getColor(d, config.nodeIconColor))
+            .style('font-size', (d) => {
+            const nodeHeight = d.y1 - d.y0;
+            return nodeHeight < SANKEY_ICON_SIZE ? `${nodeHeight * 0.65}px` : null;
+        })
+            .html(config.nodeIcon);
+        smartTransition(nodeIcon$1, duration)
+            .attr('x', config.nodeWidth / 2)
+            .attr('y', (d) => (d.y1 - d.y0) / 2);
+    }
+    else {
+        nodeIcon$1
+            .attr('visibility', 'hidden');
+    }
+}
+function renderNodeLabels(sel, config, width, duration, enforceNodeVisibility) {
+    // Label Rendering
+    const labelGroupSelection = sel.select(`.${labelGroup}`);
+    const labelGroupEls = labelGroupSelection.nodes() || [];
+    // After rendering Label return a BBox so we can do intersection detection and hide some of tem
+    const labelGroupBBoxes = labelGroupEls.map(g => {
+        const gSelection = select(g);
+        const datum = gSelection.datum();
+        return renderLabel(gSelection, datum, config, width, duration, enforceNodeVisibility === datum);
+    });
+    if (config.labelVisibility) {
+        for (const b of labelGroupBBoxes) {
+            const datum = b.selection.datum();
+            const box = { x: b.x, y: b.y, width: b.width, height: b.height };
+            b.hidden = !config.labelVisibility(datum, box, enforceNodeVisibility === datum);
+        }
+    }
+    else {
+        // Detect intersecting labels
+        const maxLayer = Math.max(...labelGroupBBoxes.map(b => b.layer));
+        for (let layer = 0; layer <= maxLayer; layer += 1) {
+            const boxes = labelGroupBBoxes.filter(b => (b.layer === layer));
+            boxes.sort((a, b) => a.y - b.y);
+            let lastVisibleIdx = 0;
+            for (let i = 1; i < boxes.length; i += 1) {
+                const b0 = boxes[lastVisibleIdx];
+                const b1 = boxes[i];
+                const shouldBeHidden = b1.y < (b0.y + b0.height);
+                if (shouldBeHidden) {
+                    if (b1.selection.datum() === enforceNodeVisibility)
+                        b0.hidden = true; // If the hovered node should be hidden, hide the previous one instead
+                    else
+                        b1.hidden = true;
+                }
+                if (!b1.hidden)
+                    lastVisibleIdx = i;
+            }
+        }
+    }
+    // Hide intersecting labels
+    for (const b of labelGroupBBoxes) {
+        b.selection.classed(hidden, b.hidden);
+    }
+}
+function removeNodes(selection, config, duration) {
+    const { exitTransitionType } = config;
+    selection.each((d, i, els) => {
+        var _a;
+        const node = select(els[i]);
+        const transition = smartTransition(node, duration);
+        if ((exitTransitionType === SankeyExitTransitionType.ToAncestor) && ((_a = d.targetLinks) === null || _a === void 0 ? void 0 : _a[0])) {
+            transition.attr('transform', `translate(${d.targetLinks[0].source.x0},${d.y0})`);
+        }
+        transition
+            .style('opacity', 0)
+            .remove();
+    });
+}
+function onNodeMouseOver(d, nodeSelection, config, width) {
+    const labelGroup$1 = nodeSelection.raise()
+        .select(`.${labelGroup}`);
+    if ((config.labelExpandTrimmedOnHover && labelGroup$1.classed(labelTrimmed)) || labelGroup$1.classed(hidden)) {
+        renderLabel(labelGroup$1, d, config, width, 0, true);
+    }
+    labelGroup$1.classed(forceShow, true);
+}
+function onNodeMouseOut(d, nodeSelection, config, width) {
+    const labelGroup$1 = nodeSelection.select(`.${labelGroup}`);
+    if (config.labelExpandTrimmedOnHover || labelGroup$1.classed(hidden)) {
+        renderLabel(labelGroup$1, d, config, width, 0);
+    }
+    labelGroup$1.classed(forceShow, false);
+}
+
+export { createNodes, onNodeMouseOut, onNodeMouseOver, removeNodes, renderNodeLabels, updateNodes };
+//# sourceMappingURL=node.js.map

package/components/sankey/modules/node.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"node.js","sources":["../../../../src/components/sankey/modules/node.ts"],"sourcesContent":["import { select, Selection } from 'd3-selection'\n\n// Utils\nimport { getColor } from 'utils/color'\nimport { getString } from 'utils/data'\nimport { smartTransition } from 'utils/d3'\n\n// Types\nimport { Spacing } from 'types/spacing'\n\n// Local Types\nimport { SankeyEnterTransitionType, SankeyExitTransitionType, SankeyInputLink, SankeyInputNode, SankeyNode, SankeyNodeAlign } from '../types'\n\n// Config\nimport { SankeyConfig } from '../config'\n\n// Helpers\nimport { renderLabel } from './label'\n\n// Styles\nimport * as s from '../style'\n\nexport function createNodes<N extends SankeyInputNode, L extends SankeyInputLink> (\n  sel: Selection<SVGGElement, SankeyNode<N, L>, SVGGElement, unknown>,\n  config: SankeyConfig<N, L>,\n  width: number,\n  bleed: Spacing\n): void {\n  const { enterTransitionType } = config\n\n  // Node\n  sel.append('rect')\n    .attr('class', s.node)\n    .attr('width', config.nodeWidth)\n    .attr('height', d => d.y1 - d.y0)\n    .style('fill', node => getColor(node, config.nodeColor))\n\n  // Labels\n  const labelGroup = sel.append('g').attr('class', s.labelGroup)\n  labelGroup.append('path').attr('class', s.labelBackground)\n  labelGroup.append('text').attr('class', s.label)\n  labelGroup.append('text').attr('class', s.sublabel)\n\n  // Node icon\n  sel.append('text').attr('class', s.nodeIcon)\n    .attr('text-anchor', 'middle')\n    .attr('dy', '0.5px')\n\n  sel\n    .attr('transform', d => {\n      const x = (enterTransitionType === SankeyEnterTransitionType.FromAncestor && d.targetLinks?.[0]) ? d.targetLinks[0].source.x0 : d.x0\n      return `translate(${sel.size() === 1 ? width * 0.5 - bleed.left : x}, ${d.y0})`\n    })\n    .style('opacity', 0)\n}\n\nfunction getNodeXPos<N extends SankeyInputNode, L extends SankeyInputLink> (\n  d: SankeyNode<N, L>,\n  config: SankeyConfig<N, L>,\n  width: number,\n  bleed: Spacing,\n  hasLinks: boolean\n): number {\n  if (hasLinks) return d.x0\n\n  switch (config.nodeAlign) {\n    case SankeyNodeAlign.Left: return d.x0\n    case SankeyNodeAlign.Right: return width - bleed.right\n    case SankeyNodeAlign.Center:\n    case SankeyNodeAlign.Justify:\n    default: return width * 0.5 - bleed.left\n  }\n}\n\nexport function updateNodes<N extends SankeyInputNode, L extends SankeyInputLink> (\n  sel: Selection<SVGGElement, SankeyNode<N, L>, SVGGElement, unknown>,\n  config: SankeyConfig<N, L>,\n  width: number,\n  bleed: Spacing,\n  hasLinks: boolean,\n  duration: number\n): void {\n  smartTransition(sel, duration)\n    .attr('transform', d => `translate(${getNodeXPos(d, config, width, bleed, hasLinks)},${d.y0})`)\n    .style('opacity', d => d._state.greyout ? 0.2 : 1)\n\n  // Node\n  smartTransition(sel.select(`.${s.node}`), duration)\n    .attr('width', config.nodeWidth)\n    .attr('height', (d: SankeyNode<N, L>) => d.y1 - d.y0)\n    .style('cursor', (d: SankeyNode<N, L>) => getString(d, config.nodeCursor))\n    .style('fill', (d: SankeyNode<N, L>) => getColor(d, config.nodeColor))\n\n  // Label Rendering\n  // eslint-disable-next-line @typescript-eslint/no-use-before-define\n  renderNodeLabels(sel, config, width, duration)\n\n  // Node Icon\n  const nodeIcon = sel.select(`.${s.nodeIcon}`)\n  if (config.nodeIcon) {\n    nodeIcon\n      .attr('visibility', null)\n      .attr('text-anchor', 'middle')\n      .attr('alignment-baseline', 'middle')\n      .style('stroke', (d: SankeyNode<N, L>) => getColor(d, config.nodeIconColor))\n      .style('fill', (d: SankeyNode<N, L>) => getColor(d, config.nodeIconColor))\n      .style('font-size', (d: SankeyNode<N, L>) => {\n        const nodeHeight = d.y1 - d.y0\n        return nodeHeight < s.SANKEY_ICON_SIZE ? `${nodeHeight * 0.65}px` : null\n      })\n      .html(config.nodeIcon)\n\n    smartTransition(nodeIcon, duration)\n      .attr('x', config.nodeWidth / 2)\n      .attr('y', (d: SankeyNode<N, L>) => (d.y1 - d.y0) / 2)\n  } else {\n    nodeIcon\n      .attr('visibility', 'hidden')\n  }\n}\n\nexport function renderNodeLabels<N extends SankeyInputNode, L extends SankeyInputLink> (\n  sel: Selection<SVGGElement, SankeyNode<N, L>, SVGGElement, unknown>,\n  config: SankeyConfig<N, L>,\n  width: number,\n  duration: number,\n  enforceNodeVisibility?: SankeyNode<N, L>\n): void {\n  // Label Rendering\n  const labelGroupSelection: Selection<SVGGElement, SankeyNode<N, L>, SVGGElement, any> = sel.select(`.${s.labelGroup}`)\n  const labelGroupEls = labelGroupSelection.nodes() || []\n\n  // After rendering Label return a BBox so we can do intersection detection and hide some of tem\n  const labelGroupBBoxes = labelGroupEls.map(g => {\n    const gSelection: Selection<SVGGElement, SankeyNode<N, L>, SVGGElement, any> = select(g)\n    const datum = gSelection.datum()\n    return renderLabel(gSelection, datum, config, width, duration, enforceNodeVisibility === datum)\n  })\n\n  if (config.labelVisibility) {\n    for (const b of labelGroupBBoxes) {\n      const datum = b.selection.datum() as SankeyNode<N, L>\n      const box = { x: b.x, y: b.y, width: b.width, height: b.height }\n      b.hidden = !config.labelVisibility(datum, box, enforceNodeVisibility === datum)\n    }\n  } else {\n    // Detect intersecting labels\n    const maxLayer = Math.max(...labelGroupBBoxes.map(b => b.layer))\n    for (let layer = 0; layer <= maxLayer; layer += 1) {\n      const boxes = labelGroupBBoxes.filter(b => (b.layer === layer))\n      boxes.sort((a, b) => a.y - b.y)\n\n      let lastVisibleIdx = 0\n      for (let i = 1; i < boxes.length; i += 1) {\n        const b0 = boxes[lastVisibleIdx]\n        const b1 = boxes[i]\n\n        const shouldBeHidden = b1.y < (b0.y + b0.height)\n        if (shouldBeHidden) {\n          if (b1.selection.datum() === enforceNodeVisibility) b0.hidden = true // If the hovered node should be hidden, hide the previous one instead\n          else b1.hidden = true\n        }\n\n        if (!b1.hidden) lastVisibleIdx = i\n      }\n    }\n  }\n\n  // Hide intersecting labels\n  for (const b of labelGroupBBoxes) {\n    b.selection.classed(s.hidden, b.hidden)\n  }\n}\n\nexport function removeNodes<N extends SankeyInputNode, L extends SankeyInputLink> (\n  selection: Selection<SVGGElement, SankeyNode<N, L>, SVGGElement, unknown>,\n  config: SankeyConfig<N, L>,\n  duration: number\n): void {\n  const { exitTransitionType } = config\n\n  selection.each((d, i, els) => {\n    const node = select(els[i])\n    const transition = smartTransition(node, duration)\n    if ((exitTransitionType === SankeyExitTransitionType.ToAncestor) && d.targetLinks?.[0]) {\n      transition.attr('transform', `translate(${d.targetLinks[0].source.x0},${d.y0})`)\n    }\n\n    transition\n      .style('opacity', 0)\n      .remove()\n  })\n}\n\nexport function onNodeMouseOver<N extends SankeyInputNode, L extends SankeyInputLink> (\n  d: SankeyNode<N, L>,\n  nodeSelection: Selection<SVGGElement, SankeyNode<N, L>, SVGGElement, unknown>,\n  config: SankeyConfig<N, L>,\n  width: number\n): void {\n  const labelGroup = nodeSelection.raise()\n    .select<SVGGElement>(`.${s.labelGroup}`)\n\n  if ((config.labelExpandTrimmedOnHover && labelGroup.classed(s.labelTrimmed)) || labelGroup.classed(s.hidden)) {\n    renderLabel(labelGroup, d, config, width, 0, true)\n  }\n  labelGroup.classed(s.forceShow, true)\n}\n\nexport function onNodeMouseOut<N extends SankeyInputNode, L extends SankeyInputLink> (\n  d: SankeyNode<N, L>,\n  nodeSelection: Selection<SVGGElement, SankeyNode<N, L>, SVGGElement, unknown>,\n  config: SankeyConfig<N, L>,\n  width: number\n): void {\n  const labelGroup = nodeSelection.select<SVGGElement>(`.${s.labelGroup}`)\n  if (config.labelExpandTrimmedOnHover || labelGroup.classed(s.hidden)) {\n    renderLabel(labelGroup, d, config, width, 0)\n  }\n  labelGroup.classed(s.forceShow, false)\n}\n"],"names":["s.node","labelGroup","s.labelGroup","s.labelBackground","s.label","s.sublabel","s.nodeIcon","nodeIcon","s.SANKEY_ICON_SIZE","s.hidden","s.labelTrimmed","s.forceShow"],"mappings":"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"}

package/components/sankey/style.d.ts

@@ -0,0 +1,20 @@
+export declare const SANKEY_ICON_SIZE = 22;
+export declare const root: string;
+export declare const variables: void;
+export declare const links: string;
+export declare const nodes: string;
+export declare const link: string;
+export declare const linkPath: string;
+export declare const linkSelectionHelper: string;
+export declare const labelGroup: string;
+export declare const labelTrimmed: string;
+export declare const label: string;
+export declare const sublabel: string;
+export declare const labelBackground: string;
+export declare const hidden: string;
+export declare const forceShow: string;
+export declare const nodeGroup: string;
+export declare const node: string;
+export declare const nodeIcon: string;
+export declare const nodeExit: string;
+export declare const background: string;

package/{src/components/sankey/style.ts → components/sankey/style.js}

@@ -1,13 +1,11 @@
-import { css, injectGlobal } from '@emotion/css'
-import { UNOVIS_ICON_FONT_FAMILY_DEFAULT } from 'styles/index'
+import { css, injectGlobal } from '@emotion/css';
+import { UNOVIS_ICON_FONT_FAMILY_DEFAULT } from '../../styles/index.js';
 
-export const SANKEY_ICON_SIZE = 22
-
-export const root = css`
+const SANKEY_ICON_SIZE = 22;
+const root = css `
   label: sankey-component;
-`
-
-export const variables = injectGlobal`
+`;
+const variables = injectGlobal `
   :root {
      /* Links */
     --vis-sankey-link-cursor: default;
@@ -59,17 +57,14 @@ export const variables = injectGlobal`
     --vis-sankey-node-label-background-stroke-color: var(--vis-dark-sankey-label-background-stroke-color);
     --vis-sankey-icon-color: var(--vis-dark-sankey-icon-color);
   }
-`
-
-export const links = css`
+`;
+const links = css `
   label: links;
-`
-
-export const nodes = css`
+`;
+const nodes = css `
   label: nodes;
-`
-
-export const link = css`
+`;
+const link = css `
   label: link;
 
   path {
@@ -83,27 +78,22 @@ export const link = css`
       fill-opacity: var(--vis-sankey-link-hover-opacity);
     }
   }
-`
-
-export const linkPath = css`
+`;
+const linkPath = css `
   label: visible;
-`
-
-export const linkSelectionHelper = css`
+`;
+const linkSelectionHelper = css `
   label: transparent;
   opacity: 0;
-`
-
-export const labelGroup = css`
+`;
+const labelGroup = css `
   label: label-group;
   cursor: var(--vis-sankey-node-label-cursor);
-`
-
-export const labelTrimmed = css`
+`;
+const labelTrimmed = css `
   label: label-trimmed;
-`
-
-export const label = css`
+`;
+const label = css `
   label: label;
   dominant-baseline: hanging;
 
@@ -116,9 +106,8 @@ export const label = css`
     font-family: var(--vis-sankey-label-font-family, var(--vis-font-family));
     dominant-baseline: hanging;
   }
-`
-
-export const sublabel = css`
+`;
+const sublabel = css `
   label: sub-label;
   dominant-baseline: hanging;
 
@@ -130,30 +119,25 @@ export const sublabel = css`
     font-weight: var(--vis-sankey-node-sublabel-font-weight);
     dominant-baseline: hanging;
   }
-`
-
-export const labelBackground = css`
+`;
+const labelBackground = css `
   label: label-background;
   stroke: var(--vis-sankey-node-label-background-stroke-color);
   fill: var(--vis-sankey-node-label-background-fill-color);
   opacity: var(--vis-sankey-node-label-background-opacity);
-`
-
-export const hidden = css`
+`;
+const hidden = css `
   label: hidden;
   visibility: hidden;
-`
-
-export const forceShow = css`
+`;
+const forceShow = css `
   label: forceShow;
   visibility: visible;
-`
-
-export const nodeGroup = css`
+`;
+const nodeGroup = css `
   label: node-group;
-`
-
-export const node = css`
+`;
+const node = css `
   label: node;
 
   cursor: var(--vis-sankey-node-cursor);
@@ -163,9 +147,8 @@ export const node = css`
   &:hover {
     opacity: var(--vis-sankey-node-hover-opacity);
   }
-`
-
-export const nodeIcon = css`
+`;
+const nodeIcon = css `
   label: icon;
 
   font-family: var(--vis-sankey-icon-font-family);
@@ -176,12 +159,13 @@ export const nodeIcon = css`
   stroke-opacity: var(--vis-sankey-icon-stroke-opacity);
   user-select: none;
   pointer-events: none;
-`
-
-export const nodeExit = css`
+`;
+const nodeExit = css `
   label: node-exit;
-`
-
-export const background = css`
+`;
+const background = css `
   label: background;
-`
+`;
+
+export { SANKEY_ICON_SIZE, background, forceShow, hidden, label, labelBackground, labelGroup, labelTrimmed, link, linkPath, linkSelectionHelper, links, node, nodeExit, nodeGroup, nodeIcon, nodes, root, sublabel, variables };
+//# sourceMappingURL=style.js.map

package/components/sankey/style.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.js","sources":["../../../src/components/sankey/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\nimport { UNOVIS_ICON_FONT_FAMILY_DEFAULT } from 'styles/index'\n\nexport const SANKEY_ICON_SIZE = 22\n\nexport const root = css`\n  label: sankey-component;\n`\n\nexport const variables = injectGlobal`\n  :root {\n     /* Links */\n    --vis-sankey-link-cursor: default;\n    --vis-sankey-link-color: var(--vis-color-main-light);\n    --vis-sankey-link-opacity: 0.5;\n    --vis-sankey-link-hover-opacity: 1.0;\n    /* Nodes */\n    --vis-sankey-node-cursor: default;\n    --vis-sankey-node-color: var(--vis-color-main);\n    --vis-sankey-node-label-color: #575c65;\n    --vis-sankey-node-opacity: 0.9;\n    --vis-sankey-node-hover-opacity: 1.0;\n    /* Node Labels */\n    --vis-sankey-node-label-background-fill-color: #ffffff;\n    --vis-sankey-node-label-background-stroke-color: #eaeaea;\n    --vis-sankey-node-label-background-opacity: 0.9;\n    --vis-sankey-node-label-color: #575c65;\n    --vis-sankey-node-label-cursor: default;\n    --vis-sankey-node-label-font-weight: 600;\n    --vis-sankey-node-label-font-size: 12px;\n    --vis-sankey-node-label-text-decoration: none;\n\n    --vis-sankey-node-sublabel-font-size: 10px;\n    --vis-sankey-node-sublabel-font-weight: 500;\n\n    /* Icons */\n    --vis-sankey-icon-size: ${SANKEY_ICON_SIZE}px;\n    --vis-sankey-icon-color: #ffffff;\n    --vis-sankey-icon-stroke-opacity: 0.6;\n    --vis-sankey-icon-font-family: ${UNOVIS_ICON_FONT_FAMILY_DEFAULT};\n\n    // Undefined by default to allow proper fallback to var(--vis-font-family)\n    /* --vis-sankey-label-font-family: */\n\n    /* Dark Theme */\n    --vis-dark-sankey-link-color: var(--vis-color-main-dark);\n    --vis-dark-sankey-node-color: var(--vis-color-main);\n    --vis-dark-sankey-node-label-color: #eaeaea;\n    --vis-dark-sankey-node-label-background-fill-color: #292b34;\n    --vis-dark-sankey-node-label-background-stroke-color: #575c65;\n    --vis-dark-sankey-icon-color: #292b34;\n  }\n\n  body.theme-dark ${`.${root}`} {\n    --vis-sankey-node-color: var(--vis-dark-sankey-node-color);\n    --vis-sankey-link-color: var(--vis-dark-sankey-link-color);\n    --vis-sankey-node-label-color: var(--vis-dark-sankey-node-label-color);\n    --vis-sankey-node-label-background-fill-color: var(--vis-dark-sankey-label-background-fill-color);\n    --vis-sankey-node-label-background-stroke-color: var(--vis-dark-sankey-label-background-stroke-color);\n    --vis-sankey-icon-color: var(--vis-dark-sankey-icon-color);\n  }\n`\n\nexport const links = css`\n  label: links;\n`\n\nexport const nodes = css`\n  label: nodes;\n`\n\nexport const link = css`\n  label: link;\n\n  path {\n    cursor: var(--vis-sankey-link-cursor);\n    fill: var(--vis-sankey-link-color);\n    fill-opacity: var(--vis-sankey-link-opacity);\n  }\n\n  &:hover {\n    path {\n      fill-opacity: var(--vis-sankey-link-hover-opacity);\n    }\n  }\n`\n\nexport const linkPath = css`\n  label: visible;\n`\n\nexport const linkSelectionHelper = css`\n  label: transparent;\n  opacity: 0;\n`\n\nexport const labelGroup = css`\n  label: label-group;\n  cursor: var(--vis-sankey-node-label-cursor);\n`\n\nexport const labelTrimmed = css`\n  label: label-trimmed;\n`\n\nexport const label = css`\n  label: label;\n  dominant-baseline: hanging;\n\n  fill: var(--vis-sankey-node-label-color);\n  text-decoration: var(--vis-sankey-node-label-text-decoration);\n  font-weight: var(--vis-sankey-node-label-font-weight);\n  user-select: none;\n\n  &, tspan {\n    font-family: var(--vis-sankey-label-font-family, var(--vis-font-family));\n    dominant-baseline: hanging;\n  }\n`\n\nexport const sublabel = css`\n  label: sub-label;\n  dominant-baseline: hanging;\n\n  fill: var(--vis-sankey-node-label-color);\n  user-select: none;\n\n  &, tspan {\n    font-family: var(--vis-sankey-label-font-family, var(--vis-font-family));\n    font-weight: var(--vis-sankey-node-sublabel-font-weight);\n    dominant-baseline: hanging;\n  }\n`\n\nexport const labelBackground = css`\n  label: label-background;\n  stroke: var(--vis-sankey-node-label-background-stroke-color);\n  fill: var(--vis-sankey-node-label-background-fill-color);\n  opacity: var(--vis-sankey-node-label-background-opacity);\n`\n\nexport const hidden = css`\n  label: hidden;\n  visibility: hidden;\n`\n\nexport const forceShow = css`\n  label: forceShow;\n  visibility: visible;\n`\n\nexport const nodeGroup = css`\n  label: node-group;\n`\n\nexport const node = css`\n  label: node;\n\n  cursor: var(--vis-sankey-node-cursor);\n  fill: var(--vis-sankey-node-color);\n  opacity: var(--vis-sankey-node-opacity);\n\n  &:hover {\n    opacity: var(--vis-sankey-node-hover-opacity);\n  }\n`\n\nexport const nodeIcon = css`\n  label: icon;\n\n  font-family: var(--vis-sankey-icon-font-family);\n  text-anchor: middle;\n  font-size: var(--vis-sankey-icon-size);\n  fill: var(--vis-sankey-node-icon-color);\n  stroke: var(--vis-sankey-node-color);\n  stroke-opacity: var(--vis-sankey-icon-stroke-opacity);\n  user-select: none;\n  pointer-events: none;\n`\n\nexport const nodeExit = css`\n  label: node-exit;\n`\n\nexport const background = css`\n  label: background;\n`\n"],"names":[],"mappings":";;;AAGO,MAAM,gBAAgB,GAAG,GAAE;AAE3B,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;8BA2BP,gBAAgB,CAAA;;;qCAGT,+BAA+B,CAAA;;;;;;;;;;;;;;AAchD,kBAAA,EAAA,CAAA,CAAA,EAAI,IAAI,CAAE,CAAA,CAAA;;;;;;;;EAQ7B;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;EAEvB;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;EAEvB;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;;EActB;AAEM,MAAM,QAAQ,GAAG,GAAG,CAAA,CAAA;;EAE1B;AAEM,MAAM,mBAAmB,GAAG,GAAG,CAAA,CAAA;;;EAGrC;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;;EAG5B;AAEM,MAAM,YAAY,GAAG,GAAG,CAAA,CAAA;;EAE9B;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;EAavB;AAEM,MAAM,QAAQ,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;EAY1B;AAEM,MAAM,eAAe,GAAG,GAAG,CAAA,CAAA;;;;;EAKjC;AAEM,MAAM,MAAM,GAAG,GAAG,CAAA,CAAA;;;EAGxB;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;;EAG3B;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;EAE3B;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;EAUtB;AAEM,MAAM,QAAQ,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;EAW1B;AAEM,MAAM,QAAQ,GAAG,GAAG,CAAA,CAAA;;EAE1B;AAEM,MAAM,UAAU,GAAG,GAAG,CAAA,CAAA;;;;;;"}

package/components/sankey/types.d.ts

@@ -0,0 +1,84 @@
+import { sankeyLeft, sankeyRight, sankeyCenter, sankeyJustify } from 'd3-sankey';
+import { GraphInputLink, GraphLinkCore, GraphNodeCore } from "../../types/graph";
+import { GraphInputNode } from '../../types';
+export declare type SankeyInputNode = GraphInputNode;
+export declare type SankeyInputLink = GraphInputLink;
+export declare type SankeyNode<N extends SankeyInputNode, L extends SankeyInputLink> = GraphNodeCore<N, L> & {
+    id: string;
+    /** the node’s value; this is the sum of link.value for the node’s incoming links, or node.fixedValue if defined */
+    value: number;
+    /** */
+    fixedValue?: number;
+    /** the node’s zero-based column index, corresponding to its horizontal position */
+    layer: number;
+    /** */
+    isConnected: boolean;
+    /** the array of incoming links which have this node as their source */
+    sourceLinks?: SankeyLink<N, L>[];
+    /** the array of outgoing links which have this node as their target */
+    targetLinks: SankeyLink<N, L>[];
+    /** the node’s zero-based index within the array of nodes */
+    index: number;
+    /** the node’s zero-based graph depth, derived from the graph topology */
+    depth: number;
+    /** node.height - the node’s zero-based graph height, derived from the graph topology */
+    height: number;
+    /** the node’s minimum horizontal position, derived from node.depth */
+    x0: number;
+    /** the node’s maximum horizontal position (node.x0 + sankey.nodeWidth) */
+    x1: number;
+    /** the node’s minimum vertical position */
+    y0: number;
+    /** the node’s maximum vertical position (node.y1 - node.y0 is proportional to node.value) */
+    y1: number;
+    /** calculated node width */
+    width: number;
+    /** internal ui state */
+    _state?: {
+        greyout?: boolean;
+        precalculatedHeight?: number;
+    };
+};
+export declare type SankeyLink<N extends SankeyInputNode, L extends SankeyInputLink> = GraphLinkCore<N, L> & {
+    value: number;
+    /** the link’s source node */
+    source: SankeyNode<N, L>;
+    /** the link’s target node */
+    target: SankeyNode<N, L>;
+    /** the link’s vertical starting position (at source node) */
+    y0: number;
+    /** the link’s vertical end position (at target node) */
+    y1: number;
+    /** the link’s width (proportional to link.value) */
+    width: number;
+    /** the zero-based index of link within the array of links */
+    index: number;
+    /** internal ui state */
+    _state?: {
+        greyout?: boolean;
+    };
+};
+export declare enum SankeySubLabelPlacement {
+    Inline = "inline",
+    Below = "below"
+}
+export declare enum SankeyNodeAlign {
+    Left = "left",
+    Right = "right",
+    Center = "center",
+    Justify = "justify"
+}
+export declare const SankeyLayout: {
+    left: typeof sankeyLeft;
+    right: typeof sankeyRight;
+    center: typeof sankeyCenter;
+    justify: typeof sankeyJustify;
+};
+export declare enum SankeyExitTransitionType {
+    Default = "default",
+    ToAncestor = "to ancestor"
+}
+export declare enum SankeyEnterTransitionType {
+    Default = "default",
+    FromAncestor = "from ancestor"
+}

package/components/sankey/types.js

@@ -0,0 +1,34 @@
+import { sankeyLeft, sankeyRight, sankeyCenter, sankeyJustify } from 'd3-sankey';
+
+/* eslint-disable no-use-before-define */
+var SankeySubLabelPlacement;
+(function (SankeySubLabelPlacement) {
+    SankeySubLabelPlacement["Inline"] = "inline";
+    SankeySubLabelPlacement["Below"] = "below";
+})(SankeySubLabelPlacement || (SankeySubLabelPlacement = {}));
+var SankeyNodeAlign;
+(function (SankeyNodeAlign) {
+    SankeyNodeAlign["Left"] = "left";
+    SankeyNodeAlign["Right"] = "right";
+    SankeyNodeAlign["Center"] = "center";
+    SankeyNodeAlign["Justify"] = "justify";
+})(SankeyNodeAlign || (SankeyNodeAlign = {}));
+const SankeyLayout = {
+    [SankeyNodeAlign.Left]: sankeyLeft,
+    [SankeyNodeAlign.Right]: sankeyRight,
+    [SankeyNodeAlign.Center]: sankeyCenter,
+    [SankeyNodeAlign.Justify]: sankeyJustify,
+};
+var SankeyExitTransitionType;
+(function (SankeyExitTransitionType) {
+    SankeyExitTransitionType["Default"] = "default";
+    SankeyExitTransitionType["ToAncestor"] = "to ancestor";
+})(SankeyExitTransitionType || (SankeyExitTransitionType = {}));
+var SankeyEnterTransitionType;
+(function (SankeyEnterTransitionType) {
+    SankeyEnterTransitionType["Default"] = "default";
+    SankeyEnterTransitionType["FromAncestor"] = "from ancestor";
+})(SankeyEnterTransitionType || (SankeyEnterTransitionType = {}));
+
+export { SankeyEnterTransitionType, SankeyExitTransitionType, SankeyLayout, SankeyNodeAlign, SankeySubLabelPlacement };
+//# sourceMappingURL=types.js.map