vue-chrts 0.1.0-beta.2-internal-20 → 0.1.0-beta.2-internal-21

package/dist/node_modules/@unovis/ts/components/axis/index.js

@@ -0,0 +1,287 @@
+import "../../../../d3-transition/src/selection/index.js";
+import V from "../../../../d3-transition/src/interrupt.js";
+import { XYComponentCore as z } from "../../core/xy-component/index.js";
+import { Position as o } from "../../types/position.js";
+import { VerticalAlign as y, FitMode as C, TextAlign as p } from "../../types/text.js";
+import { smartTransition as k } from "../../utils/d3.js";
+import { trimSVGText as F, renderTextToSvgTextElement as Y } from "../../utils/text.js";
+import { isEqual as $ } from "../../utils/data.js";
+import { rectIntersect as G } from "../../utils/misc.js";
+import { AxisType as c } from "./types.js";
+import { AxisDefaultConfig as M } from "./config.js";
+import * as P from "./style.js";
+import { grid as O, tick as D, tickLabel as H, tickLabelHideable as W, axis as q, hideTickLine as N, hideDomain as E, label as B } from "./style.js";
+import { axisLeft as w, axisRight as L, axisBottom as A, axisTop as S } from "../../../../d3-axis/src/axis.js";
+import m from "../../../../d3-selection/src/select.js";
+class I extends z {
+  constructor(t) {
+    super(), this._defaultConfig = M, this.config = this._defaultConfig, this._defaultNumTicks = 3, this.events = {}, t && this.setConfig(t), this.axisGroup = this.g.append("g"), this.gridGroup = this.g.append("g").attr("class", O);
+  }
+  /** Renders axis to an invisible grouped to calculate automatic chart margins */
+  preRender() {
+    const { config: t } = this, i = this.g.append("g").attr("opacity", 0);
+    this._renderAxis(i, 0), this._axisRawBBox = i.node().getBBox(), t.tickTextAlign && this._alignTickLabels(), this._renderAxisLabel(i), this._axisSizeBBox = this._getAxisSize(i), this._requiredMargin = this._getRequiredMargin(this._axisSizeBBox), i.remove();
+  }
+  getPosition() {
+    const { config: { type: t, position: i } } = this;
+    return i ?? (t === c.X ? o.Bottom : o.Left);
+  }
+  _getAxisSize(t) {
+    return t.node().getBBox();
+  }
+  _getRequiredMargin(t = this._axisSizeBBox) {
+    const { config: { type: i, position: e } } = this;
+    switch (i) {
+      case c.X: {
+        const n = this._axisSizeBBox.x + this._axisSizeBBox.width, r = this._axisSizeBBox.x < 0 ? Math.abs(this._axisSizeBBox.x) : 0, a = n - this._width > 1 ? n - this._width : 0;
+        switch (e) {
+          case o.Top:
+            return { top: t.height, left: r, right: a };
+          case o.Bottom:
+          default:
+            return { bottom: t.height, left: r, right: a };
+        }
+      }
+      case c.Y: {
+        const s = t.height > this._height ? (t.height - this._height) / 2 : 0, n = s, r = s;
+        switch (e) {
+          case o.Right:
+            return { right: t.width, top: n, bottom: r };
+          case o.Left:
+          default:
+            return { left: t.width, top: n, bottom: r };
+        }
+      }
+    }
+  }
+  getRequiredMargin() {
+    return this._requiredMargin;
+  }
+  /** Calculates axis transform:translate offset based on passed container margins */
+  getOffset(t) {
+    const { config: { type: i, position: e } } = this;
+    switch (i) {
+      case c.X:
+        switch (e) {
+          case o.Top:
+            return { top: t.top, left: t.left };
+          case o.Bottom:
+          default:
+            return { top: t.top + this._height, left: t.left };
+        }
+      case c.Y:
+        switch (e) {
+          case o.Right:
+            return { top: t.top, left: t.left + this._width };
+          case o.Left:
+          default:
+            return { top: t.top, left: t.left };
+        }
+    }
+  }
+  _render(t = this.config.duration, i = this.axisGroup) {
+    const { config: e } = this;
+    if (this._renderAxis(i, t), this._renderAxisLabel(i), e.gridLine) {
+      const s = this._buildGrid().tickFormat(() => "");
+      s.tickValues(this._getConfiguredTickValues()), this.gridGroup.selectAll("*").interrupt(), k(this.gridGroup, t).call(s).style("opacity", 1);
+    } else
+      k(this.gridGroup, t).style("opacity", 0);
+    e.tickTextAlign && this._alignTickLabels(), this._resolveTickLabelOverlap(i);
+  }
+  _buildAxis() {
+    const { config: { type: t, position: i, tickPadding: e } } = this, s = this._getNumTicks();
+    switch (t) {
+      case c.X:
+        switch (i) {
+          case o.Top:
+            return S(this.xScale).ticks(s).tickPadding(e);
+          case o.Bottom:
+          default:
+            return A(this.xScale).ticks(s).tickPadding(e);
+        }
+      case c.Y:
+        switch (i) {
+          case o.Right:
+            return L(this.yScale).ticks(s).tickPadding(e);
+          case o.Left:
+          default:
+            return w(this.yScale).ticks(s).tickPadding(e);
+        }
+    }
+  }
+  _buildGrid() {
+    const { config: { type: t, position: i } } = this, e = this._getNumTicks();
+    switch (t) {
+      case c.X:
+        switch (i) {
+          case o.Top:
+            return S(this.xScale).ticks(e * 2).tickSize(-this._height).tickSizeOuter(0);
+          case o.Bottom:
+          default:
+            return A(this.xScale).ticks(e * 2).tickSize(-this._height).tickSizeOuter(0);
+        }
+      case c.Y:
+        switch (i) {
+          case o.Right:
+            return L(this.yScale).ticks(e * 2).tickSize(-this._width).tickSizeOuter(0);
+          case o.Left:
+          default:
+            return w(this.yScale).ticks(e * 2).tickSize(-this._width).tickSizeOuter(0);
+        }
+    }
+  }
+  _renderAxis(t = this.axisGroup, i = this.config.duration) {
+    const { config: e } = this, s = this._buildAxis(), n = this._getConfiguredTickValues() || s.scale().ticks(this._getNumTicks());
+    s.tickValues(n), t.selectAll("*").interrupt(), k(t, i).call(s);
+    const r = t.selectAll("g.tick");
+    r.classed(D, !0).style("font-size", e.tickTextFontSize);
+    const a = t.selectAll("g.tick > text").filter((l) => n.some((d) => $(l, d))).classed(H, !0).classed(W, !!e.tickTextHideOverlapping).style("fill", e.tickTextColor);
+    if (a.nodes().forEach((l) => V(l)), a.each((l, d, u) => {
+      var h, x;
+      let g = (x = (h = e.tickFormat) === null || h === void 0 ? void 0 : h.call(e, l, d, n)) !== null && x !== void 0 ? x : `${l}`;
+      const f = u[d], _ = e.tickTextWidth || (e.type === c.X ? this._containerWidth / (r.size() + 1) : this._containerWidth / 5), T = getComputedStyle(f), b = Number.parseFloat(T.fontSize), v = T.fontFamily, R = {
+        verticalAlign: e.type === c.X ? y.Top : y.Middle,
+        width: _,
+        textRotationAngle: e.tickTextAngle,
+        separator: e.tickTextSeparator,
+        wordBreak: e.tickTextForceWordBreak
+      };
+      if (e.tickTextFitMode === C.Trim) {
+        const X = m(f).text(g);
+        F(X, _, e.tickTextTrimType, !0, b, 0.58), g = m(f).text();
+      }
+      Y(f, { text: g, fontFamily: v, fontSize: b }, R);
+    }), t.classed(q, !0).classed(N, !e.tickLine).classed(E, !e.domainLine), e.fullSize) {
+      const l = this._getFullDomainPath(0);
+      k(t.select(".domain"), i).attr("d", l);
+    }
+  }
+  _resolveTickLabelOverlap(t = this.axisGroup) {
+    const { config: i } = this, e = t.selectAll("g.tick > text");
+    if (!i.tickTextHideOverlapping) {
+      e.style("opacity", null);
+      return;
+    }
+    cancelAnimationFrame(this._collideTickLabelsAnimFrameId), this._collideTickLabelsAnimFrameId = requestAnimationFrame(() => {
+      this._collideTickLabels(e);
+    });
+  }
+  _collideTickLabels(t) {
+    t.each((e, s, n) => {
+      const r = n[s];
+      r._visible = !0;
+    });
+    const i = 3;
+    for (let e = 0; e < i; e += 1)
+      t.each((s, n, r) => {
+        const a = r[n];
+        if (!a._visible)
+          return;
+        const d = a.getBoundingClientRect();
+        for (let u = n + 1; u < r.length; u += 1) {
+          if (n === u)
+            continue;
+          const h = r[u];
+          if (h._visible) {
+            const g = h.getBoundingClientRect();
+            if (G(d, g, -5)) {
+              h._visible = !1;
+              break;
+            }
+          }
+        }
+      });
+    t.each((e, s, n) => {
+      const r = n[s];
+      m(r).style("opacity", r._visible ? 1 : 0);
+    });
+  }
+  _getNumTicks() {
+    const { config: { type: t, numTicks: i } } = this;
+    if (i)
+      return i;
+    if (t === c.X) {
+      const e = this.xScale.range(), s = e[1] - e[0];
+      return Math.floor(s / 175);
+    }
+    if (t === c.Y) {
+      const e = this.yScale.range(), s = Math.abs(e[0] - e[1]);
+      return Math.pow(s, 0.85) / 25;
+    }
+    return this._defaultNumTicks;
+  }
+  _getConfiguredTickValues() {
+    const { config: t } = this, i = t.type === c.X ? this.xScale : this.yScale, e = i == null ? void 0 : i.domain();
+    return t.tickValues ? t.tickValues.filter((s) => s >= e[0] && s <= e[1]) : t.minMaxTicksOnly || t.type === c.X && this._width < t.minMaxTicksOnlyWhenWidthIsLess ? e : null;
+  }
+  _getFullDomainPath(t = 0) {
+    const { config: { type: i } } = this;
+    switch (i) {
+      case c.X:
+        return `M0.5, ${t} V0.5 H${this._width + 0.5} V${t}`;
+      case c.Y:
+        return `M${-t}, ${this._height + 0.5} H0.5 V0.5 H${-t}`;
+    }
+  }
+  _renderAxisLabel(t = this.axisGroup) {
+    var i;
+    const { type: e, label: s, labelMargin: n, labelFontSize: r } = this.config;
+    t.selectAll(`.${B}`).remove();
+    const a = this.getPosition(), { width: l, height: d } = (i = this._axisRawBBox) !== null && i !== void 0 ? i : t.node().getBBox(), u = e === c.X ? this._width / 2 : Math.pow(-1, +(a === o.Left)) * l, h = e === c.X ? Math.pow(-1, +(a === o.Top)) * d : this._height / 2, x = e === c.X ? 0 : Math.pow(-1, +(a === o.Left)) * n, g = e === c.X ? Math.pow(-1, +(a === o.Top)) * n : 0, f = e === c.Y ? -90 : 0;
+    t.append("text").attr("class", B).text(s).attr("dy", `${this._getLabelDY()}em`).attr("transform", `translate(${u + x},${h + g}) rotate(${f})`).style("font-size", r).style("fill", this.config.labelColor);
+  }
+  _getLabelDY() {
+    const { type: t, position: i } = this.config;
+    switch (t) {
+      case c.X:
+        switch (i) {
+          case o.Top:
+            return 0;
+          case o.Bottom:
+          default:
+            return 0.75;
+        }
+      case c.Y:
+        switch (i) {
+          case o.Right:
+            return 0.75;
+          case o.Left:
+          default:
+            return -0.25;
+        }
+    }
+  }
+  _alignTickLabels() {
+    const { config: { type: t, tickTextAlign: i, tickTextAngle: e, position: s } } = this, n = this.g.selectAll("g.tick > text"), r = this._getTickTextAnchor(i), a = t === c.X ? 0 : this._getYTickTextTranslate(i, s), l = e ? `translate(${a},0) rotate(${e})` : `translate(${a},0)`;
+    n.attr("transform", l).attr("text-anchor", r);
+  }
+  _getTickTextAnchor(t) {
+    switch (t) {
+      case p.Left:
+        return "start";
+      case p.Right:
+        return "end";
+      case p.Center:
+        return "middle";
+      default:
+        return null;
+    }
+  }
+  _getYTickTextTranslate(t, i = o.Left) {
+    const s = this._axisRawBBox.width - 9;
+    switch (t) {
+      case p.Left:
+        return i === o.Left ? s * -1 : 0;
+      case p.Right:
+        return i === o.Left ? 0 : s;
+      case p.Center:
+        return i === o.Left ? s * -0.5 : s * 0.5;
+      default:
+        return 0;
+    }
+  }
+}
+I.selectors = P;
+export {
+  I as Axis
+};

