@graphysdk/geom-lollipop 0.1.0 → 0.1.1-beta.1790864848006
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +1 -1
- package/dist/index.mjs +118 -118
- package/dist/utils/read-lollipop.d.ts +1 -1
- package/package.json +6 -6
package/dist/index.cjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});let
|
|
1
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});let a=require("@graphysdk/react"),u=require("react"),c=require("react/jsx-runtime");var x=(e,r)=>{const t=r==="x"?(0,a.getX)(e):(0,a.getY)(e),o=r==="x"?(0,a.getYMin)(e):(0,a.getXMin)(e),i=r==="x"?(0,a.getYMax)(e)??(0,a.getY)(e):(0,a.getXMax)(e)??(0,a.getX)(e);return t===null||o===null||i===null?null:{observation:e,band:t,base:o,tip:i}},p=(e,r)=>{const t=[];for(const o of e){const i=x(o,r);i!==null&&t.push(i)}return t},M=e=>e.tip<e.base,L=e=>{const r=[];if(!e.layer.dataLabels.showDataLabels)return{labels:r,droppedCount:0};const{position:t,justify:o,align:i,offset:s}=e.layer.dataLabels,n=o==="panel-start"||o==="panel-end",l=(0,a.readMainAxis)(e.coordSystem),d=(0,a.buildPanelAnchorBox)(e.panelRect);for(const h of p(e.layer.data,l)){const v=e.formatLabel(h.observation);if(v==="")continue;const{width:f,height:P}=e.measureDataLabel("observation","outside",v),k=(e.styleReaders.get("size",h.observation)??0)/2,A=(0,a.composePoint)(l,{main:h.band,cross:h.tip}),g=(0,a.resolveAnchoredLabelCenter)({box:{x:A.x*e.panelRect.width,y:(1-A.y)*e.panelRect.height,width:0,height:0},panel:d,orientation:O(l),placement:t==="auto"?"outside":t,justify:t==="auto"?S(h):o,align:i,offset:n?s:s+k,alignOffset:s+k,labelWidth:f,labelHeight:P});r.push({layerId:e.layer.id,x:g.x,y:g.y,text:v,width:f,height:P,isRotated:!1,role:"observation",position:g.position})}return{labels:r,droppedCount:0}},O=e=>e==="x"?{valueAxis:"y",valueDirectionSign:-1}:{valueAxis:"x",valueDirectionSign:1},S=e=>M(e)?"start":"end",V=10,W=1,j=2,B=.7,H={size:"pixels",strokeWidth:"pixels"},D={stroke:"color",alpha:"unitInterval",strokeWidth:"pixels",dashArray:"dashArray"},_=class extends a.Geom{constructor(...e){super(...e),this.type="lollipop",this.defaultParams={},this.positionRoles=[{axis:"x",role:"point",valueKind:"value"},{axis:"y",role:"min",valueKind:"value"},{axis:"y",role:"max",valueKind:"value",aes:"y"}],this.aesthetics=[{kind:"visual",name:"color"}],this.defaultPosition="dodge",this.supportedPositions=["identity","dodge"],this.supportedCoordTypes=["cartesian","flip"],this.scaleConstraints={discreteMainAxis:!0,zeroBaseline:!0},this.legend={suppressWhenSingleItem:!0},this.dataLabelCoordTypes=["cartesian","flip"],this.getDataLabelPlacements=L,this.spatialKind="spanned-buckets",this.highlightStrategy="observation-rerender",this.styleTarget=(0,a.defineGeomStyleTarget)({observation:{vocabulary:H,aesthetics:{fill:"color",alpha:"alpha",size:"size",strokeWidth:"strokeWidth"},rest:{fill:(0,a.token)("geom"),fillAlpha:1,size:V,stroke:(0,a.token)("hoverAffordance"),strokeWidth:W}},parts:{stem:{vocabulary:D,aesthetics:{stroke:"color"},rest:{stroke:(0,a.token)("geom"),alpha:1,strokeWidth:j,dashArray:[]}}}}),this.resolveAnchorPosition=(r,{coordSystem:t})=>{const o=(0,a.readMainAxis)(t),i=x(r,o);return i===null?null:o==="x"?{x:i.band,y:i.tip}:{x:i.tip,y:i.band}}}compile({data:e}){const r=e.hasVariable(a.POSITION_VARIABLES.yMin)?e:e.addConstantVariable(a.POSITION_VARIABLES.yMin,"numeric",0),t=B/2;return{data:r.addConstantVariable(a.POSITION_VARIABLES.xMin,"numeric",-.35).addConstantVariable(a.POSITION_VARIABLES.xMax,"numeric",t),mapping:{}}}},T=({layer:e,coordSystem:r,panelRect:t,styleReaders:o})=>{const i=(0,a.readMainAxis)(r),s=p(e.data,i),n=(0,a.buildDotsEditOutlineShapes)(s.map(d=>({center:b(d.band,d.tip,i,t),size:(o.get("size",d.observation)??0)+(o.get("strokeWidth",d.observation)??0)}))),l=o.part("stem");return[...l===void 0?[]:s.map(d=>w(d,i,t,l)),...n]},w=(e,r,t,o)=>{const i=b(e.band,e.base,r,t),s=b(e.band,e.tip,r,t),n=o.get("strokeWidth",e.observation)??0;return{kind:"stroke",pathData:`M${i.x},${i.y}L${s.x},${s.y}`,width:n}},b=(e,r,t,o)=>{const i=(0,a.composePoint)(t,{main:e,cross:r});return(0,a.scalePointToPanel)((0,a.projectPointCartesian)(i.x,i.y),o)},m=e=>{const r=(0,a.createStableKeyGenerator)(e.data,e.mapping,e.id);return t=>r(t.observation)},E=.4,C=.2,R=1,G=.5,y=({lollipops:e,mainAxis:r,styleReaders:t,getKey:o,hovered:i,shouldAnimateTransitions:s=!1})=>{const n=t.part("stem"),l=i===void 0?void 0:"hovered";return(0,c.jsxs)(c.Fragment,{children:[n&&e.map(d=>(0,c.jsx)(X,{lollipop:d,mainAxis:r,readers:n,state:l,shouldAnimateTransitions:s},o(d))),e.map(d=>(0,c.jsx)(N,{lollipop:d,mainAxis:r,styleReaders:t,state:l,shouldAnimateTransitions:s},o(d))),i?.primary&&(0,c.jsx)(Y,{lollipop:i.primary,mainAxis:r,styleReaders:t})]})},X=({lollipop:e,mainAxis:r,readers:t,state:o,shouldAnimateTransitions:i})=>{const s=(0,a.composePoint)(r,{main:e.band,cross:e.base}),n=(0,a.composePoint)(r,{main:e.band,cross:e.tip}),l=t.get("strokeWidth",e.observation,o)??0,d=t.get("stroke",e.observation,o);return(0,c.jsx)(a.GeomLine,{"data-testid":"lollipop-stem",x1:(0,a.toPercent)((0,a.toViewBoxX)(s.x)),y1:(0,a.toPercent)((0,a.toViewBoxY)(s.y)),x2:(0,a.toPercent)((0,a.toViewBoxX)(n.x)),y2:(0,a.toPercent)((0,a.toViewBoxY)(n.y)),stroke:d===void 0?void 0:(0,a.toPaintColor)(d),strokeOpacity:t.get("alpha",e.observation,o),strokeWidth:l,strokeDasharray:(0,a.toStrokeDasharray)(t.get("dashArray",e.observation,o),l),shouldAnimateTransitions:i})},N=({lollipop:e,mainAxis:r,styleReaders:t,state:o,shouldAnimateTransitions:i})=>{const s=(0,a.composePoint)(r,{main:e.band,cross:e.tip}),n=t.get("fill",e.observation,o);return(0,c.jsx)(a.GeomCircle,{"data-testid":"lollipop-head",cx:(0,a.toPercent)((0,a.toViewBoxX)(s.x)),cy:(0,a.toPercent)((0,a.toViewBoxY)(s.y)),r:I(e,t,o),fill:n===void 0?void 0:(0,a.toPaintColor)(n),opacity:t.get("alpha",e.observation,o),fillOpacity:t.get("fillAlpha",e.observation,o),stroke:t.get("stroke",e.observation,o),strokeOpacity:t.get("strokeAlpha",e.observation,o),strokeWidth:t.get("strokeWidth",e.observation,o),shouldAnimateTransitions:i})},Y=({lollipop:e,mainAxis:r,styleReaders:t})=>{const o=(0,a.composePoint)(r,{main:e.band,cross:e.tip}),i=I(e,t,"hovered"),s=t.get("strokeWidth",e.observation,"hovered")??0,n=Math.max(R,i*E),l=Math.max(G,i*C);return(0,c.jsx)("circle",{"data-testid":"lollipop-hover-ring",cx:(0,a.toPercent)((0,a.toViewBoxX)(o.x)),cy:(0,a.toPercent)((0,a.toViewBoxY)(o.y)),r:i+s/2+l+n/2,fill:"none",stroke:t.get("stroke",e.observation,"hovered"),strokeWidth:n})},I=(e,r,t)=>(r.get("size",e.observation,t)??0)/2,z=({layer:e,sourceLayer:r,mainAxis:t,styleReaders:o})=>(0,c.jsx)(y,{lollipops:(0,u.useMemo)(()=>p(e.data,t),[e.data,t]),mainAxis:t,styleReaders:o,getKey:(0,u.useMemo)(()=>m(r),[r])}),K=({layer:e,primary:r,siblings:t,mainAxis:o,styleReaders:i})=>(0,c.jsx)("g",{"data-testid":"hovered-lollipops",children:(0,c.jsx)(y,{lollipops:p([r,...t].map(s=>s.observation),o),mainAxis:o,styleReaders:i,getKey:(0,u.useMemo)(()=>m(e),[e]),hovered:{primary:x(r.observation,o)}})}),$=({layer:e,mainAxis:r,styleReaders:t,shouldAnimateTransitions:o,intro:i})=>{const s=(0,c.jsx)(y,{lollipops:(0,u.useMemo)(()=>p(e.data,r),[e.data,r]),mainAxis:r,styleReaders:t,getKey:(0,u.useMemo)(()=>m(e),[e]),shouldAnimateTransitions:o});return i?.type==="fade"?(0,c.jsx)(a.IntroFade,{intro:i,children:s}):s},q=(0,a.defineGeomRenderer)(new _,{coord:"cartesian",swatchShape:"circle",guideMode:"band",render:({layer:e,coordSystem:r,styleReaders:t,shouldAnimateTransitions:o,intro:i})=>(0,c.jsx)($,{layer:e,mainAxis:(0,a.readMainAxis)(r),styleReaders:t,shouldAnimateTransitions:o,intro:i}),renderHighlight:({layer:e,sourceLayer:r,coordSystem:t,styleReaders:o})=>(0,c.jsx)(z,{layer:e,sourceLayer:r,mainAxis:(0,a.readMainAxis)(t),styleReaders:o}),renderHover:({layer:e,primary:r,group:t,related:o,coordSystem:i,styleReaders:s})=>(0,c.jsx)(K,{layer:e,primary:r,siblings:[...t,...o],mainAxis:(0,a.readMainAxis)(i),styleReaders:s}),renderHoverCompanions:()=>null,getEditOutlineShapes:T});exports.LollipopGeom=_;exports.lollipop=q;
|
package/dist/index.mjs
CHANGED
|
@@ -1,35 +1,35 @@
|
|
|
1
|
-
import { Geom as
|
|
2
|
-
import { useMemo as
|
|
3
|
-
import { Fragment as
|
|
4
|
-
var L = (t,
|
|
5
|
-
const e =
|
|
6
|
-
return e === null ||
|
|
1
|
+
import { Geom as E, GeomCircle as T, GeomLine as G, IntroFade as R, POSITION_VARIABLES as b, buildDotsEditOutlineShapes as V, buildPanelAnchorBox as w, composePoint as v, createStableKeyGenerator as B, defineGeomRenderer as z, defineGeomStyleTarget as K, getX as S, getXMax as N, getXMin as X, getY as D, getYMax as Y, getYMin as j, projectPointCartesian as $, readMainAxis as c, resolveAnchoredLabelCenter as F, scalePointToPanel as J, toPaintColor as M, toPercent as l, toStrokeDasharray as U, toViewBoxX as m, toViewBoxY as f, token as x } from "@graphysdk/react";
|
|
2
|
+
import { useMemo as u } from "react";
|
|
3
|
+
import { Fragment as Z, jsx as h, jsxs as q } from "react/jsx-runtime";
|
|
4
|
+
var L = (t, r) => {
|
|
5
|
+
const e = r === "x" ? S(t) : D(t), a = r === "x" ? j(t) : X(t), o = r === "x" ? Y(t) ?? D(t) : N(t) ?? S(t);
|
|
6
|
+
return e === null || a === null || o === null ? null : {
|
|
7
7
|
observation: t,
|
|
8
8
|
band: e,
|
|
9
|
-
base:
|
|
9
|
+
base: a,
|
|
10
10
|
tip: o
|
|
11
11
|
};
|
|
12
|
-
}, g = (t,
|
|
12
|
+
}, g = (t, r) => {
|
|
13
13
|
const e = [];
|
|
14
|
-
for (const
|
|
15
|
-
const o = L(
|
|
14
|
+
for (const a of t) {
|
|
15
|
+
const o = L(a, r);
|
|
16
16
|
o !== null && e.push(o);
|
|
17
17
|
}
|
|
18
18
|
return e;
|
|
19
|
-
},
|
|
20
|
-
const
|
|
19
|
+
}, Q = (t) => t.tip < t.base, tt = (t) => {
|
|
20
|
+
const r = [];
|
|
21
21
|
if (!t.layer.dataLabels.showDataLabels) return {
|
|
22
|
-
labels:
|
|
22
|
+
labels: r,
|
|
23
23
|
droppedCount: 0
|
|
24
24
|
};
|
|
25
|
-
const { position: e, justify:
|
|
25
|
+
const { position: e, justify: a, align: o, offset: i } = t.layer.dataLabels, s = a === "panel-start" || a === "panel-end", d = c(t.coordSystem), n = w(t.panelRect);
|
|
26
26
|
for (const p of g(t.layer.data, d)) {
|
|
27
27
|
const y = t.formatLabel(p.observation);
|
|
28
28
|
if (y === "") continue;
|
|
29
|
-
const { width: W, height: I } = t.measureDataLabel("observation", "outside", y), O = (t.styleReaders.get("size", p.observation) ?? 0) / 2, H =
|
|
29
|
+
const { width: W, height: I } = t.measureDataLabel("observation", "outside", y), O = (t.styleReaders.get("size", p.observation) ?? 0) / 2, H = v(d, {
|
|
30
30
|
main: p.band,
|
|
31
31
|
cross: p.tip
|
|
32
|
-
}), k =
|
|
32
|
+
}), k = F({
|
|
33
33
|
box: {
|
|
34
34
|
x: H.x * t.panelRect.width,
|
|
35
35
|
y: (1 - H.y) * t.panelRect.height,
|
|
@@ -37,16 +37,16 @@ var L = (t, a) => {
|
|
|
37
37
|
height: 0
|
|
38
38
|
},
|
|
39
39
|
panel: n,
|
|
40
|
-
orientation:
|
|
40
|
+
orientation: et(d),
|
|
41
41
|
placement: e === "auto" ? "outside" : e,
|
|
42
|
-
justify: e === "auto" ?
|
|
42
|
+
justify: e === "auto" ? at(p) : a,
|
|
43
43
|
align: o,
|
|
44
44
|
offset: s ? i : i + O,
|
|
45
45
|
alignOffset: i + O,
|
|
46
46
|
labelWidth: W,
|
|
47
47
|
labelHeight: I
|
|
48
48
|
});
|
|
49
|
-
|
|
49
|
+
r.push({
|
|
50
50
|
layerId: t.layer.id,
|
|
51
51
|
x: k.x,
|
|
52
52
|
y: k.y,
|
|
@@ -59,24 +59,24 @@ var L = (t, a) => {
|
|
|
59
59
|
});
|
|
60
60
|
}
|
|
61
61
|
return {
|
|
62
|
-
labels:
|
|
62
|
+
labels: r,
|
|
63
63
|
droppedCount: 0
|
|
64
64
|
};
|
|
65
|
-
},
|
|
65
|
+
}, et = (t) => t === "x" ? {
|
|
66
66
|
valueAxis: "y",
|
|
67
67
|
valueDirectionSign: -1
|
|
68
68
|
} : {
|
|
69
69
|
valueAxis: "x",
|
|
70
70
|
valueDirectionSign: 1
|
|
71
|
-
},
|
|
71
|
+
}, at = (t) => Q(t) ? "start" : "end", rt = 10, ot = 1, it = 2, st = 0.7, nt = {
|
|
72
72
|
size: "pixels",
|
|
73
73
|
strokeWidth: "pixels"
|
|
74
|
-
},
|
|
74
|
+
}, dt = {
|
|
75
75
|
stroke: "color",
|
|
76
76
|
alpha: "unitInterval",
|
|
77
77
|
strokeWidth: "pixels",
|
|
78
78
|
dashArray: "dashArray"
|
|
79
|
-
}, ht = class extends
|
|
79
|
+
}, ht = class extends E {
|
|
80
80
|
constructor(...t) {
|
|
81
81
|
super(...t), this.type = "lollipop", this.defaultParams = {}, this.positionRoles = [
|
|
82
82
|
{
|
|
@@ -101,9 +101,9 @@ var L = (t, a) => {
|
|
|
101
101
|
}], this.defaultPosition = "dodge", this.supportedPositions = ["identity", "dodge"], this.supportedCoordTypes = ["cartesian", "flip"], this.scaleConstraints = {
|
|
102
102
|
discreteMainAxis: !0,
|
|
103
103
|
zeroBaseline: !0
|
|
104
|
-
}, this.legend = { suppressWhenSingleItem: !0 }, this.dataLabelCoordTypes = ["cartesian", "flip"], this.getDataLabelPlacements =
|
|
104
|
+
}, this.legend = { suppressWhenSingleItem: !0 }, this.dataLabelCoordTypes = ["cartesian", "flip"], this.getDataLabelPlacements = tt, this.spatialKind = "spanned-buckets", this.highlightStrategy = "observation-rerender", this.styleTarget = K({
|
|
105
105
|
observation: {
|
|
106
|
-
vocabulary:
|
|
106
|
+
vocabulary: nt,
|
|
107
107
|
aesthetics: {
|
|
108
108
|
fill: "color",
|
|
109
109
|
alpha: "alpha",
|
|
@@ -113,24 +113,24 @@ var L = (t, a) => {
|
|
|
113
113
|
rest: {
|
|
114
114
|
fill: x("geom"),
|
|
115
115
|
fillAlpha: 1,
|
|
116
|
-
size:
|
|
116
|
+
size: rt,
|
|
117
117
|
stroke: x("hoverAffordance"),
|
|
118
|
-
strokeWidth:
|
|
118
|
+
strokeWidth: ot
|
|
119
119
|
}
|
|
120
120
|
},
|
|
121
121
|
parts: { stem: {
|
|
122
|
-
vocabulary:
|
|
122
|
+
vocabulary: dt,
|
|
123
123
|
aesthetics: { stroke: "color" },
|
|
124
124
|
rest: {
|
|
125
125
|
stroke: x("geom"),
|
|
126
126
|
alpha: 1,
|
|
127
|
-
strokeWidth:
|
|
127
|
+
strokeWidth: it,
|
|
128
128
|
dashArray: []
|
|
129
129
|
}
|
|
130
130
|
} }
|
|
131
|
-
}), this.resolveAnchorPosition = (
|
|
132
|
-
const
|
|
133
|
-
return o === null ? null :
|
|
131
|
+
}), this.resolveAnchorPosition = (r, { coordSystem: e }) => {
|
|
132
|
+
const a = c(e), o = L(r, a);
|
|
133
|
+
return o === null ? null : a === "x" ? {
|
|
134
134
|
x: o.band,
|
|
135
135
|
y: o.tip
|
|
136
136
|
} : {
|
|
@@ -140,163 +140,163 @@ var L = (t, a) => {
|
|
|
140
140
|
};
|
|
141
141
|
}
|
|
142
142
|
compile({ data: t }) {
|
|
143
|
-
const
|
|
143
|
+
const r = t.hasVariable(b.yMin) ? t : t.addConstantVariable(b.yMin, "numeric", 0), e = st / 2;
|
|
144
144
|
return {
|
|
145
|
-
data:
|
|
145
|
+
data: r.addConstantVariable(b.xMin, "numeric", -0.35).addConstantVariable(b.xMax, "numeric", e),
|
|
146
146
|
mapping: {}
|
|
147
147
|
};
|
|
148
148
|
}
|
|
149
|
-
},
|
|
150
|
-
const o = c(
|
|
149
|
+
}, lt = ({ layer: t, coordSystem: r, panelRect: e, styleReaders: a }) => {
|
|
150
|
+
const o = c(r), i = g(t.data, o), s = V(i.map((n) => ({
|
|
151
151
|
center: _(n.band, n.tip, o, e),
|
|
152
|
-
size: (
|
|
153
|
-
}))), d =
|
|
154
|
-
return [...d === void 0 ? [] : i.map((n) =>
|
|
155
|
-
},
|
|
156
|
-
const o = _(t.band, t.base,
|
|
152
|
+
size: (a.get("size", n.observation) ?? 0) + (a.get("strokeWidth", n.observation) ?? 0)
|
|
153
|
+
}))), d = a.part("stem");
|
|
154
|
+
return [...d === void 0 ? [] : i.map((n) => ct(n, o, e, d)), ...s];
|
|
155
|
+
}, ct = (t, r, e, a) => {
|
|
156
|
+
const o = _(t.band, t.base, r, e), i = _(t.band, t.tip, r, e), s = a.get("strokeWidth", t.observation) ?? 0;
|
|
157
157
|
return {
|
|
158
158
|
kind: "stroke",
|
|
159
159
|
pathData: `M${o.x},${o.y}L${i.x},${i.y}`,
|
|
160
160
|
width: s
|
|
161
161
|
};
|
|
162
|
-
}, _ = (t,
|
|
163
|
-
const o =
|
|
162
|
+
}, _ = (t, r, e, a) => {
|
|
163
|
+
const o = v(e, {
|
|
164
164
|
main: t,
|
|
165
|
-
cross:
|
|
165
|
+
cross: r
|
|
166
166
|
});
|
|
167
|
-
return
|
|
167
|
+
return J($(o.x, o.y), a);
|
|
168
168
|
}, A = (t) => {
|
|
169
|
-
const
|
|
170
|
-
return (e) =>
|
|
171
|
-
},
|
|
169
|
+
const r = B(t.data, t.mapping, t.id);
|
|
170
|
+
return (e) => r(e.observation);
|
|
171
|
+
}, vt = 0.4, pt = 0.2, ut = 1, gt = 0.5, P = ({ lollipops: t, mainAxis: r, styleReaders: e, getKey: a, hovered: o, shouldAnimateTransitions: i = !1 }) => {
|
|
172
172
|
const s = e.part("stem"), d = o === void 0 ? void 0 : "hovered";
|
|
173
|
-
return /* @__PURE__ */
|
|
174
|
-
s && t.map((n) => /* @__PURE__ */
|
|
173
|
+
return /* @__PURE__ */ q(Z, { children: [
|
|
174
|
+
s && t.map((n) => /* @__PURE__ */ h(bt, {
|
|
175
175
|
lollipop: n,
|
|
176
|
-
mainAxis:
|
|
176
|
+
mainAxis: r,
|
|
177
177
|
readers: s,
|
|
178
178
|
state: d,
|
|
179
179
|
shouldAnimateTransitions: i
|
|
180
|
-
},
|
|
181
|
-
t.map((n) => /* @__PURE__ */
|
|
180
|
+
}, a(n))),
|
|
181
|
+
t.map((n) => /* @__PURE__ */ h(mt, {
|
|
182
182
|
lollipop: n,
|
|
183
|
-
mainAxis:
|
|
183
|
+
mainAxis: r,
|
|
184
184
|
styleReaders: e,
|
|
185
185
|
state: d,
|
|
186
186
|
shouldAnimateTransitions: i
|
|
187
|
-
},
|
|
188
|
-
o?.primary && /* @__PURE__ */
|
|
187
|
+
}, a(n))),
|
|
188
|
+
o?.primary && /* @__PURE__ */ h(ft, {
|
|
189
189
|
lollipop: o.primary,
|
|
190
|
-
mainAxis:
|
|
190
|
+
mainAxis: r,
|
|
191
191
|
styleReaders: e
|
|
192
192
|
})
|
|
193
193
|
] });
|
|
194
|
-
},
|
|
195
|
-
const i =
|
|
194
|
+
}, bt = ({ lollipop: t, mainAxis: r, readers: e, state: a, shouldAnimateTransitions: o }) => {
|
|
195
|
+
const i = v(r, {
|
|
196
196
|
main: t.band,
|
|
197
197
|
cross: t.base
|
|
198
|
-
}), s =
|
|
198
|
+
}), s = v(r, {
|
|
199
199
|
main: t.band,
|
|
200
200
|
cross: t.tip
|
|
201
|
-
}), d = e.get("strokeWidth", t.observation,
|
|
202
|
-
return /* @__PURE__ */
|
|
201
|
+
}), d = e.get("strokeWidth", t.observation, a) ?? 0, n = e.get("stroke", t.observation, a);
|
|
202
|
+
return /* @__PURE__ */ h(G, {
|
|
203
203
|
"data-testid": "lollipop-stem",
|
|
204
|
-
x1:
|
|
205
|
-
y1:
|
|
206
|
-
x2:
|
|
207
|
-
y2:
|
|
208
|
-
stroke: n === void 0 ? void 0 :
|
|
209
|
-
strokeOpacity: e.get("alpha", t.observation,
|
|
204
|
+
x1: l(m(i.x)),
|
|
205
|
+
y1: l(f(i.y)),
|
|
206
|
+
x2: l(m(s.x)),
|
|
207
|
+
y2: l(f(s.y)),
|
|
208
|
+
stroke: n === void 0 ? void 0 : M(n),
|
|
209
|
+
strokeOpacity: e.get("alpha", t.observation, a),
|
|
210
210
|
strokeWidth: d,
|
|
211
|
-
strokeDasharray:
|
|
211
|
+
strokeDasharray: U(e.get("dashArray", t.observation, a), d),
|
|
212
212
|
shouldAnimateTransitions: o
|
|
213
213
|
});
|
|
214
|
-
},
|
|
215
|
-
const i =
|
|
214
|
+
}, mt = ({ lollipop: t, mainAxis: r, styleReaders: e, state: a, shouldAnimateTransitions: o }) => {
|
|
215
|
+
const i = v(r, {
|
|
216
216
|
main: t.band,
|
|
217
217
|
cross: t.tip
|
|
218
|
-
}), s = e.get("fill", t.observation,
|
|
219
|
-
return /* @__PURE__ */
|
|
218
|
+
}), s = e.get("fill", t.observation, a);
|
|
219
|
+
return /* @__PURE__ */ h(T, {
|
|
220
220
|
"data-testid": "lollipop-head",
|
|
221
|
-
cx:
|
|
222
|
-
cy:
|
|
223
|
-
r:
|
|
224
|
-
fill: s === void 0 ? void 0 :
|
|
225
|
-
opacity: e.get("alpha", t.observation,
|
|
226
|
-
fillOpacity: e.get("fillAlpha", t.observation,
|
|
227
|
-
stroke: e.get("stroke", t.observation,
|
|
228
|
-
strokeOpacity: e.get("strokeAlpha", t.observation,
|
|
229
|
-
strokeWidth: e.get("strokeWidth", t.observation,
|
|
221
|
+
cx: l(m(i.x)),
|
|
222
|
+
cy: l(f(i.y)),
|
|
223
|
+
r: C(t, e, a),
|
|
224
|
+
fill: s === void 0 ? void 0 : M(s),
|
|
225
|
+
opacity: e.get("alpha", t.observation, a),
|
|
226
|
+
fillOpacity: e.get("fillAlpha", t.observation, a),
|
|
227
|
+
stroke: e.get("stroke", t.observation, a),
|
|
228
|
+
strokeOpacity: e.get("strokeAlpha", t.observation, a),
|
|
229
|
+
strokeWidth: e.get("strokeWidth", t.observation, a),
|
|
230
230
|
shouldAnimateTransitions: o
|
|
231
231
|
});
|
|
232
|
-
},
|
|
233
|
-
const
|
|
232
|
+
}, ft = ({ lollipop: t, mainAxis: r, styleReaders: e }) => {
|
|
233
|
+
const a = v(r, {
|
|
234
234
|
main: t.band,
|
|
235
235
|
cross: t.tip
|
|
236
|
-
}), o =
|
|
237
|
-
return /* @__PURE__ */
|
|
236
|
+
}), o = C(t, e, "hovered"), i = e.get("strokeWidth", t.observation, "hovered") ?? 0, s = Math.max(ut, o * vt), d = Math.max(gt, o * pt);
|
|
237
|
+
return /* @__PURE__ */ h("circle", {
|
|
238
238
|
"data-testid": "lollipop-hover-ring",
|
|
239
|
-
cx:
|
|
240
|
-
cy:
|
|
239
|
+
cx: l(m(a.x)),
|
|
240
|
+
cy: l(f(a.y)),
|
|
241
241
|
r: o + i / 2 + d + s / 2,
|
|
242
242
|
fill: "none",
|
|
243
243
|
stroke: e.get("stroke", t.observation, "hovered"),
|
|
244
244
|
strokeWidth: s
|
|
245
245
|
});
|
|
246
|
-
},
|
|
247
|
-
lollipops:
|
|
246
|
+
}, C = (t, r, e) => (r.get("size", t.observation, e) ?? 0) / 2, yt = ({ layer: t, sourceLayer: r, mainAxis: e, styleReaders: a }) => /* @__PURE__ */ h(P, {
|
|
247
|
+
lollipops: u(() => g(t.data, e), [t.data, e]),
|
|
248
248
|
mainAxis: e,
|
|
249
|
-
styleReaders:
|
|
250
|
-
getKey:
|
|
251
|
-
}),
|
|
249
|
+
styleReaders: a,
|
|
250
|
+
getKey: u(() => A(r), [r])
|
|
251
|
+
}), kt = ({ layer: t, primary: r, siblings: e, mainAxis: a, styleReaders: o }) => /* @__PURE__ */ h("g", {
|
|
252
252
|
"data-testid": "hovered-lollipops",
|
|
253
|
-
children: /* @__PURE__ */
|
|
254
|
-
lollipops: g([
|
|
255
|
-
mainAxis:
|
|
253
|
+
children: /* @__PURE__ */ h(P, {
|
|
254
|
+
lollipops: g([r, ...e].map((i) => i.observation), a),
|
|
255
|
+
mainAxis: a,
|
|
256
256
|
styleReaders: o,
|
|
257
|
-
getKey:
|
|
258
|
-
hovered: { primary: L(
|
|
257
|
+
getKey: u(() => A(t), [t]),
|
|
258
|
+
hovered: { primary: L(r.observation, a) }
|
|
259
259
|
})
|
|
260
|
-
}),
|
|
261
|
-
const i = /* @__PURE__ */
|
|
262
|
-
lollipops:
|
|
263
|
-
mainAxis:
|
|
260
|
+
}), xt = ({ layer: t, mainAxis: r, styleReaders: e, shouldAnimateTransitions: a, intro: o }) => {
|
|
261
|
+
const i = /* @__PURE__ */ h(P, {
|
|
262
|
+
lollipops: u(() => g(t.data, r), [t.data, r]),
|
|
263
|
+
mainAxis: r,
|
|
264
264
|
styleReaders: e,
|
|
265
|
-
getKey:
|
|
266
|
-
shouldAnimateTransitions:
|
|
265
|
+
getKey: u(() => A(t), [t]),
|
|
266
|
+
shouldAnimateTransitions: a
|
|
267
267
|
});
|
|
268
|
-
return o?.type === "fade" ? /* @__PURE__ */
|
|
268
|
+
return o?.type === "fade" ? /* @__PURE__ */ h(R, {
|
|
269
269
|
intro: o,
|
|
270
270
|
children: i
|
|
271
271
|
}) : i;
|
|
272
|
-
},
|
|
272
|
+
}, Pt = z(new ht(), {
|
|
273
273
|
coord: "cartesian",
|
|
274
274
|
swatchShape: "circle",
|
|
275
275
|
guideMode: "band",
|
|
276
|
-
render: ({ layer: t, coordSystem:
|
|
276
|
+
render: ({ layer: t, coordSystem: r, styleReaders: e, shouldAnimateTransitions: a, intro: o }) => /* @__PURE__ */ h(xt, {
|
|
277
277
|
layer: t,
|
|
278
|
-
mainAxis: c(
|
|
278
|
+
mainAxis: c(r),
|
|
279
279
|
styleReaders: e,
|
|
280
|
-
shouldAnimateTransitions:
|
|
280
|
+
shouldAnimateTransitions: a,
|
|
281
281
|
intro: o
|
|
282
282
|
}),
|
|
283
|
-
renderHighlight: ({ layer: t, sourceLayer:
|
|
283
|
+
renderHighlight: ({ layer: t, sourceLayer: r, coordSystem: e, styleReaders: a }) => /* @__PURE__ */ h(yt, {
|
|
284
284
|
layer: t,
|
|
285
|
-
sourceLayer:
|
|
285
|
+
sourceLayer: r,
|
|
286
286
|
mainAxis: c(e),
|
|
287
|
-
styleReaders:
|
|
287
|
+
styleReaders: a
|
|
288
288
|
}),
|
|
289
|
-
renderHover: ({ layer: t, primary:
|
|
289
|
+
renderHover: ({ layer: t, primary: r, group: e, related: a, coordSystem: o, styleReaders: i }) => /* @__PURE__ */ h(kt, {
|
|
290
290
|
layer: t,
|
|
291
|
-
primary:
|
|
292
|
-
siblings: [...e, ...
|
|
291
|
+
primary: r,
|
|
292
|
+
siblings: [...e, ...a],
|
|
293
293
|
mainAxis: c(o),
|
|
294
294
|
styleReaders: i
|
|
295
295
|
}),
|
|
296
296
|
renderHoverCompanions: () => null,
|
|
297
|
-
getEditOutlineShapes:
|
|
297
|
+
getEditOutlineShapes: lt
|
|
298
298
|
});
|
|
299
299
|
export {
|
|
300
300
|
ht as LollipopGeom,
|
|
301
|
-
|
|
301
|
+
Pt as lollipop
|
|
302
302
|
};
|
|
@@ -11,7 +11,7 @@ export interface Lollipop {
|
|
|
11
11
|
}
|
|
12
12
|
/**
|
|
13
13
|
* Reads where a lollipop sits. The flip is already baked into the position columns, so under `coord.flip()`
|
|
14
|
-
* the
|
|
14
|
+
* the stem stands at `y` and runs `xMin` to `xMax`; the main axis says which is which.
|
|
15
15
|
*/
|
|
16
16
|
export declare const readLollipop: (observation: Observation, mainAxis: MainAxis) => Lollipop | null;
|
|
17
17
|
/** Reads every lollipop of a layer, skipping an observation with no value to stand on. */
|
package/package.json
CHANGED
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
"grammar-of-graphics",
|
|
13
13
|
"lollipop"
|
|
14
14
|
],
|
|
15
|
-
"version": "0.1.
|
|
15
|
+
"version": "0.1.1-beta.1790864848006",
|
|
16
16
|
"type": "module",
|
|
17
17
|
"sideEffects": false,
|
|
18
18
|
"types": "./dist/index.d.ts",
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
},
|
|
32
32
|
"peerDependencies": {
|
|
33
33
|
"react": "^19.0.0",
|
|
34
|
-
"@graphysdk/react": "^1.9.0-beta.
|
|
34
|
+
"@graphysdk/react": "^1.9.0-beta.1790864848006"
|
|
35
35
|
},
|
|
36
36
|
"devDependencies": {
|
|
37
37
|
"@testing-library/react": "^16.3.1",
|
|
@@ -43,11 +43,11 @@
|
|
|
43
43
|
"vite": "^8.1.5",
|
|
44
44
|
"vite-plugin-dts": "^4.5.4",
|
|
45
45
|
"vitest": "^4.1.11",
|
|
46
|
-
"@graphysdk/react": "1.9.0-beta.
|
|
46
|
+
"@graphysdk/react": "1.9.0-beta.1790864848006",
|
|
47
|
+
"@graphysdk/viz-engine": "1.9.0-beta.1790864848006",
|
|
48
|
+
"@graphytools/eslint-config": "0.0.1",
|
|
47
49
|
"@graphytools/typescript-config": "0.0.1",
|
|
48
|
-
"@graphytools/vitest-config": "1.0.0"
|
|
49
|
-
"@graphysdk/viz-engine": "1.8.0",
|
|
50
|
-
"@graphytools/eslint-config": "0.0.1"
|
|
50
|
+
"@graphytools/vitest-config": "1.0.0"
|
|
51
51
|
},
|
|
52
52
|
"publishConfig": {
|
|
53
53
|
"access": "public"
|