@carbon/charts 1.6.0 → 1.6.1
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/CHANGELOG.md +11 -0
- package/bundle.js +1 -1
- package/components/axes/hover-axis.js +29 -21
- package/components/axes/hover-axis.js.map +1 -1
- package/package.json +1 -1
- package/tsconfig.tsbuildinfo +1 -1
|
@@ -89,27 +89,6 @@ var HoverAxis = /** @class */ (function (_super) {
|
|
|
89
89
|
.attr('width', width + Configuration.axis.hover.rectanglePadding * 2)
|
|
90
90
|
.attr('height', height)
|
|
91
91
|
.lower();
|
|
92
|
-
// Add keyboard event listeners to each group element
|
|
93
|
-
g.on('keydown', function (event) {
|
|
94
|
-
// Choose specific arrow key depending on the axis
|
|
95
|
-
if (axisPosition === AxisPositions.LEFT ||
|
|
96
|
-
axisPosition === AxisPositions.RIGHT) {
|
|
97
|
-
if (event.key && event.key === 'ArrowUp') {
|
|
98
|
-
self.goNext(this, event);
|
|
99
|
-
}
|
|
100
|
-
else if (event.key && event.key === 'ArrowDown') {
|
|
101
|
-
self.goPrevious(this, event);
|
|
102
|
-
}
|
|
103
|
-
}
|
|
104
|
-
else {
|
|
105
|
-
if (event.key && event.key === 'ArrowLeft') {
|
|
106
|
-
self.goPrevious(this, event);
|
|
107
|
-
}
|
|
108
|
-
else if (event.key && event.key === 'ArrowRight') {
|
|
109
|
-
self.goNext(this, event);
|
|
110
|
-
}
|
|
111
|
-
}
|
|
112
|
-
});
|
|
113
92
|
});
|
|
114
93
|
// Add event listeners to element group
|
|
115
94
|
this.addEventListeners();
|
|
@@ -198,6 +177,35 @@ var HoverAxis = /** @class */ (function (_super) {
|
|
|
198
177
|
element: select(this),
|
|
199
178
|
datum: select(this).select('text').datum(),
|
|
200
179
|
});
|
|
180
|
+
})
|
|
181
|
+
.on('keydown', function (event) {
|
|
182
|
+
// Hide the tooltip when `Escape` is pressed, but keep focus
|
|
183
|
+
if (event.key && event.key === 'Escape') {
|
|
184
|
+
self.services.events.dispatchEvent(Events.Tooltip.HIDE);
|
|
185
|
+
self.services.events.dispatchEvent(Events.Axis.LABEL_BLUR, {
|
|
186
|
+
event: event,
|
|
187
|
+
element: select(this),
|
|
188
|
+
datum: select(this).select('text').datum(),
|
|
189
|
+
});
|
|
190
|
+
}
|
|
191
|
+
// Choose specific arrow key depending on the axis
|
|
192
|
+
if (axisPosition === AxisPositions.LEFT ||
|
|
193
|
+
axisPosition === AxisPositions.RIGHT) {
|
|
194
|
+
if (event.key && event.key === 'ArrowUp') {
|
|
195
|
+
self.goNext(this, event);
|
|
196
|
+
}
|
|
197
|
+
else if (event.key && event.key === 'ArrowDown') {
|
|
198
|
+
self.goPrevious(this, event);
|
|
199
|
+
}
|
|
200
|
+
}
|
|
201
|
+
else {
|
|
202
|
+
if (event.key && event.key === 'ArrowLeft') {
|
|
203
|
+
self.goPrevious(this, event);
|
|
204
|
+
}
|
|
205
|
+
else if (event.key && event.key === 'ArrowRight') {
|
|
206
|
+
self.goNext(this, event);
|
|
207
|
+
}
|
|
208
|
+
}
|
|
201
209
|
});
|
|
202
210
|
};
|
|
203
211
|
// Focus on the next HTML element sibling
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"hover-axis.js","sourceRoot":"","sources":["hover-axis.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AAAA,mBAAmB;AACnB,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAC;AAC9B,OAAO,EAAE,aAAa,EAAE,MAAM,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAErE,OAAO,EAAE,QAAQ,EAAE,MAAM,gBAAgB,CAAC;AAC1C,OAAO,EAAE,KAAK,EAAE,MAAM,aAAa,CAAC;AACpC,OAAO,KAAK,aAAa,MAAM,qBAAqB,CAAC;AAErD,aAAa;AACb,OAAO,EAAE,MAAM,EAAE,MAAM,cAAc,CAAC;AAEtC;IAA+B,6BAAI;IAClC,mBAAY,KAAiB,EAAE,QAAa,EAAE,OAAa;eAC1D,kBAAM,KAAK,EAAE,QAAQ,EAAE,OAAO,CAAC;IAChC,CAAC;IAED,0BAAM,GAAN,UAAO,OAAc;QAAd,wBAAA,EAAA,cAAc;QACpB,iBAAM,MAAM,YAAC,OAAO,CAAC,CAAC;QAEtB,6DAA6D;QAC7D,iBAAM,OAAO,WAAE,CAAC;QAER,IAAA,oCAAsB,CAAkB;QAChD,IAAM,GAAG,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC;QACzC,IAAM,SAAS,GAAG,QAAQ,CAAC,cAAc,CACxC,GAAG,EACH,YAAU,YAAc,CACxB,CAAC;QAEF,IAAM,IAAI,GAAG,IAAI,CAAC;QAClB,SAAS,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,IAAI,CAAC,UAAU,CAAC,EAAE,KAAK;YACpD,IAAM,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC;YACvB,CAAC,CAAC,OAAO,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC,IAAI,CACjC,UAAU,EACV,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CACpB,CAAC;YACF,IAAM,QAAQ,GAAG,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;YAC5B,IAAA;;cAEJ,EAFM,gBAAK,EAAE,kBAEb,CAAC;YAEH,IAAM,SAAS,GAAG,QAAQ,CAAC,cAAc,CAAC,CAAC,EAAE,kBAAkB,CAAC,CAAC;YAEjE,IAAI,CAAC,GAAG,CAAC,EACR,CAAC,GAAG,CAAC,CAAC;YAEP,qFAAqF;YACrF,gBAAgB;YAChB,QAAQ,YAAY,EAAE;gBACrB,KAAK,aAAa,CAAC,IAAI;oBACtB,CAAC,GAAG,CAAC,KAAK,GAAG,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;oBACxC,CAAC,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;oBAClB,MAAM;gBACP,KAAK,aAAa,CAAC,KAAK;oBACvB,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;oBACzC,CAAC,GAAG,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;oBAClB,MAAM;gBACP,KAAK,aAAa,CAAC,GAAG;oBACrB,CAAC,GAAG,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;oBACjB,CAAC,GAAG,CAAC,MAAM,GAAG,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC;oBAE7C,IAAI,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,EAAE;wBAClC,CAAC,GAAG,CAAC,CAAC;wBACN,SAAS,CAAC,IAAI,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC;qBAC3C;oBACD,MAAM;gBACP,KAAK,aAAa,CAAC,MAAM;oBACxB,CAAC,GAAG,CAAC,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC;oBACjB,CAAC,GAAG,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC;oBAEnB,IAAI,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,EAAE;wBAClC,CAAC,GAAG,CAAC,KAAK,CAAC;wBACX,SAAS,CAAC,IAAI,CAAC,WAAW,EAAE,aAAa,CAAC,CAAC;qBAC3C;oBACD,MAAM;aACP;YAED,6DAA6D;YAC7D,+BAA+B;YAC/B,SAAS;iBACP,IAAI,CAAC,GAAG,EAAE,CAAC,GAAG,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,CAAC;iBACxD,IAAI,CAAC,GAAG,EAAE,CAAC,CAAC;iBACZ,IAAI,CACJ,OAAO,EACP,KAAK,GAAG,aAAa,CAAC,IAAI,CAAC,KAAK,CAAC,gBAAgB,GAAG,CAAC,CACrD;iBACA,IAAI,CAAC,QAAQ,EAAE,MAAM,CAAC;iBACtB,KAAK,EAAE,CAAC;YAEV,qDAAqD;YACrD,CAAC,CAAC,EAAE,CAAC,SAAS,EAAE,UAAU,KAAoB;gBAC7C,kDAAkD;gBAClD,IACC,YAAY,KAAK,aAAa,CAAC,IAAI;oBACnC,YAAY,KAAK,aAAa,CAAC,KAAK,EACnC;oBACD,IAAI,KAAK,CAAC,GAAG,IAAI,KAAK,CAAC,GAAG,KAAK,SAAS,EAAE;wBACzC,IAAI,CAAC,MAAM,CAAC,IAAmB,EAAE,KAAK,CAAC,CAAC;qBACxC;yBAAM,IAAI,KAAK,CAAC,GAAG,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,EAAE;wBAClD,IAAI,CAAC,UAAU,CAAC,IAAmB,EAAE,KAAK,CAAC,CAAC;qBAC5C;iBACD;qBAAM;oBACN,IAAI,KAAK,CAAC,GAAG,IAAI,KAAK,CAAC,GAAG,KAAK,WAAW,EAAE;wBAC3C,IAAI,CAAC,UAAU,CAAC,IAAmB,EAAE,KAAK,CAAC,CAAC;qBAC5C;yBAAM,IAAI,KAAK,CAAC,GAAG,IAAI,KAAK,CAAC,GAAG,KAAK,YAAY,EAAE;wBACnD,IAAI,CAAC,MAAM,CAAC,IAAmB,EAAE,KAAK,CAAC,CAAC;qBACxC;iBACD;YACF,CAAC,CAAC,CAAC;QACJ,CAAC,CAAC,CAAC;QAEH,uCAAuC;QACvC,IAAI,CAAC,iBAAiB,EAAE,CAAC;IAC1B,CAAC;IAED,qCAAiB,GAAjB;QACC,IAAM,GAAG,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC;QACjC,IAAA,oCAAsB,CAAkB;QAChD,IAAM,SAAS,GAAG,QAAQ,CAAC,cAAc,CACxC,GAAG,EACH,YAAU,YAAc,CACxB,CAAC;QACF,IAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;QAClC,IAAM,WAAW,GAAG,KAAK,CAAC,WAAW,CAAC,OAAO,EAAE,MAAM,EAAE,YAAY,CAAC,CAAC;QACrE,IAAM,aAAa,GAAG,KAAK,CAAC,WAAW,CAAC,WAAW,EAAE,WAAW,CAAC,CAAC;QAClE,IAAM,mBAAmB,GAAG,KAAK,CAAC,WAAW,CAC5C,WAAW,EACX,YAAY,EACZ,WAAW,CACX,CAAC;QAEF,IAAM,IAAI,GAAG,IAAI,CAAC;QAClB,SAAS;aACP,SAAS,CAAC,mBAAmB,CAAC;aAC9B,EAAE,CAAC,WAAW,EAAE,UAAU,KAAK;YAC/B,IAAM,cAAc,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;YACnD,IAAM,KAAK,GAAG,cAAc,CAAC,KAAK,EAAY,CAAC;YAE/C,uBAAuB;YACvB,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,aAAa,CACjC,MAAM,CAAC,IAAI,CAAC,eAAe,EAC3B;gBACC,KAAK,OAAA;gBACL,OAAO,EAAE,cAAc;gBACvB,KAAK,OAAA;aACL,CACD,CAAC;YAEF,IACC,aAAa,KAAK,UAAU,CAAC,MAAM;gBACnC,KAAK,CAAC,MAAM,GAAG,mBAAmB,EACjC;gBACD,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,aAAa,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE;oBACvD,KAAK,OAAA;oBACL,OAAO,EAAE,cAAc;oBACvB,KAAK,OAAA;iBACL,CAAC,CAAC;aACH;QACF,CAAC,CAAC;aACD,EAAE,CAAC,WAAW,EAAE,UAAU,KAAK;YAC/B,IAAM,cAAc,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC;YACnD,IAAM,KAAK,GAAG,cAAc,CAAC,KAAK,EAAY,CAAC;YAC/C,uBAAuB;YACvB,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,aAAa,CACjC,MAAM,CAAC,IAAI,CAAC,eAAe,EAC3B;gBACC,KAAK,OAAA;gBACL,OAAO,EAAE,cAAc;gBACvB,KAAK,OAAA;aACL,CACD,CAAC;YAEF,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,aAAa,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,EAAE;gBACvD,KAAK,OAAA;aACL,CAAC,CAAC;QACJ,CAAC,CAAC;aACD,EAAE,CAAC,OAAO,EAAE,UAAU,KAAK;YAC3B,uBAAuB;YACvB,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,EAAE;gBAC3D,KAAK,OAAA;gBACL,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC;gBACpC,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE;aAC1C,CAAC,CAAC;QACJ,CAAC,CAAC;aACD,EAAE,CAAC,UAAU,EAAE,UAAU,KAAK;YAC9B,uBAAuB;YACvB,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC,cAAc,EAAE;gBAC9D,KAAK,OAAA;gBACL,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC;gBACpC,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE;aAC1C,CAAC,CAAC;YAEH,IAAI,aAAa,KAAK,UAAU,CAAC,MAAM,EAAE;gBACxC,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,aAAa,CAAC,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC;aACxD;QACF,CAAC,CAAC;aACD,EAAE,CAAC,OAAO,EAAE,UAAU,KAAK;YAC3B,IAAM,WAAW,GAAG,EAAE,OAAO,EAAE,CAAC,EAAE,OAAO,EAAE,CAAC,EAAE,CAAC;YAE/C,IAAI,KAAK,CAAC,MAAM,EAAE;gBACjB,8CAA8C;gBAC9C,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;gBACrB,IAAM,YAAY,GAAG,KAAK,CAAC,MAAM,CAAC,qBAAqB,EAAE,CAAC;gBAC1D,WAAW,CAAC,OAAO,GAAG,YAAY,CAAC,CAAC,CAAC;gBACrC,WAAW,CAAC,OAAO,GAAG,YAAY,CAAC,CAAC,CAAC;aACrC;YAED,uBAAuB;YACvB,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC,WAAW,EAAE;gBAC3D,KAAK,wBAAO,KAAK,GAAK,WAAW,CAAE;gBACnC,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC;gBACrB,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE;aAC1C,CAAC,CAAC;QACJ,CAAC,CAAC;aACD,EAAE,CAAC,MAAM,EAAE,UAAU,KAAK;YAC1B,sBAAsB;YACtB,IAAI,CAAC,QAAQ,CAAC,MAAM,CAAC,aAAa,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,EAAE;gBAC1D,KAAK,OAAA;gBACL,OAAO,EAAE,MAAM,CAAC,IAAI,CAAC;gBACrB,KAAK,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,KAAK,EAAE;aAC1C,CAAC,CAAC;QACJ,CAAC,CAAC,CAAC;IACL,CAAC;IAED,yCAAyC;IACjC,0BAAM,GAAd,UAAe,OAAoB,EAAE,KAAY;QAChD,IACC,OAAO,CAAC,kBAAkB;YAC1B,OAAO,CAAC,kBAAkB,CAAC,OAAO,KAAK,MAAM,EAC5C;YACD,OAAO,CAAC,kBAAkB,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;SAC7D;QAED,KAAK,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAED,6CAA6C;IACrC,8BAAU,GAAlB,UAAmB,OAAoB,EAAE,KAAY;QACpD,IACC,OAAO,CAAC,sBAAsB;YAC9B,OAAO,CAAC,sBAAsB,CAAC,OAAO,KAAK,MAAM,EAChD;YACD,OAAO,CAAC,sBAAsB,CAAC,aAAa,CAAC,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC;SACjE;QAED,KAAK,CAAC,cAAc,EAAE,CAAC;IACxB,CAAC;IAED,2BAAO,GAAP;QACC,IAAM,GAAG,GAAG,IAAI,CAAC,qBAAqB,EAAE,CAAC;QACjC,IAAA,oCAAsB,CAAkB;QAChD,IAAM,SAAS,GAAG,QAAQ,CAAC,cAAc,CACxC,GAAG,EACH,YAAU,YAAc,CACxB,CAAC;QAEF,yBAAyB;QACzB,SAAS;aACP,SAAS,CAAC,mBAAmB,CAAC;aAC9B,EAAE,CAAC,WAAW,EAAE,IAAI,CAAC;aACrB,EAAE,CAAC,WAAW,EAAE,IAAI,CAAC;aACrB,EAAE,CAAC,UAAU,EAAE,IAAI,CAAC;aACpB,EAAE,CAAC,OAAO,EAAE,IAAI,CAAC;aACjB,EAAE,CAAC,MAAM,EAAE,IAAI,CAAC,CAAC;IACpB,CAAC;IACF,gBAAC;AAAD,CAAC,AA9PD,CAA+B,IAAI,GA8PlC","sourcesContent":["// Internal Imports\nimport { Axis } from './axis';\nimport { AxisPositions, Events, ScaleTypes } from '../../interfaces';\nimport { ChartModel } from '../../model/model';\nimport { DOMUtils } from '../../services';\nimport { Tools } from '../../tools';\nimport * as Configuration from '../../configuration';\n\n// D3 Imports\nimport { select } from 'd3-selection';\n\nexport class HoverAxis extends Axis {\n\tconstructor(model: ChartModel, services: any, configs?: any) {\n\t\tsuper(model, services, configs);\n\t}\n\n\trender(animate = true) {\n\t\tsuper.render(animate);\n\n\t\t// Remove existing event listeners to avoid flashing behavior\n\t\tsuper.destroy();\n\n\t\tconst { position: axisPosition } = this.configs;\n\t\tconst svg = this.getComponentContainer();\n\t\tconst container = DOMUtils.appendOrSelect(\n\t\t\tsvg,\n\t\t\t`g.axis.${axisPosition}`\n\t\t);\n\n\t\tconst self = this;\n\t\tcontainer.selectAll('g.tick').each(function (_, index) {\n\t\t\tconst g = select(this);\n\t\t\tg.classed('tick-hover', true).attr(\n\t\t\t\t'tabindex',\n\t\t\t\tindex === 0 ? 0 : -1\n\t\t\t);\n\t\t\tconst textNode = g.select('text');\n\t\t\tconst { width, height } = DOMUtils.getSVGElementSize(textNode, {\n\t\t\t\tuseBBox: true,\n\t\t\t});\n\n\t\t\tconst rectangle = DOMUtils.appendOrSelect(g, 'rect.axis-holder');\n\n\t\t\tlet x = 0,\n\t\t\t\ty = 0;\n\n\t\t\t// Depending on axis position, apply correct translation & rotation to align the rect\n\t\t\t// with the text\n\t\t\tswitch (axisPosition) {\n\t\t\t\tcase AxisPositions.LEFT:\n\t\t\t\t\tx = -width + Number(textNode.attr('x'));\n\t\t\t\t\ty = -(height / 2);\n\t\t\t\t\tbreak;\n\t\t\t\tcase AxisPositions.RIGHT:\n\t\t\t\t\tx = Math.abs(Number(textNode.attr('x')));\n\t\t\t\t\ty = -(height / 2);\n\t\t\t\t\tbreak;\n\t\t\t\tcase AxisPositions.TOP:\n\t\t\t\t\tx = -(width / 2);\n\t\t\t\t\ty = -height + Number(textNode.attr('y')) / 2;\n\n\t\t\t\t\tif (self.truncation[axisPosition]) {\n\t\t\t\t\t\tx = 0;\n\t\t\t\t\t\trectangle.attr('transform', `rotate(-45)`);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\tcase AxisPositions.BOTTOM:\n\t\t\t\t\tx = -(width / 2);\n\t\t\t\t\ty = height / 2 - 2;\n\n\t\t\t\t\tif (self.truncation[axisPosition]) {\n\t\t\t\t\t\tx = -width;\n\t\t\t\t\t\trectangle.attr('transform', `rotate(-45)`);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\t// Translates x position -4 left to keep center after padding\n\t\t\t// Adds padding on left & right\n\t\t\trectangle\n\t\t\t\t.attr('x', x - Configuration.axis.hover.rectanglePadding)\n\t\t\t\t.attr('y', y)\n\t\t\t\t.attr(\n\t\t\t\t\t'width',\n\t\t\t\t\twidth + Configuration.axis.hover.rectanglePadding * 2\n\t\t\t\t)\n\t\t\t\t.attr('height', height)\n\t\t\t\t.lower();\n\n\t\t\t// Add keyboard event listeners to each group element\n\t\t\tg.on('keydown', function (event: KeyboardEvent) {\n\t\t\t\t// Choose specific arrow key depending on the axis\n\t\t\t\tif (\n\t\t\t\t\taxisPosition === AxisPositions.LEFT ||\n\t\t\t\t\taxisPosition === AxisPositions.RIGHT\n\t\t\t\t) {\n\t\t\t\t\tif (event.key && event.key === 'ArrowUp') {\n\t\t\t\t\t\tself.goNext(this as HTMLElement, event);\n\t\t\t\t\t} else if (event.key && event.key === 'ArrowDown') {\n\t\t\t\t\t\tself.goPrevious(this as HTMLElement, event);\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tif (event.key && event.key === 'ArrowLeft') {\n\t\t\t\t\t\tself.goPrevious(this as HTMLElement, event);\n\t\t\t\t\t} else if (event.key && event.key === 'ArrowRight') {\n\t\t\t\t\t\tself.goNext(this as HTMLElement, event);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t});\n\t\t});\n\n\t\t// Add event listeners to element group\n\t\tthis.addEventListeners();\n\t}\n\n\taddEventListeners() {\n\t\tconst svg = this.getComponentContainer();\n\t\tconst { position: axisPosition } = this.configs;\n\t\tconst container = DOMUtils.appendOrSelect(\n\t\t\tsvg,\n\t\t\t`g.axis.${axisPosition}`\n\t\t);\n\t\tconst options = this.getOptions();\n\t\tconst axisOptions = Tools.getProperty(options, 'axes', axisPosition);\n\t\tconst axisScaleType = Tools.getProperty(axisOptions, 'scaleType');\n\t\tconst truncationThreshold = Tools.getProperty(\n\t\t\taxisOptions,\n\t\t\t'truncation',\n\t\t\t'threshold'\n\t\t);\n\n\t\tconst self = this;\n\t\tcontainer\n\t\t\t.selectAll('g.tick.tick-hover')\n\t\t\t.on('mouseover', function (event) {\n\t\t\t\tconst hoveredElement = select(this).select('text');\n\t\t\t\tconst datum = hoveredElement.datum() as string;\n\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(\n\t\t\t\t\tEvents.Axis.LABEL_MOUSEOVER,\n\t\t\t\t\t{\n\t\t\t\t\t\tevent,\n\t\t\t\t\t\telement: hoveredElement,\n\t\t\t\t\t\tdatum,\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t\tif (\n\t\t\t\t\taxisScaleType === ScaleTypes.LABELS &&\n\t\t\t\t\tdatum.length > truncationThreshold\n\t\t\t\t) {\n\t\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.SHOW, {\n\t\t\t\t\t\tevent,\n\t\t\t\t\t\telement: hoveredElement,\n\t\t\t\t\t\tdatum,\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t})\n\t\t\t.on('mousemove', function (event) {\n\t\t\t\tconst hoveredElement = select(this).select('text');\n\t\t\t\tconst datum = hoveredElement.datum() as string;\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(\n\t\t\t\t\tEvents.Axis.LABEL_MOUSEMOVE,\n\t\t\t\t\t{\n\t\t\t\t\t\tevent,\n\t\t\t\t\t\telement: hoveredElement,\n\t\t\t\t\t\tdatum,\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.MOVE, {\n\t\t\t\t\tevent,\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on('click', function (event) {\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Axis.LABEL_CLICK, {\n\t\t\t\t\tevent,\n\t\t\t\t\telement: select(this).select('text'),\n\t\t\t\t\tdatum: select(this).select('text').datum(),\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on('mouseout', function (event) {\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Axis.LABEL_MOUSEOUT, {\n\t\t\t\t\tevent,\n\t\t\t\t\telement: select(this).select('text'),\n\t\t\t\t\tdatum: select(this).select('text').datum(),\n\t\t\t\t});\n\n\t\t\t\tif (axisScaleType === ScaleTypes.LABELS) {\n\t\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.HIDE);\n\t\t\t\t}\n\t\t\t})\n\t\t\t.on('focus', function (event) {\n\t\t\t\tconst coordinates = { clientX: 0, clientY: 0 };\n\n\t\t\t\tif (event.target) {\n\t\t\t\t\t// Focus element since we are using arrow keys\n\t\t\t\t\tevent.target.focus();\n\t\t\t\t\tconst boundingRect = event.target.getBoundingClientRect();\n\t\t\t\t\tcoordinates.clientX = boundingRect.x;\n\t\t\t\t\tcoordinates.clientY = boundingRect.y;\n\t\t\t\t}\n\n\t\t\t\t// Dispatch focus event\n\t\t\t\tself.services.events.dispatchEvent(Events.Axis.LABEL_FOCUS, {\n\t\t\t\t\tevent: { ...event, ...coordinates },\n\t\t\t\t\telement: select(this),\n\t\t\t\t\tdatum: select(this).select('text').datum(),\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on('blur', function (event) {\n\t\t\t\t// Dispatch blur event\n\t\t\t\tself.services.events.dispatchEvent(Events.Axis.LABEL_BLUR, {\n\t\t\t\t\tevent,\n\t\t\t\t\telement: select(this),\n\t\t\t\t\tdatum: select(this).select('text').datum(),\n\t\t\t\t});\n\t\t\t});\n\t}\n\n\t// Focus on the next HTML element sibling\n\tprivate goNext(element: HTMLElement, event: Event) {\n\t\tif (\n\t\t\telement.nextElementSibling &&\n\t\t\telement.nextElementSibling.tagName !== 'path'\n\t\t) {\n\t\t\telement.nextElementSibling.dispatchEvent(new Event('focus'));\n\t\t}\n\n\t\tevent.preventDefault();\n\t}\n\n\t// Focus on the previous HTML element sibling\n\tprivate goPrevious(element: HTMLElement, event: Event) {\n\t\tif (\n\t\t\telement.previousElementSibling &&\n\t\t\telement.previousElementSibling.tagName !== 'path'\n\t\t) {\n\t\t\telement.previousElementSibling.dispatchEvent(new Event('focus'));\n\t\t}\n\n\t\tevent.preventDefault();\n\t}\n\n\tdestroy() {\n\t\tconst svg = this.getComponentContainer();\n\t\tconst { position: axisPosition } = this.configs;\n\t\tconst container = DOMUtils.appendOrSelect(\n\t\t\tsvg,\n\t\t\t`g.axis.${axisPosition}`\n\t\t);\n\n\t\t// Remove event listeners\n\t\tcontainer\n\t\t\t.selectAll('g.tick.tick-hover')\n\t\t\t.on('mouseover', null)\n\t\t\t.on('mousemove', null)\n\t\t\t.on('mouseout', null)\n\t\t\t.on('focus', null)\n\t\t\t.on('blur', null);\n\t}\n}\n"]}
|
|
1
|
+
{"version":3,"file":"hover-axis.js","sourceRoot":"","sources":["hover-axis.ts"],"names":[],"mappings":"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","sourcesContent":["// Internal Imports\nimport { Axis } from './axis';\nimport { AxisPositions, Events, ScaleTypes } from '../../interfaces';\nimport { ChartModel } from '../../model/model';\nimport { DOMUtils } from '../../services';\nimport { Tools } from '../../tools';\nimport * as Configuration from '../../configuration';\n\n// D3 Imports\nimport { select } from 'd3-selection';\n\nexport class HoverAxis extends Axis {\n\tconstructor(model: ChartModel, services: any, configs?: any) {\n\t\tsuper(model, services, configs);\n\t}\n\n\trender(animate = true) {\n\t\tsuper.render(animate);\n\n\t\t// Remove existing event listeners to avoid flashing behavior\n\t\tsuper.destroy();\n\n\t\tconst { position: axisPosition } = this.configs;\n\t\tconst svg = this.getComponentContainer();\n\t\tconst container = DOMUtils.appendOrSelect(\n\t\t\tsvg,\n\t\t\t`g.axis.${axisPosition}`\n\t\t);\n\n\t\tconst self = this;\n\t\tcontainer.selectAll('g.tick').each(function (_, index) {\n\t\t\tconst g = select(this);\n\t\t\tg.classed('tick-hover', true).attr(\n\t\t\t\t'tabindex',\n\t\t\t\tindex === 0 ? 0 : -1\n\t\t\t);\n\t\t\tconst textNode = g.select('text');\n\t\t\tconst { width, height } = DOMUtils.getSVGElementSize(textNode, {\n\t\t\t\tuseBBox: true,\n\t\t\t});\n\n\t\t\tconst rectangle = DOMUtils.appendOrSelect(g, 'rect.axis-holder');\n\n\t\t\tlet x = 0,\n\t\t\t\ty = 0;\n\n\t\t\t// Depending on axis position, apply correct translation & rotation to align the rect\n\t\t\t// with the text\n\t\t\tswitch (axisPosition) {\n\t\t\t\tcase AxisPositions.LEFT:\n\t\t\t\t\tx = -width + Number(textNode.attr('x'));\n\t\t\t\t\ty = -(height / 2);\n\t\t\t\t\tbreak;\n\t\t\t\tcase AxisPositions.RIGHT:\n\t\t\t\t\tx = Math.abs(Number(textNode.attr('x')));\n\t\t\t\t\ty = -(height / 2);\n\t\t\t\t\tbreak;\n\t\t\t\tcase AxisPositions.TOP:\n\t\t\t\t\tx = -(width / 2);\n\t\t\t\t\ty = -height + Number(textNode.attr('y')) / 2;\n\n\t\t\t\t\tif (self.truncation[axisPosition]) {\n\t\t\t\t\t\tx = 0;\n\t\t\t\t\t\trectangle.attr('transform', `rotate(-45)`);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t\tcase AxisPositions.BOTTOM:\n\t\t\t\t\tx = -(width / 2);\n\t\t\t\t\ty = height / 2 - 2;\n\n\t\t\t\t\tif (self.truncation[axisPosition]) {\n\t\t\t\t\t\tx = -width;\n\t\t\t\t\t\trectangle.attr('transform', `rotate(-45)`);\n\t\t\t\t\t}\n\t\t\t\t\tbreak;\n\t\t\t}\n\n\t\t\t// Translates x position -4 left to keep center after padding\n\t\t\t// Adds padding on left & right\n\t\t\trectangle\n\t\t\t\t.attr('x', x - Configuration.axis.hover.rectanglePadding)\n\t\t\t\t.attr('y', y)\n\t\t\t\t.attr(\n\t\t\t\t\t'width',\n\t\t\t\t\twidth + Configuration.axis.hover.rectanglePadding * 2\n\t\t\t\t)\n\t\t\t\t.attr('height', height)\n\t\t\t\t.lower();\n\t\t});\n\n\t\t// Add event listeners to element group\n\t\tthis.addEventListeners();\n\t}\n\n\taddEventListeners() {\n\t\tconst svg = this.getComponentContainer();\n\t\tconst { position: axisPosition } = this.configs;\n\t\tconst container = DOMUtils.appendOrSelect(\n\t\t\tsvg,\n\t\t\t`g.axis.${axisPosition}`\n\t\t);\n\t\tconst options = this.getOptions();\n\t\tconst axisOptions = Tools.getProperty(options, 'axes', axisPosition);\n\t\tconst axisScaleType = Tools.getProperty(axisOptions, 'scaleType');\n\t\tconst truncationThreshold = Tools.getProperty(\n\t\t\taxisOptions,\n\t\t\t'truncation',\n\t\t\t'threshold'\n\t\t);\n\n\t\tconst self = this;\n\t\tcontainer\n\t\t\t.selectAll('g.tick.tick-hover')\n\t\t\t.on('mouseover', function (event) {\n\t\t\t\tconst hoveredElement = select(this).select('text');\n\t\t\t\tconst datum = hoveredElement.datum() as string;\n\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(\n\t\t\t\t\tEvents.Axis.LABEL_MOUSEOVER,\n\t\t\t\t\t{\n\t\t\t\t\t\tevent,\n\t\t\t\t\t\telement: hoveredElement,\n\t\t\t\t\t\tdatum,\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t\tif (\n\t\t\t\t\taxisScaleType === ScaleTypes.LABELS &&\n\t\t\t\t\tdatum.length > truncationThreshold\n\t\t\t\t) {\n\t\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.SHOW, {\n\t\t\t\t\t\tevent,\n\t\t\t\t\t\telement: hoveredElement,\n\t\t\t\t\t\tdatum,\n\t\t\t\t\t});\n\t\t\t\t}\n\t\t\t})\n\t\t\t.on('mousemove', function (event) {\n\t\t\t\tconst hoveredElement = select(this).select('text');\n\t\t\t\tconst datum = hoveredElement.datum() as string;\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(\n\t\t\t\t\tEvents.Axis.LABEL_MOUSEMOVE,\n\t\t\t\t\t{\n\t\t\t\t\t\tevent,\n\t\t\t\t\t\telement: hoveredElement,\n\t\t\t\t\t\tdatum,\n\t\t\t\t\t}\n\t\t\t\t);\n\n\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.MOVE, {\n\t\t\t\t\tevent,\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on('click', function (event) {\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Axis.LABEL_CLICK, {\n\t\t\t\t\tevent,\n\t\t\t\t\telement: select(this).select('text'),\n\t\t\t\t\tdatum: select(this).select('text').datum(),\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on('mouseout', function (event) {\n\t\t\t\t// Dispatch mouse event\n\t\t\t\tself.services.events.dispatchEvent(Events.Axis.LABEL_MOUSEOUT, {\n\t\t\t\t\tevent,\n\t\t\t\t\telement: select(this).select('text'),\n\t\t\t\t\tdatum: select(this).select('text').datum(),\n\t\t\t\t});\n\n\t\t\t\tif (axisScaleType === ScaleTypes.LABELS) {\n\t\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.HIDE);\n\t\t\t\t}\n\t\t\t})\n\t\t\t.on('focus', function (event) {\n\t\t\t\tconst coordinates = { clientX: 0, clientY: 0 };\n\n\t\t\t\tif (event.target) {\n\t\t\t\t\t// Focus element since we are using arrow keys\n\t\t\t\t\tevent.target.focus();\n\t\t\t\t\tconst boundingRect = event.target.getBoundingClientRect();\n\t\t\t\t\tcoordinates.clientX = boundingRect.x;\n\t\t\t\t\tcoordinates.clientY = boundingRect.y;\n\t\t\t\t}\n\n\t\t\t\t// Dispatch focus event\n\t\t\t\tself.services.events.dispatchEvent(Events.Axis.LABEL_FOCUS, {\n\t\t\t\t\tevent: { ...event, ...coordinates },\n\t\t\t\t\telement: select(this),\n\t\t\t\t\tdatum: select(this).select('text').datum(),\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on('blur', function (event) {\n\t\t\t\t// Dispatch blur event\n\t\t\t\tself.services.events.dispatchEvent(Events.Axis.LABEL_BLUR, {\n\t\t\t\t\tevent,\n\t\t\t\t\telement: select(this),\n\t\t\t\t\tdatum: select(this).select('text').datum(),\n\t\t\t\t});\n\t\t\t})\n\t\t\t.on('keydown', function (event) {\n\t\t\t\t// Hide the tooltip when `Escape` is pressed, but keep focus\n\t\t\t\tif (event.key && event.key === 'Escape') {\n\t\t\t\t\tself.services.events.dispatchEvent(Events.Tooltip.HIDE);\n\t\t\t\t\tself.services.events.dispatchEvent(Events.Axis.LABEL_BLUR, {\n\t\t\t\t\t\tevent,\n\t\t\t\t\t\telement: select(this),\n\t\t\t\t\t\tdatum: select(this).select('text').datum(),\n\t\t\t\t\t});\n\t\t\t\t}\n\n\t\t\t\t// Choose specific arrow key depending on the axis\n\t\t\t\tif (\n\t\t\t\t\taxisPosition === AxisPositions.LEFT ||\n\t\t\t\t\taxisPosition === AxisPositions.RIGHT\n\t\t\t\t) {\n\t\t\t\t\tif (event.key && event.key === 'ArrowUp') {\n\t\t\t\t\t\tself.goNext(this as HTMLElement, event);\n\t\t\t\t\t} else if (event.key && event.key === 'ArrowDown') {\n\t\t\t\t\t\tself.goPrevious(this as HTMLElement, event);\n\t\t\t\t\t}\n\t\t\t\t} else {\n\t\t\t\t\tif (event.key && event.key === 'ArrowLeft') {\n\t\t\t\t\t\tself.goPrevious(this as HTMLElement, event);\n\t\t\t\t\t} else if (event.key && event.key === 'ArrowRight') {\n\t\t\t\t\t\tself.goNext(this as HTMLElement, event);\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t});\n\t}\n\n\t// Focus on the next HTML element sibling\n\tprivate goNext(element: HTMLElement, event: Event) {\n\t\tif (\n\t\t\telement.nextElementSibling &&\n\t\t\telement.nextElementSibling.tagName !== 'path'\n\t\t) {\n\t\t\telement.nextElementSibling.dispatchEvent(new Event('focus'));\n\t\t}\n\n\t\tevent.preventDefault();\n\t}\n\n\t// Focus on the previous HTML element sibling\n\tprivate goPrevious(element: HTMLElement, event: Event) {\n\t\tif (\n\t\t\telement.previousElementSibling &&\n\t\t\telement.previousElementSibling.tagName !== 'path'\n\t\t) {\n\t\t\telement.previousElementSibling.dispatchEvent(new Event('focus'));\n\t\t}\n\n\t\tevent.preventDefault();\n\t}\n\n\tdestroy() {\n\t\tconst svg = this.getComponentContainer();\n\t\tconst { position: axisPosition } = this.configs;\n\t\tconst container = DOMUtils.appendOrSelect(\n\t\t\tsvg,\n\t\t\t`g.axis.${axisPosition}`\n\t\t);\n\n\t\t// Remove event listeners\n\t\tcontainer\n\t\t\t.selectAll('g.tick.tick-hover')\n\t\t\t.on('mouseover', null)\n\t\t\t.on('mousemove', null)\n\t\t\t.on('mouseout', null)\n\t\t\t.on('focus', null)\n\t\t\t.on('blur', null);\n\t}\n}\n"]}
|
package/package.json
CHANGED
package/tsconfig.tsbuildinfo
CHANGED
|
@@ -458,7 +458,7 @@
|
|
|
458
458
|
"signature": "2ac82266748bb842c4b093f55056eaeb12a9611ebcea88fdb4d59856897b1654"
|
|
459
459
|
},
|
|
460
460
|
"../src/components/axes/hover-axis.ts": {
|
|
461
|
-
"version": "
|
|
461
|
+
"version": "25499aa7f19c9b70c5ed84806b24ee5502ebf1c72144a540b3453daafd995356",
|
|
462
462
|
"signature": "1addfe7193bd20fe4ab12f530f4eb6e3fa05c96798ccf16cbcb6a1fb797562b3"
|
|
463
463
|
},
|
|
464
464
|
"../src/components/axes/two-dimensional-axes.ts": {
|