package/dist/node_modules/@unovis/ts/components/axis/style.cjs

@@ -0,0 +1,101 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../../../../@emotion/css/dist/emotion-css.esm.cjs"),a=i.css`
+  label: axis-component;
+`,o=i.injectGlobal`
+  :root {
+    // Undefined by default to allow proper fallback to var(--vis-font-family)
+    /* --vis-axis-font-family: */
+    --vis-axis-tick-color: #e8e9ef;
+    /* --vis-axis-domain-color: // Undefined by default to allow fallback to var(--vis-axis-tick-color) */
+    --vis-axis-grid-color: #e8e9ef;
+    --vis-axis-label-color: #6c778c;
+    --vis-axis-tick-label-color: #6c778c;
+    --vis-axis-tick-label-font-size: 12px;
+    --vis-axis-tick-label-cursor: default;
+    --vis-axis-tick-label-text-decoration: none;
+    --vis-axis-label-font-size: 14px;
+    --vis-axis-tick-line-width: 1px;
+    --vis-axis-tick-label-hide-transition: opacity 400ms ease-in-out;
+    --vis-axis-grid-line-width: 1px;
+    /* --vis-axis-domain-line-width: // Undefined by default to allow fallback to var(--vis-axis-grid-line-width) */
+
+    --vis-dark-axis-tick-color: #6c778c;
+    /* --vis-dark-axis-domain-color: // Undefined by default to allow fallback to var(--vis-dark-axis-tick-color) */
+    --vis-dark-axis-tick-label-color: #e8e9ef;
+    --vis-dark-axis-grid-color: #6c778c;
+    --vis-dark-axis-label-color: #fefefe;
+  }
+
+  body.theme-dark ${`.${a}`} {
+    --vis-axis-tick-color: var(--vis-dark-axis-tick-color);
+    --vis-axis-domain-color: var(--vis-dark-axis-domain-color);
+    --vis-axis-tick-label-color: var(--vis-dark-axis-tick-label-color);
+    --vis-axis-grid-color: var(--vis-dark-axis-grid-color);
+    --vis-axis-label-color: var(--vis-dark-axis-label-color);
+  }
+`,s=i.css`
+  label: hide-tick-line;
+`,l=i.css`
+  label: hide-domain;
+`,e=i.css`
+  label: axis;
+
+  user-select: none;
+
+  .domain {
+    stroke: var(--vis-axis-domain-color, var(--vis-axis-tick-color));
+    stroke-width: var(--vis-axis-domain-line-width, var(--vis-axis-grid-line-width));
+  }
+
+  &${`.${s}`} {
+    .tick > line {
+      opacity: 0;
+    }
+  }
+
+  &${`.${l}`} {
+    .domain {
+      opacity: 0;
+    }
+  }
+`,t=i.css`
+  label: grid;
+
+  .domain {
+    opacity: 0;
+  }
+
+  line {
+    stroke: var(--vis-axis-grid-color);
+    stroke-width: var(--vis-axis-grid-line-width);
+  }
+`,c=i.css`
+  label: tick;
+
+  stroke: none;
+  font-size: var(--vis-axis-tick-label-font-size);
+
+  line {
+    stroke: var(--vis-axis-tick-color);
+    stroke-width: var(--vis-axis-tick-line-width);
+  }
+
+  text {
+    fill: var(--vis-axis-tick-label-color);
+    cursor: var(--vis-axis-tick-label-cursor);
+    font-family: var(--vis-axis-font-family, var(--vis-font-family));
+    text-decoration: var(--vis-axis-tick-label-text-decoration);
+    stroke: none;
+  }
+`,r=i.css`
+  label: label;
+  fill: var(--vis-axis-label-color);
+  font-size: var(--vis-axis-label-font-size);
+  font-family: var(--vis-axis-font-family, var(--vis-font-family));
+  text-anchor: middle;
+`,n=i.css`
+  label: tick-label;
+`,v=i.css`
+  label: tick-label-hideable;
+  opacity: 0;
+  transition: var(--vis-axis-tick-label-hide-transition);
+`;exports.axis=e;exports.globalStyles=o;exports.grid=t;exports.hideDomain=l;exports.hideTickLine=s;exports.label=r;exports.root=a;exports.tick=c;exports.tickLabel=n;exports.tickLabelHideable=v;

package/dist/node_modules/@unovis/ts/components/axis/style.js

@@ -0,0 +1,114 @@
+import { css as i, injectGlobal as a } from "../../../../@emotion/css/dist/emotion-css.esm.js";
+const l = i`
+  label: axis-component;
+`, t = a`
+  :root {
+    // Undefined by default to allow proper fallback to var(--vis-font-family)
+    /* --vis-axis-font-family: */
+    --vis-axis-tick-color: #e8e9ef;
+    /* --vis-axis-domain-color: // Undefined by default to allow fallback to var(--vis-axis-tick-color) */
+    --vis-axis-grid-color: #e8e9ef;
+    --vis-axis-label-color: #6c778c;
+    --vis-axis-tick-label-color: #6c778c;
+    --vis-axis-tick-label-font-size: 12px;
+    --vis-axis-tick-label-cursor: default;
+    --vis-axis-tick-label-text-decoration: none;
+    --vis-axis-label-font-size: 14px;
+    --vis-axis-tick-line-width: 1px;
+    --vis-axis-tick-label-hide-transition: opacity 400ms ease-in-out;
+    --vis-axis-grid-line-width: 1px;
+    /* --vis-axis-domain-line-width: // Undefined by default to allow fallback to var(--vis-axis-grid-line-width) */
+
+    --vis-dark-axis-tick-color: #6c778c;
+    /* --vis-dark-axis-domain-color: // Undefined by default to allow fallback to var(--vis-dark-axis-tick-color) */
+    --vis-dark-axis-tick-label-color: #e8e9ef;
+    --vis-dark-axis-grid-color: #6c778c;
+    --vis-dark-axis-label-color: #fefefe;
+  }
+
+  body.theme-dark ${`.${l}`} {
+    --vis-axis-tick-color: var(--vis-dark-axis-tick-color);
+    --vis-axis-domain-color: var(--vis-dark-axis-domain-color);
+    --vis-axis-tick-label-color: var(--vis-dark-axis-tick-label-color);
+    --vis-axis-grid-color: var(--vis-dark-axis-grid-color);
+    --vis-axis-label-color: var(--vis-dark-axis-label-color);
+  }
+`, o = i`
+  label: hide-tick-line;
+`, s = i`
+  label: hide-domain;
+`, r = i`
+  label: axis;
+
+  user-select: none;
+
+  .domain {
+    stroke: var(--vis-axis-domain-color, var(--vis-axis-tick-color));
+    stroke-width: var(--vis-axis-domain-line-width, var(--vis-axis-grid-line-width));
+  }
+
+  &${`.${o}`} {
+    .tick > line {
+      opacity: 0;
+    }
+  }
+
+  &${`.${s}`} {
+    .domain {
+      opacity: 0;
+    }
+  }
+`, c = i`
+  label: grid;
+
+  .domain {
+    opacity: 0;
+  }
+
+  line {
+    stroke: var(--vis-axis-grid-color);
+    stroke-width: var(--vis-axis-grid-line-width);
+  }
+`, v = i`
+  label: tick;
+
+  stroke: none;
+  font-size: var(--vis-axis-tick-label-font-size);
+
+  line {
+    stroke: var(--vis-axis-tick-color);
+    stroke-width: var(--vis-axis-tick-line-width);
+  }
+
+  text {
+    fill: var(--vis-axis-tick-label-color);
+    cursor: var(--vis-axis-tick-label-cursor);
+    font-family: var(--vis-axis-font-family, var(--vis-font-family));
+    text-decoration: var(--vis-axis-tick-label-text-decoration);
+    stroke: none;
+  }
+`, n = i`
+  label: label;
+  fill: var(--vis-axis-label-color);
+  font-size: var(--vis-axis-label-font-size);
+  font-family: var(--vis-axis-font-family, var(--vis-font-family));
+  text-anchor: middle;
+`, d = i`
+  label: tick-label;
+`, x = i`
+  label: tick-label-hideable;
+  opacity: 0;
+  transition: var(--vis-axis-tick-label-hide-transition);
+`;
+export {
+  r as axis,
+  t as globalStyles,
+  c as grid,
+  s as hideDomain,
+  o as hideTickLine,
+  n as label,
+  l as root,
+  v as tick,
+  d as tickLabel,
+  x as tickLabelHideable
+};

package/dist/node_modules/@unovis/ts/components/axis/types.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});exports.AxisType=void 0;(function(e){e.X="x",e.Y="y"})(exports.AxisType||(exports.AxisType={}));

package/dist/node_modules/@unovis/ts/components/axis/types.js

@@ -0,0 +1,7 @@
+var o;
+(function(n) {
+  n.X = "x", n.Y = "y";
+})(o || (o = {}));
+export {
+  o as AxisType
+};

package/dist/node_modules/@unovis/ts/components/bullet-legend/config.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const l=require("./types.cjs"),n={items:[],labelClassName:"",onLegendItemClick:void 0,labelFontSize:null,labelMaxWidth:null,bulletSize:null,bulletShape:t=>{var e;return(e=t.shape)!==null&&e!==void 0?e:l.BulletShape.Circle},orientation:l.BulletLegendOrientation.Horizontal,renderIntoProvidedDomNode:!1};exports.BulletLegendDefaultConfig=n;

package/dist/node_modules/@unovis/ts/components/bullet-legend/config.js

@@ -0,0 +1,18 @@
+import { BulletLegendOrientation as n, BulletShape as t } from "./types.js";
+const a = {
+  items: [],
+  labelClassName: "",
+  onLegendItemClick: void 0,
+  labelFontSize: null,
+  labelMaxWidth: null,
+  bulletSize: null,
+  bulletShape: (l) => {
+    var e;
+    return (e = l.shape) !== null && e !== void 0 ? e : t.Circle;
+  },
+  orientation: n.Horizontal,
+  renderIntoProvidedDomNode: !1
+};
+export {
+  a as BulletLegendDefaultConfig
+};

package/dist/node_modules/@unovis/ts/components/bullet-legend/index.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("../../utils/data.cjs"),u=require("./config.cjs"),h=require("./types.cjs"),r=require("./modules/shape.cjs"),s=require("./style.cjs"),a=require("../../../../d3-selection/src/select.cjs");class c{constructor(e,t){this._defaultConfig=u.BulletLegendDefaultConfig,this.config=this._defaultConfig,this._colorAccessor=l=>l.color,this._container=e,this.div=t!=null&&t.renderIntoProvidedDomNode?a.default(this._container):a.default(this._container).append("div"),this.div.classed(s.root,!0),this.element=this.div.node(),t&&this.update(t)}update(e){this.prevConfig=this.config,this.config=d.merge(this._defaultConfig,e),this.render()}render(){const{config:e}=this,t=this.div.selectAll(`.${s.item}`).data(e.items),l=t.enter().append("div").on("click",this._onItemClick.bind(this)),n=l.merge(t);n.attr("class",i=>{var o;return`${s.item} ${(o=i.className)!==null&&o!==void 0?o:""}`}).classed(s.itemVertical,e.orientation===h.BulletLegendOrientation.Vertical).classed(s.clickable,i=>!!e.onLegendItemClick&&this._isItemClickable(i)).attr("title",i=>i.name).style("display",i=>i.hidden?"none":null),l.append("span").attr("class",s.bullet).call(r.createBullets),n.select(`.${s.bullet}`).style("width",e.bulletSize).style("height",e.bulletSize).style("box-sizing","content-box").call(r.updateBullets,this.config,this._colorAccessor),l.append("span").attr("class",s.label).classed(e.labelClassName,!0).style("max-width",e.labelMaxWidth).style("font-size",e.labelFontSize),n.select(`.${s.label}`).text(i=>i.name),t.exit().remove()}_isItemClickable(e){return e.pointer===void 0?!0:e.pointer}_onItemClick(e,t){const{config:{onLegendItemClick:l}}=this,i=this.div.selectAll(`.${s.item}`).nodes().indexOf(e.currentTarget);l&&l(t,i)}destroy(){this.element!==this._container&&this.div.remove()}}c.selectors=s;exports.BulletLegend=c;

package/dist/node_modules/@unovis/ts/components/bullet-legend/index.js

@@ -0,0 +1,36 @@
+import { merge as c } from "../../utils/data.js";
+import { BulletLegendDefaultConfig as m } from "./config.js";
+import { BulletLegendOrientation as h } from "./types.js";
+import { createBullets as u, updateBullets as p } from "./modules/shape.js";
+import * as f from "./style.js";
+import { root as g, item as o, itemVertical as v, clickable as _, bullet as r, label as a } from "./style.js";
+import d from "../../../../d3-selection/src/select.js";
+class b {
+  constructor(e, t) {
+    this._defaultConfig = m, this.config = this._defaultConfig, this._colorAccessor = (s) => s.color, this._container = e, this.div = t != null && t.renderIntoProvidedDomNode ? d(this._container) : d(this._container).append("div"), this.div.classed(g, !0), this.element = this.div.node(), t && this.update(t);
+  }
+  update(e) {
+    this.prevConfig = this.config, this.config = c(this._defaultConfig, e), this.render();
+  }
+  render() {
+    const { config: e } = this, t = this.div.selectAll(`.${o}`).data(e.items), s = t.enter().append("div").on("click", this._onItemClick.bind(this)), l = s.merge(t);
+    l.attr("class", (i) => {
+      var n;
+      return `${o} ${(n = i.className) !== null && n !== void 0 ? n : ""}`;
+    }).classed(v, e.orientation === h.Vertical).classed(_, (i) => !!e.onLegendItemClick && this._isItemClickable(i)).attr("title", (i) => i.name).style("display", (i) => i.hidden ? "none" : null), s.append("span").attr("class", r).call(u), l.select(`.${r}`).style("width", e.bulletSize).style("height", e.bulletSize).style("box-sizing", "content-box").call(p, this.config, this._colorAccessor), s.append("span").attr("class", a).classed(e.labelClassName, !0).style("max-width", e.labelMaxWidth).style("font-size", e.labelFontSize), l.select(`.${a}`).text((i) => i.name), t.exit().remove();
+  }
+  _isItemClickable(e) {
+    return e.pointer === void 0 ? !0 : e.pointer;
+  }
+  _onItemClick(e, t) {
+    const { config: { onLegendItemClick: s } } = this, i = this.div.selectAll(`.${o}`).nodes().indexOf(e.currentTarget);
+    s && s(t, i);
+  }
+  destroy() {
+    this.element !== this._container && this.div.remove();
+  }
+}
+b.selectors = f;
+export {
+  b as BulletLegend
+};

package/dist/node_modules/@unovis/ts/components/bullet-legend/modules/shape.cjs

@@ -0,0 +1 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const b=require("../../../types/symbol.cjs"),g=require("../../../utils/color.cjs"),$=require("../../../utils/data.cjs"),m=require("../../../styles/patterns.cjs"),e=require("../types.cjs"),S=require("../../../../../d3-selection/src/select.cjs"),q=require("../../../../../d3-shape/src/symbol.cjs"),i=m.PATTERN_SIZE_PX*3,k={[e.BulletShape.Circle]:Math.PI/4,[e.BulletShape.Cross]:5/9,[e.BulletShape.Diamond]:Math.sqrt(3)/6,[e.BulletShape.Square]:1,[e.BulletShape.Star]:.3,[e.BulletShape.Triangle]:Math.sqrt(3)/4,[e.BulletShape.Wye]:5/11};function v(o){o.each((u,n,a)=>{S.default(a[n]).append("svg").attr("width","100%").attr("height","100%").append("path")})}function w(o,u,n){o.each((a,c,d)=>{const s=$.getString(a,u.bulletShape,c),p=g.getColor(a,n,c),l=i,t=s===e.BulletShape.Line?i/2.5:i,h=S.default(d[c]).select("svg").attr("viewBox",`0 0 ${l} ${t}`).select("path").attr("stroke",p),y=a.inactive?"var(--vis-legend-bullet-inactive-opacity)":1;if(s===e.BulletShape.Line)h.attr("d",`M0,${t/2} L${l/2},${t/2} L${l},${t/2}`).attr("transform",null).style("opacity",y).style("stroke-width","3px").style("fill",null).style("fill-opacity",null).style("marker-start","none").style("marker-end","none");else{const B=q.default().type(b.Symbol[s]).size(l*t*k[s]),f=(l-2)/l;let r=t/2;switch(s){case e.BulletShape.Triangle:r+=t/8;break;case e.BulletShape.Star:r+=t/16;break;case e.BulletShape.Wye:r-=t/16;break}h.attr("d",B).attr("transform",`translate(${l/2}, ${Math.round(r)}) scale(${f})`).style("stroke-width","1px").style("opacity",null).style("fill",p).style("fill-opacity",y)}})}exports.createBullets=v;exports.updateBullets=w;

package/dist/node_modules/@unovis/ts/components/bullet-legend/modules/shape.js

@@ -0,0 +1,48 @@
+import { Symbol as $ } from "../../../types/symbol.js";
+import { getColor as b } from "../../../utils/color.js";
+import { getString as g } from "../../../utils/data.js";
+import { PATTERN_SIZE_PX as k } from "../../../styles/patterns.js";
+import { BulletShape as t } from "../types.js";
+import f from "../../../../../d3-selection/src/select.js";
+import v from "../../../../../d3-shape/src/symbol.js";
+const c = k * 3, w = {
+  [t.Circle]: Math.PI / 4,
+  [t.Cross]: 5 / 9,
+  [t.Diamond]: Math.sqrt(3) / 6,
+  [t.Square]: 1,
+  [t.Star]: 0.3,
+  [t.Triangle]: Math.sqrt(3) / 4,
+  [t.Wye]: 5 / 11
+};
+function C(s) {
+  s.each((p, n, a) => {
+    f(a[n]).append("svg").attr("width", "100%").attr("height", "100%").append("path");
+  });
+}
+function I(s, p, n) {
+  s.each((a, i, u) => {
+    const o = g(a, p.bulletShape, i), y = b(a, n, i), l = c, e = o === t.Line ? c / 2.5 : c, m = f(u[i]).select("svg").attr("viewBox", `0 0 ${l} ${e}`).select("path").attr("stroke", y), h = a.inactive ? "var(--vis-legend-bullet-inactive-opacity)" : 1;
+    if (o === t.Line)
+      m.attr("d", `M0,${e / 2} L${l / 2},${e / 2} L${l},${e / 2}`).attr("transform", null).style("opacity", h).style("stroke-width", "3px").style("fill", null).style("fill-opacity", null).style("marker-start", "none").style("marker-end", "none");
+    else {
+      const d = v().type($[o]).size(l * e * w[o]), S = (l - 2) / l;
+      let r = e / 2;
+      switch (o) {
+        case t.Triangle:
+          r += e / 8;
+          break;
+        case t.Star:
+          r += e / 16;
+          break;
+        case t.Wye:
+          r -= e / 16;
+          break;
+      }
+      m.attr("d", d).attr("transform", `translate(${l / 2}, ${Math.round(r)}) scale(${S})`).style("stroke-width", "1px").style("opacity", null).style("fill", y).style("fill-opacity", h);
+    }
+  });
+}
+export {
+  C as createBullets,
+  I as updateBullets
+};