@unovis/ts 1.2.2-beta.3 → 1.2.2-beta.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,5 +1,5 @@
1
1
  import { Config } from "../../core/config";
2
- import { BulletLegendItemInterface } from './types';
2
+ import { BulletLegendItemInterface, BulletShape } from './types';
3
3
  export interface BulletLegendConfigInterface {
4
4
  /** Legend items. Array of `BulletLegendItemInterface`:
5
5
  * ```
@@ -21,8 +21,10 @@ export interface BulletLegendConfigInterface {
21
21
  labelFontSize?: string | null;
22
22
  /** Label text (<span> element) max-width CSS property. Default: `null` */
23
23
  labelMaxWidth?: string | null;
24
- /** Bullet circle size, mapped to the width and height CSS properties. Default: `null` */
24
+ /** Bullet shape size, mapped to the width and height CSS properties. Default: `null` */
25
25
  bulletSize?: string | null;
26
+ /** Bullet shape: `BulletShape.Circle`, `BulletShape.Line` or `BulletShape.Square`. Default: `BulletShape.Circle` */
27
+ bulletShape?: BulletShape;
26
28
  }
27
29
  export declare class BulletLegendConfig extends Config implements BulletLegendConfigInterface {
28
30
  items: BulletLegendItemInterface[];
@@ -31,4 +33,5 @@ export declare class BulletLegendConfig extends Config implements BulletLegendCo
31
33
  labelFontSize: any;
32
34
  labelMaxWidth: any;
33
35
  bulletSize: any;
36
+ bulletShape: BulletShape;
34
37
  }
@@ -1,4 +1,5 @@
1
1
  import { Config } from '../../core/config/index.js';
2
+ import { BulletShape } from './types.js';
2
3
 
3
4
  class BulletLegendConfig extends Config {
4
5
  constructor() {
@@ -9,6 +10,7 @@ class BulletLegendConfig extends Config {
9
10
  this.labelFontSize = null;
10
11
  this.labelMaxWidth = null;
11
12
  this.bulletSize = null;
13
+ this.bulletShape = BulletShape.Circle;
12
14
  }
13
15
  }
14
16
 
@@ -1 +1 @@
1
- {"version":3,"file":"config.js","sources":["../../../src/components/bullet-legend/config.ts"],"sourcesContent":["import { Config } from 'core/config'\n\n// Local Types\nimport { BulletLegendItemInterface } from './types'\n\nexport interface BulletLegendConfigInterface {\n /** Legend items. Array of `BulletLegendItemInterface`:\n * ```\n * {\n * name: string | number;\n * color?: string;\n * inactive?: boolean;\n * hidden?: boolean;\n * pointer?: boolean;\n * }\n * ```\n * Default: `[]` */\n items: BulletLegendItemInterface[];\n /** Apply a specific class to the labels. Default: `''` */\n labelClassName?: string;\n /** Callback function for the legend item click. Default: `undefined` */\n onLegendItemClick?: ((d: BulletLegendItemInterface, i: number) => void);\n /** Label text (<span> element) font-size CSS. Default: `null` */\n labelFontSize?: string | null;\n /** Label text (<span> element) max-width CSS property. Default: `null` */\n labelMaxWidth?: string | null;\n /** Bullet circle size, mapped to the width and height CSS properties. Default: `null` */\n bulletSize?: string | null;\n}\n\nexport class BulletLegendConfig extends Config implements BulletLegendConfigInterface {\n items: BulletLegendItemInterface[] = []\n labelClassName = ''\n onLegendItemClick = undefined\n labelFontSize = null\n labelMaxWidth = null\n bulletSize = null\n}\n"],"names":[],"mappings":";;AA8BM,MAAO,kBAAmB,SAAQ,MAAM,CAAA;AAA9C,IAAA,WAAA,GAAA;;QACE,IAAK,CAAA,KAAA,GAAgC,EAAE,CAAA;QACvC,IAAc,CAAA,cAAA,GAAG,EAAE,CAAA;QACnB,IAAiB,CAAA,iBAAA,GAAG,SAAS,CAAA;QAC7B,IAAa,CAAA,aAAA,GAAG,IAAI,CAAA;QACpB,IAAa,CAAA,aAAA,GAAG,IAAI,CAAA;QACpB,IAAU,CAAA,UAAA,GAAG,IAAI,CAAA;KAClB;AAAA;;;;"}
1
+ {"version":3,"file":"config.js","sources":["../../../src/components/bullet-legend/config.ts"],"sourcesContent":["import { Config } from 'core/config'\n\n// Local Types\nimport { BulletLegendItemInterface, BulletShape } from './types'\n\nexport interface BulletLegendConfigInterface {\n /** Legend items. Array of `BulletLegendItemInterface`:\n * ```\n * {\n * name: string | number;\n * color?: string;\n * inactive?: boolean;\n * hidden?: boolean;\n * pointer?: boolean;\n * }\n * ```\n * Default: `[]` */\n items: BulletLegendItemInterface[];\n /** Apply a specific class to the labels. Default: `''` */\n labelClassName?: string;\n /** Callback function for the legend item click. Default: `undefined` */\n onLegendItemClick?: ((d: BulletLegendItemInterface, i: number) => void);\n /** Label text (<span> element) font-size CSS. Default: `null` */\n labelFontSize?: string | null;\n /** Label text (<span> element) max-width CSS property. Default: `null` */\n labelMaxWidth?: string | null;\n /** Bullet shape size, mapped to the width and height CSS properties. Default: `null` */\n bulletSize?: string | null;\n /** Bullet shape: `BulletShape.Circle`, `BulletShape.Line` or `BulletShape.Square`. Default: `BulletShape.Circle` */\n bulletShape?: BulletShape;\n}\n\nexport class BulletLegendConfig extends Config implements BulletLegendConfigInterface {\n items: BulletLegendItemInterface[] = []\n labelClassName = ''\n onLegendItemClick = undefined\n labelFontSize = null\n labelMaxWidth = null\n bulletSize = null\n bulletShape = BulletShape.Circle\n}\n"],"names":[],"mappings":";;;AAgCM,MAAO,kBAAmB,SAAQ,MAAM,CAAA;AAA9C,IAAA,WAAA,GAAA;;QACE,IAAK,CAAA,KAAA,GAAgC,EAAE,CAAA;QACvC,IAAc,CAAA,cAAA,GAAG,EAAE,CAAA;QACnB,IAAiB,CAAA,iBAAA,GAAG,SAAS,CAAA;QAC7B,IAAa,CAAA,aAAA,GAAG,IAAI,CAAA;QACpB,IAAa,CAAA,aAAA,GAAG,IAAI,CAAA;QACpB,IAAU,CAAA,UAAA,GAAG,IAAI,CAAA;AACjB,QAAA,IAAA,CAAA,WAAW,GAAG,WAAW,CAAC,MAAM,CAAA;KACjC;AAAA;;;;"}
@@ -1,7 +1,6 @@
1
1
  import { select } from 'd3-selection';
2
- import { color } from 'd3-color';
3
- import { getColor } from '../../utils/color.js';
4
2
  import { BulletLegendConfig } from './config.js';
3
+ import { createBullets, updateBullets } from './modules/shape.js';
5
4
  import * as style from './style.js';
6
5
  import { root, item, bullet, label, clickable } from './style.js';
7
6
 
@@ -32,8 +31,7 @@ class BulletLegend {
32
31
  .on('click', this._onItemClick.bind(this));
33
32
  legendItemsEnter.append('span')
34
33
  .attr('class', bullet)
35
- .style('width', config.bulletSize)
36
- .style('height', config.bulletSize);
34
+ .call(createBullets, config);
37
35
  legendItemsEnter.append('span')
38
36
  .attr('class', label)
39
37
  .classed(config.labelClassName, true)
@@ -43,18 +41,10 @@ class BulletLegend {
43
41
  legendItemsMerged
44
42
  .classed(clickable, d => !!config.onLegendItemClick && this._isItemClickable(d))
45
43
  .style('display', (d) => d.hidden ? 'none' : null);
46
- const legendBulletsToUpdate = legendItemsMerged.select(`.${bullet}`);
47
- legendBulletsToUpdate.style('background-color', (d, i) => getColor(d, this._colorAccessor, i))
48
- .style('border-color', (d, i) => getColor(d, this._colorAccessor, i));
49
- legendBulletsToUpdate.each((d, i, elements) => {
50
- if (d.inactive) {
51
- const bulletColor = window.getComputedStyle(elements[i]).getPropertyValue('background-color');
52
- const transparentColor = color(bulletColor);
53
- transparentColor.opacity = 0.4;
54
- select(elements[i])
55
- .style('background-color', transparentColor.toString());
56
- }
57
- });
44
+ legendItemsMerged.select(`.${bullet}`)
45
+ .style('min-width', config.bulletSize)
46
+ .style('height', config.bulletSize)
47
+ .call(updateBullets, this.config, this._colorAccessor);
58
48
  legendItemsMerged.select(`.${label}`)
59
49
  .text((d) => d.name);
60
50
  legendItems.exit().remove();
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/components/bullet-legend/index.ts"],"sourcesContent":["import { select, Selection } from 'd3-selection'\nimport { color } from 'd3-color'\n\n// Utils\nimport { getColor } from 'utils/color'\n\n// Config\nimport { BulletLegendConfig, BulletLegendConfigInterface } from './config'\n\n// Local Types\nimport { BulletLegendItemInterface } from './types'\n\n// Styles\nimport * as s from './style'\n\nexport class BulletLegend {\n static selectors = s\n div: Selection<HTMLDivElement, unknown, null, undefined>\n element: HTMLElement\n prevConfig: BulletLegendConfig\n config: BulletLegendConfig\n protected _container: HTMLElement\n\n private _colorAccessor = (d: BulletLegendItemInterface): string => d.color\n\n constructor (element: HTMLElement, config?: BulletLegendConfigInterface) {\n this._container = element\n\n // Create SVG element for visualizations\n this.div = select(this._container)\n .append('div')\n .attr('class', s.root)\n\n this.element = this.div.node()\n\n if (config) this.update(config)\n }\n\n update (config: BulletLegendConfigInterface): void {\n this.prevConfig = this.config\n this.config = new BulletLegendConfig().init(config)\n this.render()\n }\n\n render (): void {\n const { config } = this\n const legendItems = this.div.selectAll<HTMLDivElement, unknown>(`.${s.item}`)\n .data(config.items)\n\n const legendItemsEnter = legendItems.enter()\n .append('div')\n .attr('class', s.item)\n .on('click', this._onItemClick.bind(this))\n\n legendItemsEnter.append('span')\n .attr('class', s.bullet)\n .style('width', config.bulletSize)\n .style('height', config.bulletSize)\n\n legendItemsEnter.append('span')\n .attr('class', s.label)\n .classed(config.labelClassName, true)\n .style('max-width', config.labelMaxWidth)\n .style('font-size', config.labelFontSize)\n\n const legendItemsMerged = legendItemsEnter.merge(legendItems)\n legendItemsMerged\n .classed(s.clickable, d => !!config.onLegendItemClick && this._isItemClickable(d))\n .style('display', (d: BulletLegendItemInterface) => d.hidden ? 'none' : null)\n const legendBulletsToUpdate = legendItemsMerged.select(`.${s.bullet}`)\n legendBulletsToUpdate.style('background-color', (d: BulletLegendItemInterface, i) => getColor(d, this._colorAccessor, i))\n .style('border-color', (d: BulletLegendItemInterface, i) => getColor(d, this._colorAccessor, i))\n legendBulletsToUpdate.each((d, i, elements) => {\n if (d.inactive) {\n const bulletColor = window.getComputedStyle(elements[i] as Element).getPropertyValue('background-color')\n const transparentColor = color(bulletColor)\n transparentColor.opacity = 0.4\n select(elements[i])\n .style('background-color', transparentColor.toString())\n }\n })\n\n legendItemsMerged.select(`.${s.label}`)\n .text((d: BulletLegendItemInterface) => d.name)\n\n legendItems.exit().remove()\n }\n\n _isItemClickable (item: BulletLegendItemInterface): boolean {\n return item.pointer === undefined ? true : item.pointer\n }\n\n _onItemClick (event: MouseEvent, d: BulletLegendItemInterface): void {\n const { config: { onLegendItemClick } } = this\n\n const legendItems = this.div.selectAll(`.${s.item}`).nodes() as HTMLElement[]\n const index = legendItems.indexOf(event.currentTarget as HTMLElement)\n if (onLegendItemClick) onLegendItemClick(d, index)\n }\n\n public destroy (): void {\n this.div.remove()\n }\n}\n"],"names":["s.root","s.item","s.bullet","s.label","s.clickable","s"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../../../src/components/bullet-legend/index.ts"],"sourcesContent":["import { select, Selection } from 'd3-selection'\n\n// Config\nimport { BulletLegendConfig, BulletLegendConfigInterface } from './config'\n\n// Local Types\nimport { BulletLegendItemInterface } from './types'\n\n// Modules\nimport { createBullets, updateBullets } from './modules/shape'\n\n// Styles\nimport * as s from './style'\n\nexport class BulletLegend {\n static selectors = s\n div: Selection<HTMLDivElement, unknown, null, undefined>\n element: HTMLElement\n prevConfig: BulletLegendConfig\n config: BulletLegendConfig\n protected _container: HTMLElement\n\n private _colorAccessor = (d: BulletLegendItemInterface): string => d.color\n\n constructor (element: HTMLElement, config?: BulletLegendConfigInterface) {\n this._container = element\n\n // Create SVG element for visualizations\n this.div = select(this._container)\n .append('div')\n .attr('class', s.root)\n\n this.element = this.div.node()\n\n if (config) this.update(config)\n }\n\n update (config: BulletLegendConfigInterface): void {\n this.prevConfig = this.config\n this.config = new BulletLegendConfig().init(config)\n this.render()\n }\n\n render (): void {\n const { config } = this\n const legendItems = this.div.selectAll<HTMLDivElement, unknown>(`.${s.item}`)\n .data(config.items)\n\n const legendItemsEnter = legendItems.enter()\n .append('div')\n .attr('class', s.item)\n .on('click', this._onItemClick.bind(this))\n\n legendItemsEnter.append('span')\n .attr('class', s.bullet)\n .call(createBullets, config)\n\n legendItemsEnter.append('span')\n .attr('class', s.label)\n .classed(config.labelClassName, true)\n .style('max-width', config.labelMaxWidth)\n .style('font-size', config.labelFontSize)\n\n const legendItemsMerged = legendItemsEnter.merge(legendItems)\n legendItemsMerged\n .classed(s.clickable, d => !!config.onLegendItemClick && this._isItemClickable(d))\n .style('display', (d: BulletLegendItemInterface) => d.hidden ? 'none' : null)\n\n legendItemsMerged.select<HTMLSpanElement>(`.${s.bullet}`)\n .style('min-width', config.bulletSize)\n .style('height', config.bulletSize)\n .call(updateBullets, this.config, this._colorAccessor)\n\n legendItemsMerged.select(`.${s.label}`)\n .text((d: BulletLegendItemInterface) => d.name)\n\n legendItems.exit().remove()\n }\n\n _isItemClickable (item: BulletLegendItemInterface): boolean {\n return item.pointer === undefined ? true : item.pointer\n }\n\n _onItemClick (event: MouseEvent, d: BulletLegendItemInterface): void {\n const { config: { onLegendItemClick } } = this\n\n const legendItems = this.div.selectAll(`.${s.item}`).nodes() as HTMLElement[]\n const index = legendItems.indexOf(event.currentTarget as HTMLElement)\n if (onLegendItemClick) onLegendItemClick(d, index)\n }\n\n public destroy (): void {\n this.div.remove()\n }\n}\n"],"names":["s.root","s.item","s.bullet","s.label","s.clickable","s"],"mappings":"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"}
@@ -0,0 +1,6 @@
1
+ import { Selection } from 'd3-selection';
2
+ import { ColorAccessor } from "../../../types/accessor";
3
+ import { BulletLegendConfigInterface } from '../config';
4
+ import { BulletLegendItemInterface } from '../types';
5
+ export declare function createBullets(container: Selection<HTMLSpanElement, BulletLegendItemInterface, HTMLDivElement, unknown>, config: BulletLegendConfigInterface): void;
6
+ export declare function updateBullets(container: Selection<HTMLSpanElement, BulletLegendItemInterface, HTMLDivElement, unknown>, config: BulletLegendConfigInterface, colorAccessor: ColorAccessor<BulletLegendItemInterface>): void;
@@ -0,0 +1,58 @@
1
+ import { getColor } from '../../../utils/color.js';
2
+ import { circlePath } from '../../../utils/path.js';
3
+ import { BulletShape } from '../types.js';
4
+
5
+ // Utils
6
+ // Size with respect to the viewBox. We use this to compute path data which is independent of the
7
+ // the configured size.
8
+ const BULLET_SIZE = 20;
9
+ function getWidth(shape) {
10
+ switch (shape) {
11
+ case BulletShape.Line:
12
+ return BULLET_SIZE * 2.5;
13
+ default:
14
+ return BULLET_SIZE;
15
+ }
16
+ }
17
+ function getPath(shape, width, height) {
18
+ switch (shape) {
19
+ case BulletShape.Line:
20
+ return `M0,${height / 2} L${width / 2},${height / 2} L${width},${height / 2}`;
21
+ case BulletShape.Square:
22
+ return `M0,0 L${width},0 L${width},${height} L0,${height}Z`;
23
+ case BulletShape.Circle:
24
+ return circlePath(height / 2, height / 2, height / 2 - 1);
25
+ }
26
+ }
27
+ function createBullets(container, config) {
28
+ container.append('svg')
29
+ .attr('width', '100%')
30
+ .attr('height', '100%')
31
+ .append('path')
32
+ .attr('d', getPath(config.bulletShape, getWidth(config.bulletShape), BULLET_SIZE));
33
+ }
34
+ function updateBullets(container, config, colorAccessor) {
35
+ const height = BULLET_SIZE;
36
+ const width = getWidth(config.bulletShape);
37
+ const getOpacity = (d) => d.inactive ? 0.4 : 1;
38
+ const selection = container.select('svg')
39
+ .attr('viewBox', `0 0 ${width} ${height}`)
40
+ .select('path')
41
+ .attr('d', getPath(config.bulletShape, width, height))
42
+ .attr('stroke', (d, i) => getColor(d, colorAccessor, i))
43
+ .style('stroke-width', '1px')
44
+ .style('fill', (d, i) => getColor(d, colorAccessor, i))
45
+ .style('fill-opacity', getOpacity);
46
+ if (config.bulletShape === BulletShape.Line) {
47
+ selection
48
+ .style('stroke-width', `${height / 5}px`)
49
+ .style('opacity', getOpacity)
50
+ .style('fill', null)
51
+ .style('fill-opacity', null)
52
+ .style('marker-start', 'none')
53
+ .style('marker-end', 'none');
54
+ }
55
+ }
56
+
57
+ export { createBullets, updateBullets };
58
+ //# sourceMappingURL=shape.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"shape.js","sources":["../../../../src/components/bullet-legend/modules/shape.ts"],"sourcesContent":["import { Selection } from 'd3-selection'\n\n// Types\nimport { ColorAccessor } from 'types/accessor'\n\n// Utils\nimport { getColor } from 'utils/color'\nimport { circlePath } from 'utils/path'\n\n// Local types\nimport { BulletLegendConfigInterface } from '../config'\nimport { BulletShape, BulletLegendItemInterface } from '../types'\n\n// Size with respect to the viewBox. We use this to compute path data which is independent of the\n// the configured size.\nconst BULLET_SIZE = 20\n\nfunction getWidth (shape: BulletShape): number {\n switch (shape) {\n case BulletShape.Line:\n return BULLET_SIZE * 2.5\n default:\n return BULLET_SIZE\n }\n}\n\nfunction getPath (shape: BulletShape, width: number, height: number): string {\n switch (shape) {\n case BulletShape.Line:\n return `M0,${height / 2} L${width / 2},${height / 2} L${width},${height / 2}`\n case BulletShape.Square:\n return `M0,0 L${width},0 L${width},${height} L0,${height}Z`\n case BulletShape.Circle:\n return circlePath(height / 2, height / 2, height / 2 - 1)\n }\n}\n\nexport function createBullets (\n container: Selection<HTMLSpanElement, BulletLegendItemInterface, HTMLDivElement, unknown>,\n config: BulletLegendConfigInterface\n): void {\n container.append('svg')\n .attr('width', '100%')\n .attr('height', '100%')\n .append('path')\n .attr('d', getPath(config.bulletShape, getWidth(config.bulletShape), BULLET_SIZE))\n}\n\nexport function updateBullets (\n container: Selection<HTMLSpanElement, BulletLegendItemInterface, HTMLDivElement, unknown>,\n config: BulletLegendConfigInterface,\n colorAccessor: ColorAccessor<BulletLegendItemInterface>\n): void {\n const height = BULLET_SIZE\n const width = getWidth(config.bulletShape)\n\n const getOpacity = (d: BulletLegendItemInterface): number => d.inactive ? 0.4 : 1\n\n const selection = container.select('svg')\n .attr('viewBox', `0 0 ${width} ${height}`)\n .select('path')\n .attr('d', getPath(config.bulletShape, width, height))\n .attr('stroke', (d, i) => getColor(d, colorAccessor, i))\n .style('stroke-width', '1px')\n .style('fill', (d, i) => getColor(d, colorAccessor, i))\n .style('fill-opacity', getOpacity)\n\n if (config.bulletShape === BulletShape.Line) {\n selection\n .style('stroke-width', `${height / 5}px`)\n .style('opacity', getOpacity)\n .style('fill', null)\n .style('fill-opacity', null)\n .style('marker-start', 'none')\n .style('marker-end', 'none')\n }\n}\n"],"names":[],"mappings":"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"}
@@ -27,7 +27,8 @@ const variables = injectGlobal `
27
27
  `;
28
28
  const item = css `
29
29
  label: legendItem;
30
- display: inline;
30
+ display: inline-flex;
31
+ align-items: center;
31
32
  font-family: var(--vis-legend-font-family, var(--vis-font-family));
32
33
  margin-right: var(--vis-legend-item-spacing);
33
34
  white-space: nowrap;
@@ -50,18 +51,14 @@ const label = css `
50
51
  `;
51
52
  const bullet = css `
52
53
  label: legendItemBullet;
53
- border-radius: 100%;
54
- background-color: var(--vis-legend-bullet-inactive-color);
55
- border: 1px solid;
56
- display: inline-block;
57
54
  margin-right: var(--vis-legend-bullet-label-spacing);
58
- width: var(--vis-legend-bullet-size);
55
+ min-width: var(--vis-legend-bullet-size);
59
56
  height: var(--vis-legend-bullet-size);
60
- vertical-align: middle;
61
-
62
- .inactive {
63
57
 
58
+ > svg {
59
+ display: block;
64
60
  }
61
+ }
65
62
  `;
66
63
 
67
64
  export { bullet, clickable, item, label, root, variables };
@@ -1 +1 @@
1
- {"version":3,"file":"style.js","sources":["../../../src/components/bullet-legend/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\n\nexport const root = css`\n label: bullet-legend-component;\n`\n\nexport const variables = injectGlobal`\n :root {\n // Undefined by default to allow proper fallback to var(--vis-font-family)\n /* --vis-legend-font-family: */\n\n --vis-legend-label-color: #6c778c;\n --vis-legend-label-max-width: 300px;\n --vis-legend-label-font-size: 12px;\n --vis-legend-bullet-size: 9px;\n --vis-legend-bullet-inactive-color: #eee;\n --vis-legend-item-spacing: 20px;\n --vis-legend-bullet-label-spacing: 8px;\n\n --vis-dark-legend-label-color: #eee;\n --vis-dark-legend-bullet-inactive-color: #6c778c;\n }\n\n body.theme-dark ${`.${root}`} {\n --vis-legend-label-color: var(--vis-dark-legend-label-color);\n --vis-legend-bullet-inactive-color: var(--vis-dark-legend-bullet-inactive-color);\n }\n`\n\nexport const item = css`\n label: legendItem;\n display: inline;\n font-family: var(--vis-legend-font-family, var(--vis-font-family));\n margin-right: var(--vis-legend-item-spacing);\n white-space: nowrap;\n cursor: default;\n user-select: none;\n`\n\nexport const clickable = css`\n cursor: pointer;\n`\n\nexport const label = css`\n label: legendItemLabel;\n font-size: var(--vis-legend-label-font-size);\n display: inline-block;\n vertical-align: middle;\n color: var(--vis-legend-label-color);\n max-width: var(--vis-legend-label-max-width);\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n`\n\nexport const bullet = css`\n label: legendItemBullet;\n border-radius: 100%;\n background-color: var(--vis-legend-bullet-inactive-color);\n border: 1px solid;\n display: inline-block;\n margin-right: var(--vis-legend-bullet-label-spacing);\n width: var(--vis-legend-bullet-size);\n height: var(--vis-legend-bullet-size);\n vertical-align: middle;\n\n .inactive {\n\n }\n`\n"],"names":[],"mappings":";;AAEO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;;;AAiBjB,kBAAA,EAAA,CAAA,CAAA,EAAI,IAAI,CAAE,CAAA,CAAA;;;;EAI7B;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;EAQtB;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;EAE3B;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;EAUvB;AAEM,MAAM,MAAM,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"style.js","sources":["../../../src/components/bullet-legend/style.ts"],"sourcesContent":["import { css, injectGlobal } from '@emotion/css'\n\nexport const root = css`\n label: bullet-legend-component;\n`\n\nexport const variables = injectGlobal`\n :root {\n // Undefined by default to allow proper fallback to var(--vis-font-family)\n /* --vis-legend-font-family: */\n\n --vis-legend-label-color: #6c778c;\n --vis-legend-label-max-width: 300px;\n --vis-legend-label-font-size: 12px;\n --vis-legend-bullet-size: 9px;\n --vis-legend-bullet-inactive-color: #eee;\n --vis-legend-item-spacing: 20px;\n --vis-legend-bullet-label-spacing: 8px;\n\n --vis-dark-legend-label-color: #eee;\n --vis-dark-legend-bullet-inactive-color: #6c778c;\n }\n\n body.theme-dark ${`.${root}`} {\n --vis-legend-label-color: var(--vis-dark-legend-label-color);\n --vis-legend-bullet-inactive-color: var(--vis-dark-legend-bullet-inactive-color);\n }\n`\n\nexport const item = css`\n label: legendItem;\n display: inline-flex;\n align-items: center;\n font-family: var(--vis-legend-font-family, var(--vis-font-family));\n margin-right: var(--vis-legend-item-spacing);\n white-space: nowrap;\n cursor: default;\n user-select: none;\n`\n\nexport const clickable = css`\n cursor: pointer;\n`\n\nexport const label = css`\n label: legendItemLabel;\n font-size: var(--vis-legend-label-font-size);\n display: inline-block;\n vertical-align: middle;\n color: var(--vis-legend-label-color);\n max-width: var(--vis-legend-label-max-width);\n text-overflow: ellipsis;\n overflow: hidden;\n white-space: nowrap;\n`\n\nexport const bullet = css`\n label: legendItemBullet;\n margin-right: var(--vis-legend-bullet-label-spacing);\n min-width: var(--vis-legend-bullet-size);\n height: var(--vis-legend-bullet-size);\n\n > svg {\n display: block;\n }\n}\n`\n"],"names":[],"mappings":";;AAEO,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;EAEtB;AAEM,MAAM,SAAS,GAAG,YAAY,CAAA,CAAA;;;;;;;;;;;;;;;;;AAiBjB,kBAAA,EAAA,CAAA,CAAA,EAAI,IAAI,CAAE,CAAA,CAAA;;;;EAI7B;AAEM,MAAM,IAAI,GAAG,GAAG,CAAA,CAAA;;;;;;;;;EAStB;AAEM,MAAM,SAAS,GAAG,GAAG,CAAA,CAAA;;EAE3B;AAEM,MAAM,KAAK,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;EAUvB;AAEM,MAAM,MAAM,GAAG,GAAG,CAAA,CAAA;;;;;;;;;;;;;;"}
@@ -5,3 +5,8 @@ export interface BulletLegendItemInterface {
5
5
  hidden?: boolean;
6
6
  pointer?: boolean;
7
7
  }
8
+ export declare enum BulletShape {
9
+ Circle = "circle",
10
+ Line = "line",
11
+ Square = "square"
12
+ }
@@ -1,2 +1,9 @@
1
+ var BulletShape;
2
+ (function (BulletShape) {
3
+ BulletShape["Circle"] = "circle";
4
+ BulletShape["Line"] = "line";
5
+ BulletShape["Square"] = "square";
6
+ })(BulletShape || (BulletShape = {}));
1
7
 
8
+ export { BulletShape };
2
9
  //# sourceMappingURL=types.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
1
+ {"version":3,"file":"types.js","sources":["../../../src/components/bullet-legend/types.ts"],"sourcesContent":["export interface BulletLegendItemInterface {\n name: string | number;\n color?: string;\n inactive?: boolean;\n hidden?: boolean;\n pointer?: boolean;\n}\n\nexport enum BulletShape {\n Circle = 'circle',\n Line = 'line',\n Square = 'square',\n}\n"],"names":[],"mappings":"IAQY,YAIX;AAJD,CAAA,UAAY,WAAW,EAAA;AACrB,IAAA,WAAA,CAAA,QAAA,CAAA,GAAA,QAAiB,CAAA;AACjB,IAAA,WAAA,CAAA,MAAA,CAAA,GAAA,MAAa,CAAA;AACb,IAAA,WAAA,CAAA,QAAA,CAAA,GAAA,QAAiB,CAAA;AACnB,CAAC,EAJW,WAAW,KAAX,WAAW,GAItB,EAAA,CAAA,CAAA;;;;"}
@@ -1,9 +1,15 @@
1
1
  import { XYComponentConfigInterface, XYComponentConfig } from "../../core/xy-component/config";
2
2
  import { Tooltip } from "../tooltip";
3
- import { NumericAccessor } from "../../types/accessor";
3
+ import { NumericAccessor, ColorAccessor } from "../../types/accessor";
4
4
  import { ContinuousScale } from "../../types/scale";
5
5
  import { CrosshairCircle } from './types';
6
6
  export interface CrosshairConfigInterface<Datum> extends Partial<XYComponentConfigInterface<Datum>> {
7
+ /** Optional accessor function for getting the values along the X axis. Default: `undefined` */
8
+ x?: NumericAccessor<Datum>;
9
+ /** Optional single of multiple accessor functions for getting the values along the Y axis. Default: `undefined` */
10
+ y?: NumericAccessor<Datum> | NumericAccessor<Datum>[];
11
+ /** Optional color array or color accessor function for crosshair circles. Default: `d => d.color` */
12
+ color?: ColorAccessor<Datum> | ColorAccessor<Datum[]>;
7
13
  /** Separate array of accessors for stacked components (eg StackedBar, Area). Default: `undefined` */
8
14
  yStacked?: NumericAccessor<Datum>[];
9
15
  /** Baseline accessor function for stacked values, useful with stacked areas. Default: `null` */
@@ -1 +1 @@
1
- {"version":3,"file":"config.js","sources":["../../../src/components/crosshair/config.ts"],"sourcesContent":["import { XYComponentConfigInterface, XYComponentConfig } from 'core/xy-component/config'\nimport { Tooltip } from 'components/tooltip'\n\n// Types\nimport { NumericAccessor } from 'types/accessor'\nimport { ContinuousScale } from 'types/scale'\nimport { CrosshairCircle } from './types'\n\n// We extend partial XY config interface because x and y properties are optional for Crosshair\nexport interface CrosshairConfigInterface<Datum> extends Partial<XYComponentConfigInterface<Datum>> {\n /** Separate array of accessors for stacked components (eg StackedBar, Area). Default: `undefined` */\n yStacked?: NumericAccessor<Datum>[];\n /** Baseline accessor function for stacked values, useful with stacked areas. Default: `null` */\n baseline?: NumericAccessor<Datum>;\n /** An instance of the Tooltip component to be used with Crosshair. Default: `undefined` */\n tooltip?: Tooltip | undefined;\n /** Tooltip template accessor. The function is supposed to return either a valid HTML string or an HTMLElement. Default: `d => ''` */\n template?: (data: Datum, x: number | Date) => string | HTMLElement;\n /** Hide Crosshair when the corresponding element is far from mouse pointer. Default: `true` */\n hideWhenFarFromPointer?: boolean;\n /** Distance in pixels to check in the hideWhenFarFromPointer condition. Default: `100` */\n hideWhenFarFromPointerDistance?: number;\n /** Snap to the nearest data point.\n * If disabled, the tooltip template will receive only the horizontal position of the crosshair and you'll be responsible\n * for getting the underlying data records and crosshair circles (see the `getCircles` configuration option).\n * Default: `true`\n */\n snapToData?: boolean;\n /** Custom function for setting up the crosshair circles, usually needed when `snapToData` is set to `false`.\n * The function receives the horizontal position of the crosshair (in the data space, not in pixels), the data array\n * and the `yScale` instance to help you calculate the correct vertical position of the circles.\n * It has to return an array of the CrosshairCircle objects: `{ y: number; color: string; opacity?: number }[]`.\n * Default: `undefined`\n */\n getCircles?: (x: number, data: Datum[], yScale: ContinuousScale) => CrosshairCircle[];\n}\n\nexport class CrosshairConfig<Datum> extends XYComponentConfig<Datum> implements CrosshairConfigInterface<Datum> {\n yStacked = undefined\n baseline = null\n duration = 100\n tooltip: Tooltip = undefined\n template: ((data: Datum, x: number | Date) => string | HTMLElement) = (d: Datum): string => ''\n hideWhenFarFromPointer = true\n hideWhenFarFromPointerDistance = 100\n snapToData = true\n getCircles = undefined\n}\n"],"names":[],"mappings":";;AAqCM,MAAO,eAAuB,SAAQ,iBAAwB,CAAA;AAApE,IAAA,WAAA,GAAA;;QACE,IAAQ,CAAA,QAAA,GAAG,SAAS,CAAA;QACpB,IAAQ,CAAA,QAAA,GAAG,IAAI,CAAA;QACf,IAAQ,CAAA,QAAA,GAAG,GAAG,CAAA;QACd,IAAO,CAAA,OAAA,GAAY,SAAS,CAAA;AAC5B,QAAA,IAAA,CAAA,QAAQ,GAA8D,CAAC,CAAQ,KAAa,EAAE,CAAA;QAC9F,IAAsB,CAAA,sBAAA,GAAG,IAAI,CAAA;QAC7B,IAA8B,CAAA,8BAAA,GAAG,GAAG,CAAA;QACpC,IAAU,CAAA,UAAA,GAAG,IAAI,CAAA;QACjB,IAAU,CAAA,UAAA,GAAG,SAAS,CAAA;KACvB;AAAA;;;;"}
1
+ {"version":3,"file":"config.js","sources":["../../../src/components/crosshair/config.ts"],"sourcesContent":["import { XYComponentConfigInterface, XYComponentConfig } from 'core/xy-component/config'\nimport { Tooltip } from 'components/tooltip'\n\n// Types\nimport { NumericAccessor, ColorAccessor } from 'types/accessor'\nimport { ContinuousScale } from 'types/scale'\nimport { CrosshairCircle } from './types'\n\n// We extend partial XY config interface because x and y properties are optional for Crosshair\nexport interface CrosshairConfigInterface<Datum> extends Partial<XYComponentConfigInterface<Datum>> {\n /** Optional accessor function for getting the values along the X axis. Default: `undefined` */\n x?: NumericAccessor<Datum>;\n /** Optional single of multiple accessor functions for getting the values along the Y axis. Default: `undefined` */\n y?: NumericAccessor<Datum> | NumericAccessor<Datum>[];\n /** Optional color array or color accessor function for crosshair circles. Default: `d => d.color` */\n color?: ColorAccessor<Datum> | ColorAccessor<Datum[]>\n /** Separate array of accessors for stacked components (eg StackedBar, Area). Default: `undefined` */\n yStacked?: NumericAccessor<Datum>[];\n /** Baseline accessor function for stacked values, useful with stacked areas. Default: `null` */\n baseline?: NumericAccessor<Datum>;\n /** An instance of the Tooltip component to be used with Crosshair. Default: `undefined` */\n tooltip?: Tooltip | undefined;\n /** Tooltip template accessor. The function is supposed to return either a valid HTML string or an HTMLElement. Default: `d => ''` */\n template?: (data: Datum, x: number | Date) => string | HTMLElement;\n /** Hide Crosshair when the corresponding element is far from mouse pointer. Default: `true` */\n hideWhenFarFromPointer?: boolean;\n /** Distance in pixels to check in the hideWhenFarFromPointer condition. Default: `100` */\n hideWhenFarFromPointerDistance?: number;\n /** Snap to the nearest data point.\n * If disabled, the tooltip template will receive only the horizontal position of the crosshair and you'll be responsible\n * for getting the underlying data records and crosshair circles (see the `getCircles` configuration option).\n * Default: `true`\n */\n snapToData?: boolean;\n /** Custom function for setting up the crosshair circles, usually needed when `snapToData` is set to `false`.\n * The function receives the horizontal position of the crosshair (in the data space, not in pixels), the data array\n * and the `yScale` instance to help you calculate the correct vertical position of the circles.\n * It has to return an array of the CrosshairCircle objects: `{ y: number; color: string; opacity?: number }[]`.\n * Default: `undefined`\n */\n getCircles?: (x: number, data: Datum[], yScale: ContinuousScale) => CrosshairCircle[];\n}\n\nexport class CrosshairConfig<Datum> extends XYComponentConfig<Datum> implements CrosshairConfigInterface<Datum> {\n yStacked = undefined\n baseline = null\n duration = 100\n tooltip: Tooltip = undefined\n template: ((data: Datum, x: number | Date) => string | HTMLElement) = (d: Datum): string => ''\n hideWhenFarFromPointer = true\n hideWhenFarFromPointerDistance = 100\n snapToData = true\n getCircles = undefined\n}\n"],"names":[],"mappings":";;AA2CM,MAAO,eAAuB,SAAQ,iBAAwB,CAAA;AAApE,IAAA,WAAA,GAAA;;QACE,IAAQ,CAAA,QAAA,GAAG,SAAS,CAAA;QACpB,IAAQ,CAAA,QAAA,GAAG,IAAI,CAAA;QACf,IAAQ,CAAA,QAAA,GAAG,GAAG,CAAA;QACd,IAAO,CAAA,OAAA,GAAY,SAAS,CAAA;AAC5B,QAAA,IAAA,CAAA,QAAQ,GAA8D,CAAC,CAAQ,KAAa,EAAE,CAAA;QAC9F,IAAsB,CAAA,sBAAA,GAAG,IAAI,CAAA;QAC7B,IAA8B,CAAA,8BAAA,GAAG,GAAG,CAAA;QACpC,IAAU,CAAA,UAAA,GAAG,IAAI,CAAA;QACjB,IAAU,CAAA,UAAA,GAAG,SAAS,CAAA;KACvB;AAAA;;;;"}
@@ -5,7 +5,7 @@ import { group } from 'd3-array';
5
5
  import { ComponentCore } from '../../core/component/index.js';
6
6
  import { SeriesDataModel } from '../../data-models/series.js';
7
7
  import { VerticalAlign } from '../../types/text.js';
8
- import { getHexValue, getColor } from '../../utils/color.js';
8
+ import { getColor } from '../../utils/color.js';
9
9
  import { smartTransition } from '../../utils/d3.js';
10
10
  import { isNumber, getString, getNumber, isNumberWithinRange, merge, getValue } from '../../utils/data.js';
11
11
  import { getPixelValue } from '../../utils/misc.js';
@@ -145,26 +145,28 @@ class NestedDonut extends ComponentCore {
145
145
  })
146
146
  .eachAfter(node => { var _a; return (_a = node.children) === null || _a === void 0 ? void 0 : _a.forEach(ch => node.data.values.push(...ch.data.values)); })
147
147
  .eachBefore(node => {
148
- var _a, _b, _c;
148
+ var _a, _b, _c, _d;
149
149
  if (!node.children || node.depth === rootNode.height - 1)
150
150
  return;
151
- const colors = this.colorScale
152
- .domain([-1, node.children.length])
153
- .range([getHexValue((_a = node._state) === null || _a === void 0 ? void 0 : _a.fill, this.element), '#fff']);
154
151
  const positions = pie()
155
- .startAngle(node.parent ? node.x0 : (_b = config.angleRange) === null || _b === void 0 ? void 0 : _b[0])
156
- .endAngle(node.parent ? node.x1 : (_c = config.angleRange) === null || _c === void 0 ? void 0 : _c[1])
152
+ .startAngle(node.parent ? node.x0 : (_a = config.angleRange) === null || _a === void 0 ? void 0 : _a[0])
153
+ .endAngle(node.parent ? node.x1 : (_b = config.angleRange) === null || _b === void 0 ? void 0 : _b[1])
157
154
  .value(d => config.showEmptySegments && d.value === 0
158
155
  ? config.emptySegmentAngle
159
156
  : (d.x1 - d.x0))
160
157
  .sort(config.sort)(node.children);
158
+ const opacity = scaleLinear()
159
+ .domain([-1, node.children.length])
160
+ .range([(_d = (_c = node._state) === null || _c === void 0 ? void 0 : _c.fillOpacity) !== null && _d !== void 0 ? _d : 1, 0]);
161
161
  node.children.forEach((child, i) => {
162
- var _a;
163
162
  child._index = i;
164
163
  child.x0 = positions[i].startAngle;
165
164
  child.x1 = positions[i].endAngle;
165
+ // Default to parent's fill if segmentColor accessor is not provided
166
+ const color = getColor(child, config.segmentColor, positions[i].index, child.depth !== 1);
166
167
  child._state = {
167
- fill: (_a = getColor(child, config.segmentColor, positions[i].index, child.depth !== 1)) !== null && _a !== void 0 ? _a : colors(positions[i].index),
168
+ fill: color !== null && color !== void 0 ? color : node._state.fill,
169
+ fillOpacity: color === null ? opacity(positions[i].index) : null,
168
170
  };
169
171
  });
170
172
  });
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../../src/components/nested-donut/index.ts"],"sourcesContent":["import { Selection } from 'd3-selection'\nimport { arc, pie } from 'd3-shape'\nimport { hierarchy, partition } from 'd3-hierarchy'\nimport { scaleLinear, ScaleLinear } from 'd3-scale'\nimport { group } from 'd3-array'\n\n// Core\nimport { ComponentCore } from 'core/component'\nimport { SeriesDataModel } from 'data-models/series'\n\n// Types\nimport { VerticalAlign } from 'types/text'\n\n// Utils\nimport { getColor, getHexValue } from 'utils/color'\nimport { smartTransition } from 'utils/d3'\nimport { getNumber, getString, getValue, isNumber, isNumberWithinRange, merge } from 'utils/data'\nimport { getPixelValue } from 'utils/misc'\nimport { cssvar } from 'utils/style'\nimport { wrapSVGText } from 'utils/text'\n\n// Local Types\nimport { NestedDonutDirection, NestedDonutSegment, NestedDonutLayer, NestedDonutSegmentLabelAlignment } from './types'\n\n// Config\nimport { NestedDonutConfig, NestedDonutConfigInterface } from './config'\n\n// Modules\nimport { createArc, updateArc, removeArc } from './modules/arc'\nimport { createLabel, updateLabel, removeLabel } from './modules/label'\n\n// Styles\nimport * as s from './style'\n\nexport class NestedDonut<Datum> extends ComponentCore<\nDatum[],\nNestedDonutConfig<Datum>,\nNestedDonutConfigInterface<Datum>\n> {\n static selectors = s\n static cssVariables = s.variables\n config: NestedDonutConfig<Datum> = new NestedDonutConfig()\n datamodel: SeriesDataModel<Datum> = new SeriesDataModel()\n\n arcBackground: Selection<SVGGElement, unknown, SVGGElement, unknown>\n arcGroup: Selection<SVGGElement, unknown, SVGGElement, unknown>\n centralLabel: Selection<SVGTextElement, unknown, SVGGElement, unknown>\n centralSubLabel: Selection<SVGTextElement, unknown, SVGGElement, unknown>\n\n arcGen = arc<Partial<NestedDonutSegment<Datum>>>()\n colorScale: ScaleLinear<string, string> = scaleLinear()\n\n events = { }\n\n constructor (config?: NestedDonutConfigInterface<Datum>) {\n super()\n if (config) this.config.init(config)\n this.arcBackground = this.g.append('g')\n this.arcGroup = this.g.append('g')\n .attr('class', s.segmentsGroup)\n this.centralLabel = this.g.append('text')\n .attr('class', s.centralLabel)\n this.centralSubLabel = this.g.append('text')\n .attr('class', s.centralSubLabel)\n }\n\n _render (customDuration?: number): void {\n const { config } = this\n const duration = isNumber(customDuration) ? customDuration : config.duration\n\n const layers = this._getLayerSettings()\n const data = this._getHierarchyData(layers)\n\n this.arcGen\n .startAngle(d => d.x0)\n .endAngle(d => d.x1)\n .innerRadius(d => d.y0)\n .outerRadius(d => d.y1)\n .cornerRadius(config.cornerRadius)\n\n this.arcGroup.attr('transform', `translate(${this._width / 2},${this._height / 2})`)\n this.arcBackground.attr('transform', `translate(${this._width / 2},${this._height / 2})`)\n this.centralLabel.attr('transform', `translate(${this._width / 2},${this._height / 2})`)\n this.centralSubLabel.attr('transform', `translate(${this._width / 2},${this._height / 2})`)\n\n // Layer backgrounds\n const backgrounds = this.arcBackground\n .selectAll<SVGPathElement, NestedDonutLayer>(`.${s.background}`)\n .data(layers, d => d._id)\n\n const backgroundsEnter = backgrounds.enter().append('path')\n .attr('class', s.background)\n .attr('visibility', config.showBackground ? null : 'hidden')\n\n const backgroundsMerged = backgrounds.merge(backgroundsEnter)\n .style('transition', `fill ${duration}ms`)\n .style('fill', d => d.backgroundColor)\n\n smartTransition(backgroundsMerged, duration)\n .attr('d', d => this.arcGen({\n x0: config.angleRange?.[0] ?? 0,\n x1: config.angleRange?.[1] ?? 2 * Math.PI,\n y0: d._innerRadius,\n y1: d._outerRadius,\n }))\n\n smartTransition(backgrounds.exit(), duration)\n .style('opacity', 0)\n .remove()\n\n // Segments\n const segments = this.arcGroup.selectAll<SVGGElement, NestedDonutSegment<Datum>>(`${s.segment}`)\n .data(data, d => d._id)\n\n const segmentsEnter = segments.enter()\n .append('g')\n .attr('class', s.segment)\n\n segments.merge(segmentsEnter)\n smartTransition(segments.exit(), duration)\n .attr('class', s.segmentExit)\n .style('opacity', 0)\n .remove()\n\n // Segment arcs\n const arcs = this.arcGroup\n .selectAll<SVGPathElement, NestedDonutSegment<Datum>>(`.${s.segmentArc}`)\n .data(data, d => d._id)\n\n const arcsEnter = segmentsEnter.append('path')\n .attr('class', s.segmentArc)\n .call(createArc, config)\n\n arcs.merge(arcsEnter)\n .call(updateArc, config, this.arcGen, duration)\n\n arcs.exit<NestedDonutSegment<Datum>>()\n .attr('class', s.segmentExit)\n .call(removeArc, duration)\n\n // Segment labels\n const labels = this.arcGroup\n .selectAll<SVGTextElement, NestedDonutSegment<Datum>>(`.${s.segmentLabel}`)\n .data(data, d => d._id)\n\n const labelsEnter = segmentsEnter.append('text')\n .attr('class', s.segmentLabel)\n .call(createLabel, this.arcGen)\n\n labels.merge(labelsEnter)\n .call(updateLabel, config, this.arcGen, duration)\n\n labels.exit<NestedDonutSegment<Datum>>()\n .call(removeLabel, duration)\n\n // Chart labels\n this.centralLabel\n .attr('dy', config.centralSubLabel ? '-0.55em' : null)\n .text(config.centralLabel ?? null)\n\n this.centralSubLabel\n .attr('dy', config.centralLabel ? '0.55em' : null)\n .text(config.centralSubLabel ?? null)\n\n if (config.centralSubLabelWrap) wrapSVGText(this.centralSubLabel, layers[0]._innerRadius * 1.9, VerticalAlign.Top)\n }\n\n private _getHierarchyData (layers: NestedDonutLayer[]): NestedDonutSegment<Datum>[] {\n const { config, datamodel: { data } } = this\n\n const layerAccessors = config.layers?.map(layerAccessor => (i: number) => getString(data[i], layerAccessor, i))\n const nestedData = group(data.keys(), ...layerAccessors as [(i: number) => string])\n\n const rootNode = config.value !== undefined\n ? hierarchy(nestedData).sum(index => typeof index === 'number' && getNumber(data[index], config.value, index))\n : hierarchy(nestedData).count()\n\n const partitionData = partition().size([config.angleRange[1], 1])(rootNode) as NestedDonutSegment<Datum>\n\n partitionData\n .each(node => {\n node.data = {\n key: node.data[0] as string,\n values: (node.data[1])?.length ? node.data[1].map((index: number) => data[index]) : [],\n root: node.parent?.data.root ?? node.data[0],\n }\n node._id = `root${partitionData.path(node).map(d => d.data.key).join('->')}`\n if (isNumberWithinRange(node.depth - 1, [0, layers.length - 1])) {\n node._layer = layers[node.depth - 1]\n node.y0 = node._layer._innerRadius\n node.y1 = node._layer._outerRadius\n }\n })\n .eachAfter(node => node.children?.forEach(ch => node.data.values.push(...ch.data.values)))\n .eachBefore(node => {\n if (!node.children || node.depth === rootNode.height - 1) return\n\n const colors = this.colorScale\n .domain([-1, node.children.length])\n .range([getHexValue(node._state?.fill, this.element), '#fff'])\n\n const positions = pie<NestedDonutSegment<Datum>>()\n .startAngle(node.parent ? node.x0 : config.angleRange?.[0])\n .endAngle(node.parent ? node.x1 : config.angleRange?.[1])\n .value(d => config.showEmptySegments && d.value === 0\n ? config.emptySegmentAngle\n : (d.x1 - d.x0))\n .sort(config.sort)(node.children)\n\n node.children.forEach((child, i) => {\n child._index = i\n child.x0 = positions[i].startAngle\n child.x1 = positions[i].endAngle\n child._state = {\n fill:\n getColor(child, config.segmentColor, positions[i].index, child.depth !== 1) ??\n colors(positions[i].index),\n }\n })\n })\n\n const segments = partitionData.descendants().filter(d => d.parent?.value && d.data.key)\n return segments\n }\n\n private _getLayerSettings (): NestedDonutLayer[] {\n const { direction, layers, layerPadding, layerSettings } = this.config\n\n const outerRadius = Math.min(this._width, this._height) / 2\n\n const defaultLayerSettings = {\n backgroundColor: cssvar(s.variables.nestedDonutBackgroundColor),\n labelAlignment: NestedDonutSegmentLabelAlignment.Perpendicular,\n width: outerRadius * 0.75 / layers.length,\n }\n const layerItems = layers.reduceRight((arr, _, i) => {\n const layerId = direction === NestedDonutDirection.Outwards ? i : arr.length\n const layerConfig = merge(defaultLayerSettings, getValue(layerId, layerSettings))\n const radius = arr.length ? arr[0]._innerRadius - layerPadding : outerRadius\n const layerWidth = getPixelValue(layerConfig.width)\n if (layerWidth === null) {\n console.warn(`Unovis | Nested Donut: Could not parse width ${layerConfig.width}. Setting to default.`)\n }\n arr.unshift({\n ...layerConfig,\n _id: layerId,\n _outerRadius: radius,\n _innerRadius: radius - (layerWidth ?? defaultLayerSettings.width),\n })\n return arr\n }, new Array<NestedDonutLayer>())\n\n return direction === NestedDonutDirection.Inwards ? layerItems.reverse() : layerItems\n }\n}\n"],"names":["s.segmentsGroup","s.centralLabel","s.centralSubLabel","s.background","s.segment","s.segmentExit","s.segmentArc","s.segmentLabel","s.variables","s"],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../../../src/components/nested-donut/index.ts"],"sourcesContent":["import { Selection } from 'd3-selection'\nimport { arc, pie } from 'd3-shape'\nimport { hierarchy, partition } from 'd3-hierarchy'\nimport { scaleLinear, ScaleLinear } from 'd3-scale'\nimport { group } from 'd3-array'\n\n// Core\nimport { ComponentCore } from 'core/component'\nimport { SeriesDataModel } from 'data-models/series'\n\n// Types\nimport { VerticalAlign } from 'types/text'\n\n// Utils\nimport { getColor } from 'utils/color'\nimport { smartTransition } from 'utils/d3'\nimport { getNumber, getString, getValue, isNumber, isNumberWithinRange, merge } from 'utils/data'\nimport { getPixelValue } from 'utils/misc'\nimport { cssvar } from 'utils/style'\nimport { wrapSVGText } from 'utils/text'\n\n// Local Types\nimport { NestedDonutDirection, NestedDonutSegment, NestedDonutLayer, NestedDonutSegmentLabelAlignment } from './types'\n\n// Config\nimport { NestedDonutConfig, NestedDonutConfigInterface } from './config'\n\n// Modules\nimport { createArc, updateArc, removeArc } from './modules/arc'\nimport { createLabel, updateLabel, removeLabel } from './modules/label'\n\n// Styles\nimport * as s from './style'\n\nexport class NestedDonut<Datum> extends ComponentCore<\nDatum[],\nNestedDonutConfig<Datum>,\nNestedDonutConfigInterface<Datum>\n> {\n static selectors = s\n static cssVariables = s.variables\n config: NestedDonutConfig<Datum> = new NestedDonutConfig()\n datamodel: SeriesDataModel<Datum> = new SeriesDataModel()\n\n arcBackground: Selection<SVGGElement, unknown, SVGGElement, unknown>\n arcGroup: Selection<SVGGElement, unknown, SVGGElement, unknown>\n centralLabel: Selection<SVGTextElement, unknown, SVGGElement, unknown>\n centralSubLabel: Selection<SVGTextElement, unknown, SVGGElement, unknown>\n\n arcGen = arc<Partial<NestedDonutSegment<Datum>>>()\n colorScale: ScaleLinear<string, string> = scaleLinear()\n\n events = { }\n\n constructor (config?: NestedDonutConfigInterface<Datum>) {\n super()\n if (config) this.config.init(config)\n this.arcBackground = this.g.append('g')\n this.arcGroup = this.g.append('g')\n .attr('class', s.segmentsGroup)\n this.centralLabel = this.g.append('text')\n .attr('class', s.centralLabel)\n this.centralSubLabel = this.g.append('text')\n .attr('class', s.centralSubLabel)\n }\n\n _render (customDuration?: number): void {\n const { config } = this\n const duration = isNumber(customDuration) ? customDuration : config.duration\n\n const layers = this._getLayerSettings()\n const data = this._getHierarchyData(layers)\n\n this.arcGen\n .startAngle(d => d.x0)\n .endAngle(d => d.x1)\n .innerRadius(d => d.y0)\n .outerRadius(d => d.y1)\n .cornerRadius(config.cornerRadius)\n\n this.arcGroup.attr('transform', `translate(${this._width / 2},${this._height / 2})`)\n this.arcBackground.attr('transform', `translate(${this._width / 2},${this._height / 2})`)\n this.centralLabel.attr('transform', `translate(${this._width / 2},${this._height / 2})`)\n this.centralSubLabel.attr('transform', `translate(${this._width / 2},${this._height / 2})`)\n\n // Layer backgrounds\n const backgrounds = this.arcBackground\n .selectAll<SVGPathElement, NestedDonutLayer>(`.${s.background}`)\n .data(layers, d => d._id)\n\n const backgroundsEnter = backgrounds.enter().append('path')\n .attr('class', s.background)\n .attr('visibility', config.showBackground ? null : 'hidden')\n\n const backgroundsMerged = backgrounds.merge(backgroundsEnter)\n .style('transition', `fill ${duration}ms`)\n .style('fill', d => d.backgroundColor)\n\n smartTransition(backgroundsMerged, duration)\n .attr('d', d => this.arcGen({\n x0: config.angleRange?.[0] ?? 0,\n x1: config.angleRange?.[1] ?? 2 * Math.PI,\n y0: d._innerRadius,\n y1: d._outerRadius,\n }))\n\n smartTransition(backgrounds.exit(), duration)\n .style('opacity', 0)\n .remove()\n\n // Segments\n const segments = this.arcGroup.selectAll<SVGGElement, NestedDonutSegment<Datum>>(`${s.segment}`)\n .data(data, d => d._id)\n\n const segmentsEnter = segments.enter()\n .append('g')\n .attr('class', s.segment)\n\n segments.merge(segmentsEnter)\n smartTransition(segments.exit(), duration)\n .attr('class', s.segmentExit)\n .style('opacity', 0)\n .remove()\n\n // Segment arcs\n const arcs = this.arcGroup\n .selectAll<SVGPathElement, NestedDonutSegment<Datum>>(`.${s.segmentArc}`)\n .data(data, d => d._id)\n\n const arcsEnter = segmentsEnter.append('path')\n .attr('class', s.segmentArc)\n .call(createArc, config)\n\n arcs.merge(arcsEnter)\n .call(updateArc, config, this.arcGen, duration)\n\n arcs.exit<NestedDonutSegment<Datum>>()\n .attr('class', s.segmentExit)\n .call(removeArc, duration)\n\n // Segment labels\n const labels = this.arcGroup\n .selectAll<SVGTextElement, NestedDonutSegment<Datum>>(`.${s.segmentLabel}`)\n .data(data, d => d._id)\n\n const labelsEnter = segmentsEnter.append('text')\n .attr('class', s.segmentLabel)\n .call(createLabel, this.arcGen)\n\n labels.merge(labelsEnter)\n .call(updateLabel, config, this.arcGen, duration)\n\n labels.exit<NestedDonutSegment<Datum>>()\n .call(removeLabel, duration)\n\n // Chart labels\n this.centralLabel\n .attr('dy', config.centralSubLabel ? '-0.55em' : null)\n .text(config.centralLabel ?? null)\n\n this.centralSubLabel\n .attr('dy', config.centralLabel ? '0.55em' : null)\n .text(config.centralSubLabel ?? null)\n\n if (config.centralSubLabelWrap) wrapSVGText(this.centralSubLabel, layers[0]._innerRadius * 1.9, VerticalAlign.Top)\n }\n\n private _getHierarchyData (layers: NestedDonutLayer[]): NestedDonutSegment<Datum>[] {\n const { config, datamodel: { data } } = this\n\n const layerAccessors = config.layers?.map(layerAccessor => (i: number) => getString(data[i], layerAccessor, i))\n const nestedData = group(data.keys(), ...layerAccessors as [(i: number) => string])\n\n const rootNode = config.value !== undefined\n ? hierarchy(nestedData).sum(index => typeof index === 'number' && getNumber(data[index], config.value, index))\n : hierarchy(nestedData).count()\n\n const partitionData = partition().size([config.angleRange[1], 1])(rootNode) as NestedDonutSegment<Datum>\n\n partitionData\n .each(node => {\n node.data = {\n key: node.data[0] as string,\n values: (node.data[1])?.length ? node.data[1].map((index: number) => data[index]) : [],\n root: node.parent?.data.root ?? node.data[0],\n }\n node._id = `root${partitionData.path(node).map(d => d.data.key).join('->')}`\n if (isNumberWithinRange(node.depth - 1, [0, layers.length - 1])) {\n node._layer = layers[node.depth - 1]\n node.y0 = node._layer._innerRadius\n node.y1 = node._layer._outerRadius\n }\n })\n .eachAfter(node => node.children?.forEach(ch => node.data.values.push(...ch.data.values)))\n .eachBefore(node => {\n if (!node.children || node.depth === rootNode.height - 1) return\n\n const positions = pie<NestedDonutSegment<Datum>>()\n .startAngle(node.parent ? node.x0 : config.angleRange?.[0])\n .endAngle(node.parent ? node.x1 : config.angleRange?.[1])\n .value(d => config.showEmptySegments && d.value === 0\n ? config.emptySegmentAngle\n : (d.x1 - d.x0))\n .sort(config.sort)(node.children)\n\n const opacity = scaleLinear()\n .domain([-1, node.children.length])\n .range([node._state?.fillOpacity ?? 1, 0])\n\n node.children.forEach((child, i) => {\n child._index = i\n child.x0 = positions[i].startAngle\n child.x1 = positions[i].endAngle\n\n // Default to parent's fill if segmentColor accessor is not provided\n const color = getColor(child, config.segmentColor, positions[i].index, child.depth !== 1)\n child._state = {\n fill: color ?? node._state.fill,\n fillOpacity: color === null ? opacity(positions[i].index) : null,\n }\n })\n })\n\n const segments = partitionData.descendants().filter(d => d.parent?.value && d.data.key)\n return segments\n }\n\n private _getLayerSettings (): NestedDonutLayer[] {\n const { direction, layers, layerPadding, layerSettings } = this.config\n\n const outerRadius = Math.min(this._width, this._height) / 2\n\n const defaultLayerSettings = {\n backgroundColor: cssvar(s.variables.nestedDonutBackgroundColor),\n labelAlignment: NestedDonutSegmentLabelAlignment.Perpendicular,\n width: outerRadius * 0.75 / layers.length,\n }\n const layerItems = layers.reduceRight((arr, _, i) => {\n const layerId = direction === NestedDonutDirection.Outwards ? i : arr.length\n const layerConfig = merge(defaultLayerSettings, getValue(layerId, layerSettings))\n const radius = arr.length ? arr[0]._innerRadius - layerPadding : outerRadius\n const layerWidth = getPixelValue(layerConfig.width)\n if (layerWidth === null) {\n console.warn(`Unovis | Nested Donut: Could not parse width ${layerConfig.width}. Setting to default.`)\n }\n arr.unshift({\n ...layerConfig,\n _id: layerId,\n _outerRadius: radius,\n _innerRadius: radius - (layerWidth ?? defaultLayerSettings.width),\n })\n return arr\n }, new Array<NestedDonutLayer>())\n\n return direction === NestedDonutDirection.Inwards ? layerItems.reverse() : layerItems\n }\n}\n"],"names":["s.segmentsGroup","s.centralLabel","s.centralSubLabel","s.background","s.segment","s.segmentExit","s.segmentArc","s.segmentLabel","s.variables","s"],"mappings":"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"}
@@ -21,7 +21,8 @@ function createArc(selection, config) {
21
21
  function updateArc(selection, config, arcGen, duration) {
22
22
  selection
23
23
  .style('transition', `fill ${duration}ms`) // Animate color with CSS because we're using CSS-variables
24
- .style('fill', d => { var _a, _b; return (_a = getColor(d, config.segmentColor)) !== null && _a !== void 0 ? _a : (_b = d._state) === null || _b === void 0 ? void 0 : _b.fill; });
24
+ .style('fill', d => d._state.fill)
25
+ .style('fill-opacity', d => d._state.fillOpacity);
25
26
  if (duration) {
26
27
  const transition = smartTransition(selection, duration)
27
28
  .style('opacity', 1);
@@ -1 +1 @@
1
- {"version":3,"file":"arc.js","sources":["../../../../src/components/nested-donut/modules/arc.ts"],"sourcesContent":["import { Selection } from 'd3-selection'\nimport { Transition } from 'd3-transition'\nimport { interpolate } from 'd3-interpolate'\nimport { Arc } from 'd3-shape'\n\n// Utils\nimport { getColor } from 'utils/color'\nimport { smartTransition } from 'utils/d3'\n\n// Local Types\nimport { NestedDonutSegment } from '../types'\n\n// Config\nimport { NestedDonutConfig } from '../config'\n\ntype AnimState = { x0: number; x1: number; y0: number; y1: number }\nexport interface ArcNode extends SVGElement {\n _animState?: AnimState;\n}\n\nexport function createArc<Datum> (\n selection: Selection<SVGPathElement, NestedDonutSegment<Datum>, SVGGElement, unknown>,\n config: NestedDonutConfig<Datum>\n): void {\n selection\n .style('fill', d => getColor(d, config.segmentColor) ?? d._state?.fill)\n .style('opacity', 0)\n .each((d, i, els) => {\n const arcNode: ArcNode = els[i]\n const angleCenter = (d.x0 + d.x1) / 2\n const angleHalfWidth = (d.x1 - d.x0) / 2\n arcNode._animState = {\n x0: angleCenter - angleHalfWidth,\n x1: angleCenter + angleHalfWidth,\n y0: d.y0,\n y1: d.y1,\n }\n })\n}\n\nexport function updateArc<Datum> (\n selection: Selection<SVGPathElement, NestedDonutSegment<Datum>, SVGGElement, unknown>,\n config: NestedDonutConfig<Datum>,\n arcGen: Arc<any, AnimState>,\n duration: number\n): void {\n selection\n .style('transition', `fill ${duration}ms`) // Animate color with CSS because we're using CSS-variables\n .style('fill', d => getColor(d, config.segmentColor) ?? d._state?.fill)\n\n if (duration) {\n const transition = smartTransition(selection, duration)\n .style('opacity', 1) as Transition<SVGPathElement, NestedDonutSegment<Datum>, SVGGElement, ArcNode>\n\n transition.attrTween('d', (d, i, els) => {\n const arcNode: ArcNode = els[i]\n const nextAnimState = { x0: d.x0, x1: d.x1, y0: d.y0, y1: d.y1 }\n const datum = interpolate(arcNode._animState, nextAnimState)\n return (t: number): string => {\n arcNode._animState = datum(t)\n return arcGen(arcNode._animState)\n }\n })\n } else {\n selection.attr('d', arcGen)\n .style('opacity', 1)\n }\n}\n\nexport function removeArc<Datum> (\n selection: Selection<SVGPathElement, NestedDonutSegment<Datum>, SVGGElement, unknown>,\n duration: number\n): void {\n smartTransition(selection, duration)\n .style('opacity', 0)\n .remove()\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"arc.js","sources":["../../../../src/components/nested-donut/modules/arc.ts"],"sourcesContent":["import { Selection } from 'd3-selection'\nimport { Transition } from 'd3-transition'\nimport { interpolate } from 'd3-interpolate'\nimport { Arc } from 'd3-shape'\n\n// Utils\nimport { getColor } from 'utils/color'\nimport { smartTransition } from 'utils/d3'\n\n// Local Types\nimport { NestedDonutSegment } from '../types'\n\n// Config\nimport { NestedDonutConfig } from '../config'\n\ntype AnimState = { x0: number; x1: number; y0: number; y1: number }\nexport interface ArcNode extends SVGElement {\n _animState?: AnimState;\n}\n\nexport function createArc<Datum> (\n selection: Selection<SVGPathElement, NestedDonutSegment<Datum>, SVGGElement, unknown>,\n config: NestedDonutConfig<Datum>\n): void {\n selection\n .style('fill', d => getColor(d, config.segmentColor) ?? d._state?.fill)\n .style('opacity', 0)\n .each((d, i, els) => {\n const arcNode: ArcNode = els[i]\n const angleCenter = (d.x0 + d.x1) / 2\n const angleHalfWidth = (d.x1 - d.x0) / 2\n arcNode._animState = {\n x0: angleCenter - angleHalfWidth,\n x1: angleCenter + angleHalfWidth,\n y0: d.y0,\n y1: d.y1,\n }\n })\n}\n\nexport function updateArc<Datum> (\n selection: Selection<SVGPathElement, NestedDonutSegment<Datum>, SVGGElement, unknown>,\n config: NestedDonutConfig<Datum>,\n arcGen: Arc<any, AnimState>,\n duration: number\n): void {\n selection\n .style('transition', `fill ${duration}ms`) // Animate color with CSS because we're using CSS-variables\n .style('fill', d => d._state.fill)\n .style('fill-opacity', d => d._state.fillOpacity)\n\n if (duration) {\n const transition = smartTransition(selection, duration)\n .style('opacity', 1) as Transition<SVGPathElement, NestedDonutSegment<Datum>, SVGGElement, ArcNode>\n\n transition.attrTween('d', (d, i, els) => {\n const arcNode: ArcNode = els[i]\n const nextAnimState = { x0: d.x0, x1: d.x1, y0: d.y0, y1: d.y1 }\n const datum = interpolate(arcNode._animState, nextAnimState)\n return (t: number): string => {\n arcNode._animState = datum(t)\n return arcGen(arcNode._animState)\n }\n })\n } else {\n selection.attr('d', arcGen)\n .style('opacity', 1)\n }\n}\n\nexport function removeArc<Datum> (\n selection: Selection<SVGPathElement, NestedDonutSegment<Datum>, SVGGElement, unknown>,\n duration: number\n): void {\n smartTransition(selection, duration)\n .style('opacity', 0)\n .remove()\n}\n"],"names":[],"mappings":"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"}
@@ -1,6 +1,6 @@
1
1
  import { select } from 'd3-selection';
2
2
  import { color } from 'd3-color';
3
- import { getColor, hexToBrightness } from '../../../utils/color.js';
3
+ import { getHexValue, rgbaToRgb, rgbToBrightness, getColor } from '../../../utils/color.js';
4
4
  import { smartTransition } from '../../../utils/d3.js';
5
5
  import { getString } from '../../../utils/data.js';
6
6
  import { getCSSVariableValueInPixels } from '../../../utils/misc.js';
@@ -9,11 +9,14 @@ import { wrapSVGText } from '../../../utils/text.js';
9
9
  import { NestedDonutSegmentLabelAlignment } from '../types.js';
10
10
  import { variables } from '../style.js';
11
11
 
12
- function getLabelFillColor(d, config) {
12
+ function getLabelFillColor(d, element) {
13
13
  var _a;
14
- const c = (_a = getColor(d, config.segmentColor)) !== null && _a !== void 0 ? _a : d._state.fill;
15
- const colorParsed = color(c);
16
- const brightness = colorParsed ? hexToBrightness(colorParsed.hex()) : 0;
14
+ const c = (_a = color(d._state.fill)) !== null && _a !== void 0 ? _a : color(getHexValue(d._state.fill, element));
15
+ const rgb = c === null || c === void 0 ? void 0 : c.rgb();
16
+ // If shading, we adjust segment color before calculating brightness ratio
17
+ const colorParsed = rgb && d._state.fillOpacity
18
+ ? rgbaToRgb(`rgba(${rgb.r},${rgb.g},${rgb.b},${d._state.fillOpacity})`, getHexValue(cssvar(variables.nestedDonutBackgroundColor), element)) : rgb;
19
+ const brightness = colorParsed ? rgbToBrightness(colorParsed) : 0;
17
20
  return cssvar(brightness > 0.65 ? variables.nestedDonutSegmentLabelTextColorLight : variables.nestedDonutSegmentLabelTextColorDark);
18
21
  }
19
22
  function getLabelTransform(d, arcGen) {
@@ -51,7 +54,7 @@ function updateLabel(selection, config, arcGen, duration) {
51
54
  selection
52
55
  .text(d => { var _a; return (_a = getString(d, config.segmentLabel)) !== null && _a !== void 0 ? _a : d.data.key; })
53
56
  .style('transition', `fill ${duration}ms`)
54
- .style('fill', d => { var _a; return (_a = getColor(d, config.segmentLabelColor)) !== null && _a !== void 0 ? _a : getLabelFillColor(d, config); })
57
+ .style('fill', (d, i, els) => { var _a; return (_a = getColor(d, config.segmentLabelColor)) !== null && _a !== void 0 ? _a : getLabelFillColor(d, els[i]); })
55
58
  .each((d, i, els) => {
56
59
  const bounds = getLabelBounds(d);
57
60
  const label = select(els[i]).call(wrapSVGText, bounds.width);
@@ -1 +1 @@
1
- {"version":3,"file":"label.js","sources":["../../../../src/components/nested-donut/modules/label.ts"],"sourcesContent":["import { Selection, select } from 'd3-selection'\nimport { color } from 'd3-color'\nimport { Arc } from 'd3-shape'\n\n// Utils\nimport { getColor, hexToBrightness } from 'utils/color'\nimport { smartTransition } from 'utils/d3'\nimport { getString } from 'utils/data'\nimport { getCSSVariableValueInPixels } from 'utils/misc'\nimport { cssvar } from 'utils/style'\nimport { wrapSVGText } from 'utils/text'\n\n// Config\nimport { NestedDonutConfig } from '../config'\n\n// Local Types\nimport { NestedDonutSegment, NestedDonutSegmentLabelAlignment } from '../types'\n\n// Styles\nimport { variables } from '../style'\n\nfunction getLabelFillColor<Datum> (\n d: NestedDonutSegment<Datum>,\n config: NestedDonutConfig<Datum>\n): string {\n const c = getColor(d, config.segmentColor) ?? d._state.fill\n const colorParsed = color(c)\n const brightness = colorParsed ? hexToBrightness(colorParsed.hex()) : 0\n return cssvar(brightness > 0.65 ? variables.nestedDonutSegmentLabelTextColorLight : variables.nestedDonutSegmentLabelTextColorDark)\n}\n\nfunction getLabelTransform<Datum> (\n d: NestedDonutSegment<Datum>,\n arcGen: Arc<unknown, NestedDonutSegment<Datum>>\n): string {\n const translate = `translate(${arcGen.centroid(d)})`\n const degree = 180 / Math.PI * (arcGen.startAngle()(d) + arcGen.endAngle()(d)) / 2 - 90\n switch (d._layer.labelAlignment) {\n case NestedDonutSegmentLabelAlignment.Along:\n return `${translate} rotate(${degree + 90})`\n case NestedDonutSegmentLabelAlignment.Perpendicular:\n return `${translate} rotate(${degree > 90 ? degree - 180 : degree})`\n default:\n return `${translate}`\n }\n}\n\nfunction getLabelBounds<Datum> (\n d: NestedDonutSegment<Datum>\n): { width: number; height: number } {\n const arcWidth = d.y1 - d.y0\n const arcLength = d._layer._innerRadius * (d.x1 - d.x0)\n const bandwidth = Math.max(Math.abs(Math.cos(d.x0 + (d.x1 - d.x0) / 2 - Math.PI / 2) * arcWidth), arcWidth)\n switch (d._layer.labelAlignment) {\n case NestedDonutSegmentLabelAlignment.Perpendicular:\n return { width: arcWidth, height: arcLength }\n case NestedDonutSegmentLabelAlignment.Along:\n return { width: arcLength, height: arcWidth }\n case NestedDonutSegmentLabelAlignment.Straight:\n return { width: bandwidth, height: bandwidth }\n }\n}\n\nexport function createLabel<Datum> (\n selection: Selection<SVGTextElement, NestedDonutSegment<Datum>, SVGGElement, unknown>,\n arcGen: Arc<unknown, NestedDonutSegment<Datum>>\n): void {\n selection\n .attr('transform', d => getLabelTransform(d, arcGen))\n .style('visibility', null)\n .style('opacity', 0)\n}\n\n\nexport function updateLabel<Datum> (\n selection: Selection<SVGTextElement, NestedDonutSegment<Datum>, SVGGElement, unknown>,\n config: NestedDonutConfig<Datum>,\n arcGen: Arc<unknown, NestedDonutSegment<Datum>>,\n duration: number\n): void {\n selection\n .text(d => getString(d, config.segmentLabel) ?? d.data.key)\n .style('transition', `fill ${duration}ms`)\n .style('fill', d => getColor(d, config.segmentLabelColor) ?? getLabelFillColor(d, config))\n .each((d, i, els) => {\n const bounds = getLabelBounds(d)\n const label = select(els[i]).call(wrapSVGText, bounds.width)\n\n const { width, height } = label.node().getBBox()\n\n if (config.hideOverflowingSegmentLabels && (width > bounds.width || height > bounds.height) && 'hidden') {\n label.attr('visibility', 'hidden')\n } else {\n const fontSize = getCSSVariableValueInPixels(cssvar(variables.nestedDonutSegmentLabelFontSize), els[i])\n const len = label.selectChildren().size() - 1\n label.attr('dy', -fontSize / 2 * len)\n }\n })\n\n smartTransition(selection, duration)\n .attr('transform', d => getLabelTransform(d, arcGen))\n .style('opacity', 1)\n}\n\nexport function removeLabel<Datum> (\n selection: Selection<SVGTextElement, NestedDonutSegment<Datum>, SVGGElement, unknown>,\n duration: number\n): void {\n smartTransition(selection, duration)\n .style('opacity', 0)\n .remove()\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"label.js","sources":["../../../../src/components/nested-donut/modules/label.ts"],"sourcesContent":["import { Selection, select } from 'd3-selection'\nimport { color } from 'd3-color'\nimport { Arc } from 'd3-shape'\n\n// Utils\nimport { getColor, getHexValue, rgbaToRgb, rgbToBrightness } from 'utils/color'\nimport { smartTransition } from 'utils/d3'\nimport { getString } from 'utils/data'\nimport { getCSSVariableValueInPixels } from 'utils/misc'\nimport { cssvar } from 'utils/style'\nimport { wrapSVGText } from 'utils/text'\n\n// Config\nimport { NestedDonutConfig } from '../config'\n\n// Local Types\nimport { NestedDonutSegment, NestedDonutSegmentLabelAlignment } from '../types'\n\n// Styles\nimport { variables } from '../style'\n\nfunction getLabelFillColor<Datum> (\n d: NestedDonutSegment<Datum>,\n element: SVGElement\n): string {\n const c = color(d._state.fill) ?? color(getHexValue(d._state.fill, element))\n const rgb = c?.rgb()\n\n // If shading, we adjust segment color before calculating brightness ratio\n const colorParsed = rgb && d._state.fillOpacity\n ? rgbaToRgb(\n `rgba(${rgb.r},${rgb.g},${rgb.b},${d._state.fillOpacity})`,\n getHexValue(cssvar(variables.nestedDonutBackgroundColor), element)\n ) : rgb\n\n const brightness = colorParsed ? rgbToBrightness(colorParsed) : 0\n return cssvar(brightness > 0.65 ? variables.nestedDonutSegmentLabelTextColorLight : variables.nestedDonutSegmentLabelTextColorDark)\n}\n\nfunction getLabelTransform<Datum> (\n d: NestedDonutSegment<Datum>,\n arcGen: Arc<unknown, NestedDonutSegment<Datum>>\n): string {\n const translate = `translate(${arcGen.centroid(d)})`\n const degree = 180 / Math.PI * (arcGen.startAngle()(d) + arcGen.endAngle()(d)) / 2 - 90\n switch (d._layer.labelAlignment) {\n case NestedDonutSegmentLabelAlignment.Along:\n return `${translate} rotate(${degree + 90})`\n case NestedDonutSegmentLabelAlignment.Perpendicular:\n return `${translate} rotate(${degree > 90 ? degree - 180 : degree})`\n default:\n return `${translate}`\n }\n}\n\nfunction getLabelBounds<Datum> (\n d: NestedDonutSegment<Datum>\n): { width: number; height: number } {\n const arcWidth = d.y1 - d.y0\n const arcLength = d._layer._innerRadius * (d.x1 - d.x0)\n const bandwidth = Math.max(Math.abs(Math.cos(d.x0 + (d.x1 - d.x0) / 2 - Math.PI / 2) * arcWidth), arcWidth)\n switch (d._layer.labelAlignment) {\n case NestedDonutSegmentLabelAlignment.Perpendicular:\n return { width: arcWidth, height: arcLength }\n case NestedDonutSegmentLabelAlignment.Along:\n return { width: arcLength, height: arcWidth }\n case NestedDonutSegmentLabelAlignment.Straight:\n return { width: bandwidth, height: bandwidth }\n }\n}\n\nexport function createLabel<Datum> (\n selection: Selection<SVGTextElement, NestedDonutSegment<Datum>, SVGGElement, unknown>,\n arcGen: Arc<unknown, NestedDonutSegment<Datum>>\n): void {\n selection\n .attr('transform', d => getLabelTransform(d, arcGen))\n .style('visibility', null)\n .style('opacity', 0)\n}\n\n\nexport function updateLabel<Datum> (\n selection: Selection<SVGTextElement, NestedDonutSegment<Datum>, SVGGElement, unknown>,\n config: NestedDonutConfig<Datum>,\n arcGen: Arc<unknown, NestedDonutSegment<Datum>>,\n duration: number\n): void {\n selection\n .text(d => getString(d, config.segmentLabel) ?? d.data.key)\n .style('transition', `fill ${duration}ms`)\n .style('fill', (d, i, els) => getColor(d, config.segmentLabelColor) ?? getLabelFillColor(d, els[i]))\n .each((d, i, els) => {\n const bounds = getLabelBounds(d)\n const label = select(els[i]).call(wrapSVGText, bounds.width)\n\n const { width, height } = label.node().getBBox()\n\n if (config.hideOverflowingSegmentLabels && (width > bounds.width || height > bounds.height) && 'hidden') {\n label.attr('visibility', 'hidden')\n } else {\n const fontSize = getCSSVariableValueInPixels(cssvar(variables.nestedDonutSegmentLabelFontSize), els[i])\n const len = label.selectChildren().size() - 1\n label.attr('dy', -fontSize / 2 * len)\n }\n })\n\n smartTransition(selection, duration)\n .attr('transform', d => getLabelTransform(d, arcGen))\n .style('opacity', 1)\n}\n\nexport function removeLabel<Datum> (\n selection: Selection<SVGTextElement, NestedDonutSegment<Datum>, SVGGElement, unknown>,\n duration: number\n): void {\n smartTransition(selection, duration)\n .style('opacity', 0)\n .remove()\n}\n"],"names":[],"mappings":";;;;;;;;;;;AAqBA,SAAS,iBAAiB,CACxB,CAA4B,EAC5B,OAAmB,EAAA;;IAEnB,MAAM,CAAC,GAAG,CAAA,EAAA,GAAA,KAAK,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAI,KAAK,CAAC,WAAW,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC,CAAA;IAC5E,MAAM,GAAG,GAAG,CAAC,KAAD,IAAA,IAAA,CAAC,uBAAD,CAAC,CAAE,GAAG,EAAE,CAAA;;IAGpB,MAAM,WAAW,GAAG,GAAG,IAAI,CAAC,CAAC,MAAM,CAAC,WAAW;AAC7C,UAAE,SAAS,CACT,CAAQ,KAAA,EAAA,GAAG,CAAC,CAAC,CAAA,CAAA,EAAI,GAAG,CAAC,CAAC,CAAI,CAAA,EAAA,GAAG,CAAC,CAAC,CAAA,CAAA,EAAI,CAAC,CAAC,MAAM,CAAC,WAAW,GAAG,EAC1D,WAAW,CAAC,MAAM,CAAC,SAAS,CAAC,0BAA0B,CAAC,EAAE,OAAO,CAAC,CACnE,GAAG,GAAG,CAAA;AAET,IAAA,MAAM,UAAU,GAAG,WAAW,GAAG,eAAe,CAAC,WAAW,CAAC,GAAG,CAAC,CAAA;AACjE,IAAA,OAAO,MAAM,CAAC,UAAU,GAAG,IAAI,GAAG,SAAS,CAAC,qCAAqC,GAAG,SAAS,CAAC,oCAAoC,CAAC,CAAA;AACrI,CAAC;AAED,SAAS,iBAAiB,CACxB,CAA4B,EAC5B,MAA+C,EAAA;IAE/C,MAAM,SAAS,GAAG,CAAA,UAAA,EAAa,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA,CAAA,CAAG,CAAA;AACpD,IAAA,MAAM,MAAM,GAAG,GAAG,GAAG,IAAI,CAAC,EAAE,IAAI,MAAM,CAAC,UAAU,EAAE,CAAC,CAAC,CAAC,GAAG,MAAM,CAAC,QAAQ,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,EAAE,CAAA;AACvF,IAAA,QAAQ,CAAC,CAAC,MAAM,CAAC,cAAc;QAC7B,KAAK,gCAAgC,CAAC,KAAK;AACzC,YAAA,OAAO,GAAG,SAAS,CAAA,QAAA,EAAW,MAAM,GAAG,EAAE,GAAG,CAAA;QAC9C,KAAK,gCAAgC,CAAC,aAAa;AACjD,YAAA,OAAO,GAAG,SAAS,CAAA,QAAA,EAAW,MAAM,GAAG,EAAE,GAAG,MAAM,GAAG,GAAG,GAAG,MAAM,GAAG,CAAA;AACtE,QAAA;YACE,OAAO,CAAA,EAAG,SAAS,CAAA,CAAE,CAAA;AACxB,KAAA;AACH,CAAC;AAED,SAAS,cAAc,CACrB,CAA4B,EAAA;IAE5B,MAAM,QAAQ,GAAG,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,EAAE,CAAA;AAC5B,IAAA,MAAM,SAAS,GAAG,CAAC,CAAC,MAAM,CAAC,YAAY,IAAI,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,EAAE,CAAC,CAAA;AACvD,IAAA,MAAM,SAAS,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,IAAI,CAAC,EAAE,GAAG,CAAC,CAAC,GAAG,QAAQ,CAAC,EAAE,QAAQ,CAAC,CAAA;AAC3G,IAAA,QAAQ,CAAC,CAAC,MAAM,CAAC,cAAc;QAC7B,KAAK,gCAAgC,CAAC,aAAa;YACjD,OAAO,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,EAAE,SAAS,EAAE,CAAA;QAC/C,KAAK,gCAAgC,CAAC,KAAK;YACzC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAA;QAC/C,KAAK,gCAAgC,CAAC,QAAQ;YAC5C,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,MAAM,EAAE,SAAS,EAAE,CAAA;AACjD,KAAA;AACH,CAAC;AAEe,SAAA,WAAW,CACzB,SAAqF,EACrF,MAA+C,EAAA;IAE/C,SAAS;AACN,SAAA,IAAI,CAAC,WAAW,EAAE,CAAC,IAAI,iBAAiB,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC;AACpD,SAAA,KAAK,CAAC,YAAY,EAAE,IAAI,CAAC;AACzB,SAAA,KAAK,CAAC,SAAS,EAAE,CAAC,CAAC,CAAA;AACxB,CAAC;AAGK,SAAU,WAAW,CACzB,SAAqF,EACrF,MAAgC,EAChC,MAA+C,EAC/C,QAAgB,EAAA;IAEhB,SAAS;SACN,IAAI,CAAC,CAAC,cAAI,OAAA,CAAA,EAAA,GAAA,SAAS,CAAC,CAAC,EAAE,MAAM,CAAC,YAAY,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAI,CAAC,CAAC,IAAI,CAAC,GAAG,CAAA,EAAA,CAAC;AAC1D,SAAA,KAAK,CAAC,YAAY,EAAE,CAAQ,KAAA,EAAA,QAAQ,IAAI,CAAC;AACzC,SAAA,KAAK,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,KAAI,EAAA,IAAA,EAAA,CAAA,CAAC,OAAA,CAAA,EAAA,GAAA,QAAQ,CAAC,CAAC,EAAE,MAAM,CAAC,iBAAiB,CAAC,MAAA,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,EAAA,GAAI,iBAAiB,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,CAAA,EAAA,CAAC;SACnG,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,GAAG,KAAI;AAClB,QAAA,MAAM,MAAM,GAAG,cAAc,CAAC,CAAC,CAAC,CAAA;AAChC,QAAA,MAAM,KAAK,GAAG,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,CAAC,KAAK,CAAC,CAAA;AAE5D,QAAA,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,IAAI,EAAE,CAAC,OAAO,EAAE,CAAA;AAEhD,QAAA,IAAI,MAAM,CAAC,4BAA4B,KAAK,KAAK,GAAG,MAAM,CAAC,KAAK,IAAI,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC,IAAI,QAAQ,EAAE;AACvG,YAAA,KAAK,CAAC,IAAI,CAAC,YAAY,EAAE,QAAQ,CAAC,CAAA;AACnC,SAAA;AAAM,aAAA;AACL,YAAA,MAAM,QAAQ,GAAG,2BAA2B,CAAC,MAAM,CAAC,SAAS,CAAC,+BAA+B,CAAC,EAAE,GAAG,CAAC,CAAC,CAAC,CAAC,CAAA;YACvG,MAAM,GAAG,GAAG,KAAK,CAAC,cAAc,EAAE,CAAC,IAAI,EAAE,GAAG,CAAC,CAAA;AAC7C,YAAA,KAAK,CAAC,IAAI,CAAC,IAAI,EAAE,CAAC,QAAQ,GAAG,CAAC,GAAG,GAAG,CAAC,CAAA;AACtC,SAAA;AACH,KAAC,CAAC,CAAA;AAEJ,IAAA,eAAe,CAAC,SAAS,EAAE,QAAQ,CAAC;AACjC,SAAA,IAAI,CAAC,WAAW,EAAE,CAAC,IAAI,iBAAiB,CAAC,CAAC,EAAE,MAAM,CAAC,CAAC;AACpD,SAAA,KAAK,CAAC,SAAS,EAAE,CAAC,CAAC,CAAA;AACxB,CAAC;AAEe,SAAA,WAAW,CACzB,SAAqF,EACrF,QAAgB,EAAA;AAEhB,IAAA,eAAe,CAAC,SAAS,EAAE,QAAQ,CAAC;AACjC,SAAA,KAAK,CAAC,SAAS,EAAE,CAAC,CAAC;AACnB,SAAA,MAAM,EAAE,CAAA;AACb;;;;"}
@@ -10,6 +10,7 @@ export declare type NestedDonutSegment<Datum> = HierarchyRectangularNode<NestedD
10
10
  _index?: number;
11
11
  _state?: {
12
12
  fill?: string;
13
+ fillOpacity?: number | null;
13
14
  };
14
15
  };
15
16
  export declare enum NestedDonutDirection {
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","sources":["../../../src/components/nested-donut/types.ts"],"sourcesContent":["import { HierarchyRectangularNode } from 'd3-hierarchy'\n\nexport type NestedDonutSegmentDatum<Datum> = {\n key: string;\n root: string;\n values: Datum[];\n}\n\nexport type NestedDonutSegment<Datum> = HierarchyRectangularNode<NestedDonutSegmentDatum<Datum>> & {\n _id: string;\n _layer: NestedDonutLayer;\n _index?: number;\n _state?: {\n fill?: string;\n };\n}\n\nexport enum NestedDonutDirection {\n Inwards = 'inwards',\n Outwards = 'outwards',\n}\n\nexport enum NestedDonutSegmentLabelAlignment {\n Along = 'along',\n Perpendicular = 'perpendicular',\n Straight = 'straight',\n}\n\nexport type NestedDonutLayerSettings = {\n backgroundColor?: string;\n labelAlignment?: NestedDonutSegmentLabelAlignment;\n width?: number | string;\n}\n\nexport type NestedDonutLayer = NestedDonutLayerSettings & {\n _id: number;\n _innerRadius: number;\n _outerRadius: number;\n}\n\n"],"names":[],"mappings":"IAiBY,qBAGX;AAHD,CAAA,UAAY,oBAAoB,EAAA;AAC9B,IAAA,oBAAA,CAAA,SAAA,CAAA,GAAA,SAAmB,CAAA;AACnB,IAAA,oBAAA,CAAA,UAAA,CAAA,GAAA,UAAqB,CAAA;AACvB,CAAC,EAHW,oBAAoB,KAApB,oBAAoB,GAG/B,EAAA,CAAA,CAAA,CAAA;IAEW,iCAIX;AAJD,CAAA,UAAY,gCAAgC,EAAA;AAC1C,IAAA,gCAAA,CAAA,OAAA,CAAA,GAAA,OAAe,CAAA;AACf,IAAA,gCAAA,CAAA,eAAA,CAAA,GAAA,eAA+B,CAAA;AAC/B,IAAA,gCAAA,CAAA,UAAA,CAAA,GAAA,UAAqB,CAAA;AACvB,CAAC,EAJW,gCAAgC,KAAhC,gCAAgC,GAI3C,EAAA,CAAA,CAAA;;;;"}
1
+ {"version":3,"file":"types.js","sources":["../../../src/components/nested-donut/types.ts"],"sourcesContent":["import { HierarchyRectangularNode } from 'd3-hierarchy'\n\nexport type NestedDonutSegmentDatum<Datum> = {\n key: string;\n root: string;\n values: Datum[];\n}\n\nexport type NestedDonutSegment<Datum> = HierarchyRectangularNode<NestedDonutSegmentDatum<Datum>> & {\n _id: string;\n _layer: NestedDonutLayer;\n _index?: number;\n _state?: {\n fill?: string;\n fillOpacity?: number | null;\n };\n}\n\nexport enum NestedDonutDirection {\n Inwards = 'inwards',\n Outwards = 'outwards',\n}\n\nexport enum NestedDonutSegmentLabelAlignment {\n Along = 'along',\n Perpendicular = 'perpendicular',\n Straight = 'straight',\n}\n\nexport type NestedDonutLayerSettings = {\n backgroundColor?: string;\n labelAlignment?: NestedDonutSegmentLabelAlignment;\n width?: number | string;\n}\n\nexport type NestedDonutLayer = NestedDonutLayerSettings & {\n _id: number;\n _innerRadius: number;\n _outerRadius: number;\n}\n\n"],"names":[],"mappings":"IAkBY,qBAGX;AAHD,CAAA,UAAY,oBAAoB,EAAA;AAC9B,IAAA,oBAAA,CAAA,SAAA,CAAA,GAAA,SAAmB,CAAA;AACnB,IAAA,oBAAA,CAAA,UAAA,CAAA,GAAA,UAAqB,CAAA;AACvB,CAAC,EAHW,oBAAoB,KAApB,oBAAoB,GAG/B,EAAA,CAAA,CAAA,CAAA;IAEW,iCAIX;AAJD,CAAA,UAAY,gCAAgC,EAAA;AAC1C,IAAA,gCAAA,CAAA,OAAA,CAAA,GAAA,OAAe,CAAA;AACf,IAAA,gCAAA,CAAA,eAAA,CAAA,GAAA,eAA+B,CAAA;AAC/B,IAAA,gCAAA,CAAA,UAAA,CAAA,GAAA,UAAqB,CAAA;AACvB,CAAC,EAJW,gCAAgC,KAAhC,gCAAgC,GAI3C,EAAA,CAAA,CAAA;;;;"}
package/index.js CHANGED
@@ -50,6 +50,7 @@ export { GraphLayoutType, GraphLinkArrowStyle, GraphLinkStyle, GraphNodeShape }
50
50
  export { SankeyEnterTransitionType, SankeyExitTransitionType, SankeyLayout, SankeyNodeAlign, SankeySubLabelPlacement } from './components/sankey/types.js';
51
51
  export { VisControlsOrientation } from './components/vis-controls/types.js';
52
52
  export { FreeBrushMode } from './components/free-brush/types.js';
53
+ export { BulletShape } from './components/bullet-legend/types.js';
53
54
  export { XYLabelPositioning } from './components/xy-labels/types.js';
54
55
  export { NestedDonutDirection, NestedDonutSegmentLabelAlignment } from './components/nested-donut/types.js';
55
56
  //# sourceMappingURL=index.js.map
package/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
1
+ {"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@unovis/ts",
3
3
  "description": "Modular data visualization framework for React, Angular, Svelte, and vanilla TypeScript or JavaScript",
4
- "version": "1.2.2-beta.3",
4
+ "version": "1.2.2-beta.5",
5
5
  "repository": {
6
6
  "type": "git",
7
7
  "url": "https://github.com/f5/unovis.git",
package/types.js CHANGED
@@ -22,7 +22,7 @@ export { GraphLayoutType, GraphLinkArrowStyle, GraphLinkStyle, GraphNodeShape }
22
22
  export { SankeyEnterTransitionType, SankeyExitTransitionType, SankeyLayout, SankeyNodeAlign, SankeySubLabelPlacement } from './components/sankey/types.js';
23
23
  export { VisControlsOrientation } from './components/vis-controls/types.js';
24
24
  export { FreeBrushMode } from './components/free-brush/types.js';
25
- import './components/bullet-legend/types.js';
25
+ export { BulletShape } from './components/bullet-legend/types.js';
26
26
  export { XYLabelPositioning } from './components/xy-labels/types.js';
27
27
  export { NestedDonutDirection, NestedDonutSegmentLabelAlignment } from './components/nested-donut/types.js';
28
28
 
package/utils/color.d.ts CHANGED
@@ -1,10 +1,14 @@
1
1
  import { ColorAccessor } from "../types/accessor";
2
- /** Retrieves color from the data if provided, fallbacks to CSS variables if the index was passed */
3
- export declare function getColor<T>(d: T, accessor: ColorAccessor<T>, index?: number, dontFallbackToCssVar?: boolean): string | null;
4
- export declare function hexToRgb(hex: string): {
2
+ declare type RGBColor = {
5
3
  r: number;
6
4
  g: number;
7
5
  b: number;
8
6
  };
7
+ /** Retrieves color from the data if provided, fallbacks to CSS variables if the index was passed */
8
+ export declare function getColor<T>(d: T, accessor: ColorAccessor<T>, index?: number, dontFallbackToCssVar?: boolean): string | null;
9
+ export declare function hexToRgb(hex: string): RGBColor;
10
+ export declare function rgbToBrightness(rgb: RGBColor): number;
9
11
  export declare function hexToBrightness(hex: string): number;
10
12
  export declare function getHexValue(s: string, context: HTMLElement | SVGElement): string;
13
+ export declare function rgbaToRgb(rgba: string, backgroundColor?: string): RGBColor;
14
+ export {};
package/utils/color.js CHANGED
@@ -18,15 +18,31 @@ function hexToRgb(hex) {
18
18
  b: parseInt(parsed[3], 16),
19
19
  } : { r: 0, g: 0, b: 0 };
20
20
  }
21
+ function rgbToBrightness(rgb) {
22
+ return (0.2126 * rgb.r + 0.7152 * rgb.g + 0.0722 * rgb.b) / 255;
23
+ }
21
24
  function hexToBrightness(hex) {
22
25
  const rgb = hexToRgb(hex);
23
- return (0.2126 * rgb.r + 0.7152 * rgb.g + 0.0722 * rgb.b) / 255;
26
+ return rgbToBrightness(rgb);
24
27
  }
25
28
  function getHexValue(s, context) {
26
29
  var _a;
27
30
  const hex = isStringCSSVariable(s) ? getCSSVariableValue(s, context) : s;
28
31
  return (_a = color(hex)) === null || _a === void 0 ? void 0 : _a.formatHex();
32
+ }
33
+ function rgbaToRgb(rgba, backgroundColor) {
34
+ var _a;
35
+ const rgb = (_a = color(rgba)) === null || _a === void 0 ? void 0 : _a.rgb();
36
+ if (!rgb || rgb.opacity === 1)
37
+ return rgb;
38
+ const alpha = 1 - rgb.opacity;
39
+ const bg = color(backgroundColor !== null && backgroundColor !== void 0 ? backgroundColor : '#fff').rgb();
40
+ return {
41
+ r: Math.round((rgb.opacity * (rgb.r / 255) + (alpha * (bg.r / 255))) * 255),
42
+ g: Math.round((rgb.opacity * (rgb.g / 255) + (alpha * (bg.g / 255))) * 255),
43
+ b: Math.round((rgb.opacity * (rgb.b / 255) + (alpha * (bg.b / 255))) * 255),
44
+ };
29
45
  }
30
46
 
31
- export { getColor, getHexValue, hexToBrightness, hexToRgb };
47
+ export { getColor, getHexValue, hexToBrightness, hexToRgb, rgbToBrightness, rgbaToRgb };
32
48
  //# sourceMappingURL=color.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"color.js","sources":["../../src/utils/color.ts"],"sourcesContent":["import { color } from 'd3-color'\n\n// Core\nimport { getCSSColorVariable } from 'styles/colors'\n\n// Utils\nimport { ColorAccessor, StringAccessor } from 'types/accessor'\nimport { getString, isNumber } from 'utils/data'\nimport { isStringCSSVariable, getCSSVariableValue } from 'utils/misc'\n\n/** Retrieves color from the data if provided, fallbacks to CSS variables if the index was passed */\nexport function getColor<T> (\n d: T,\n accessor: ColorAccessor<T>,\n index?: number,\n dontFallbackToCssVar?: boolean\n): string | null {\n if (Array.isArray(accessor) && isFinite(index)) return accessor[index % accessor.length]\n\n const value = getString(d, accessor as StringAccessor<T>, index)\n return (value || ((isNumber(index) && !dontFallbackToCssVar) ? `var(${getCSSColorVariable(index)})` : null))\n}\n\nexport function hexToRgb (hex: string): { r: number; g: number; b: number } {\n const parsed = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex)\n return parsed ? {\n r: parseInt(parsed[1], 16),\n g: parseInt(parsed[2], 16),\n b: parseInt(parsed[3], 16),\n } : { r: 0, g: 0, b: 0 }\n}\n\nexport function hexToBrightness (hex: string): number {\n const rgb = hexToRgb(hex)\n return (0.2126 * rgb.r + 0.7152 * rgb.g + 0.0722 * rgb.b) / 255\n}\n\nexport function getHexValue (s: string, context: HTMLElement | SVGElement): string {\n const hex = isStringCSSVariable(s) ? getCSSVariableValue(s, context) : s\n return color(hex)?.formatHex()\n}\n"],"names":[],"mappings":";;;;;AAUA;AACM,SAAU,QAAQ,CACtB,CAAI,EACJ,QAA0B,EAC1B,KAAc,EACd,oBAA8B,EAAA;IAE9B,IAAI,KAAK,CAAC,OAAO,CAAC,QAAQ,CAAC,IAAI,QAAQ,CAAC,KAAK,CAAC;QAAE,OAAO,QAAQ,CAAC,KAAK,GAAG,QAAQ,CAAC,MAAM,CAAC,CAAA;IAExF,MAAM,KAAK,GAAG,SAAS,CAAC,CAAC,EAAE,QAA6B,EAAE,KAAK,CAAC,CAAA;AAChE,IAAA,QAAQ,KAAK,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,oBAAoB,IAAI,CAAO,IAAA,EAAA,mBAAmB,CAAC,KAAK,CAAC,CAAA,CAAA,CAAG,GAAG,IAAI,CAAC,EAAC;AAC9G,CAAC;AAEK,SAAU,QAAQ,CAAE,GAAW,EAAA;IACnC,MAAM,MAAM,GAAG,2CAA2C,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;IACpE,OAAO,MAAM,GAAG;QACd,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;QAC1B,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;QAC1B,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;AAC3B,KAAA,GAAG,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAA;AAC1B,CAAC;AAEK,SAAU,eAAe,CAAE,GAAW,EAAA;AAC1C,IAAA,MAAM,GAAG,GAAG,QAAQ,CAAC,GAAG,CAAC,CAAA;IACzB,OAAO,CAAC,MAAM,GAAG,GAAG,CAAC,CAAC,GAAG,MAAM,GAAG,GAAG,CAAC,CAAC,GAAG,MAAM,GAAG,GAAG,CAAC,CAAC,IAAI,GAAG,CAAA;AACjE,CAAC;AAEe,SAAA,WAAW,CAAE,CAAS,EAAE,OAAiC,EAAA;;AACvE,IAAA,MAAM,GAAG,GAAG,mBAAmB,CAAC,CAAC,CAAC,GAAG,mBAAmB,CAAC,CAAC,EAAE,OAAO,CAAC,GAAG,CAAC,CAAA;IACxE,OAAO,CAAA,EAAA,GAAA,KAAK,CAAC,GAAG,CAAC,MAAE,IAAA,IAAA,EAAA,KAAA,KAAA,CAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,SAAS,EAAE,CAAA;AAChC;;;;"}
1
+ {"version":3,"file":"color.js","sources":["../../src/utils/color.ts"],"sourcesContent":["import { color } from 'd3-color'\n\n// Core\nimport { getCSSColorVariable } from 'styles/colors'\n\n// Utils\nimport { ColorAccessor, StringAccessor } from 'types/accessor'\nimport { getString, isNumber } from 'utils/data'\nimport { isStringCSSVariable, getCSSVariableValue } from 'utils/misc'\n\ntype RGBColor = { r: number; g: number; b: number }\n\n/** Retrieves color from the data if provided, fallbacks to CSS variables if the index was passed */\nexport function getColor<T> (\n d: T,\n accessor: ColorAccessor<T>,\n index?: number,\n dontFallbackToCssVar?: boolean\n): string | null {\n if (Array.isArray(accessor) && isFinite(index)) return accessor[index % accessor.length]\n\n const value = getString(d, accessor as StringAccessor<T>, index)\n return (value || ((isNumber(index) && !dontFallbackToCssVar) ? `var(${getCSSColorVariable(index)})` : null))\n}\n\nexport function hexToRgb (hex: string): RGBColor {\n const parsed = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(hex)\n return parsed ? {\n r: parseInt(parsed[1], 16),\n g: parseInt(parsed[2], 16),\n b: parseInt(parsed[3], 16),\n } : { r: 0, g: 0, b: 0 }\n}\n\nexport function rgbToBrightness (rgb: RGBColor): number {\n return (0.2126 * rgb.r + 0.7152 * rgb.g + 0.0722 * rgb.b) / 255\n}\n\nexport function hexToBrightness (hex: string): number {\n const rgb = hexToRgb(hex)\n return rgbToBrightness(rgb)\n}\n\nexport function getHexValue (s: string, context: HTMLElement | SVGElement): string {\n const hex = isStringCSSVariable(s) ? getCSSVariableValue(s, context) : s\n return color(hex)?.formatHex()\n}\n\nexport function rgbaToRgb (rgba: string, backgroundColor?: string): RGBColor {\n const rgb = color(rgba)?.rgb()\n if (!rgb || rgb.opacity === 1) return rgb\n const alpha = 1 - rgb.opacity\n const bg = color(backgroundColor ?? '#fff').rgb()\n return {\n r: Math.round((rgb.opacity * (rgb.r / 255) + (alpha * (bg.r / 255))) * 255),\n g: Math.round((rgb.opacity * (rgb.g / 255) + (alpha * (bg.g / 255))) * 255),\n b: Math.round((rgb.opacity * (rgb.b / 255) + (alpha * (bg.b / 255))) * 255),\n }\n}\n"],"names":[],"mappings":"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"}