@oanda/labs-crowd-view-widget 1.0.56 → 1.0.57
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 +232 -0
- package/dist/main/CrowdViewWidget/components/Chart/Chart.js +1 -6
- package/dist/main/CrowdViewWidget/components/Chart/Chart.js.map +1 -1
- package/dist/main/CrowdViewWidget/components/Chart/chartOptions/getGridConfig.js +5 -4
- package/dist/main/CrowdViewWidget/components/Chart/chartOptions/getGridConfig.js.map +1 -1
- package/dist/main/CrowdViewWidget/components/Chart/chartOptions/getGridLines.js +13 -6
- package/dist/main/CrowdViewWidget/components/Chart/chartOptions/getGridLines.js.map +1 -1
- package/dist/main/CrowdViewWidget/components/Chart/chartOptions/getLabelsConfig.js +4 -4
- package/dist/main/CrowdViewWidget/components/Chart/chartOptions/getLabelsConfig.js.map +1 -1
- package/dist/main/CrowdViewWidget/components/Chart/chartOptions/getTooltipConfig.js +9 -43
- package/dist/main/CrowdViewWidget/components/Chart/chartOptions/getTooltipConfig.js.map +1 -1
- package/dist/main/CrowdViewWidget/components/Chart/chartOptions/getXAxisConfig.js +19 -4
- package/dist/main/CrowdViewWidget/components/Chart/chartOptions/getXAxisConfig.js.map +1 -1
- package/dist/main/CrowdViewWidget/components/Chart/chartOptions/getYAxisConfig.js +15 -2
- package/dist/main/CrowdViewWidget/components/Chart/chartOptions/getYAxisConfig.js.map +1 -1
- package/dist/main/CrowdViewWidget/components/Chart/chartUtils/formatFullDate.js +27 -0
- package/dist/main/CrowdViewWidget/components/Chart/chartUtils/formatFullDate.js.map +1 -0
- package/dist/main/CrowdViewWidget/components/Chart/chartUtils/getTooltipFormatter.js +14 -23
- package/dist/main/CrowdViewWidget/components/Chart/chartUtils/getTooltipFormatter.js.map +1 -1
- package/dist/main/CrowdViewWidget/components/Chart/chartUtils/index.js +11 -0
- package/dist/main/CrowdViewWidget/components/Chart/chartUtils/index.js.map +1 -1
- package/dist/main/CrowdViewWidget/components/Chart/getOption.js +4 -4
- package/dist/main/CrowdViewWidget/components/Chart/getOption.js.map +1 -1
- package/dist/main/CrowdViewWidget/constants.js +6 -5
- package/dist/main/CrowdViewWidget/constants.js.map +1 -1
- package/dist/main/translations/sources/en.json +2 -1
- package/dist/module/CrowdViewWidget/components/Chart/Chart.js +2 -7
- package/dist/module/CrowdViewWidget/components/Chart/Chart.js.map +1 -1
- package/dist/module/CrowdViewWidget/components/Chart/chartOptions/getGridConfig.js +5 -4
- package/dist/module/CrowdViewWidget/components/Chart/chartOptions/getGridConfig.js.map +1 -1
- package/dist/module/CrowdViewWidget/components/Chart/chartOptions/getGridLines.js +13 -6
- package/dist/module/CrowdViewWidget/components/Chart/chartOptions/getGridLines.js.map +1 -1
- package/dist/module/CrowdViewWidget/components/Chart/chartOptions/getLabelsConfig.js +4 -4
- package/dist/module/CrowdViewWidget/components/Chart/chartOptions/getLabelsConfig.js.map +1 -1
- package/dist/module/CrowdViewWidget/components/Chart/chartOptions/getTooltipConfig.js +9 -42
- package/dist/module/CrowdViewWidget/components/Chart/chartOptions/getTooltipConfig.js.map +1 -1
- package/dist/module/CrowdViewWidget/components/Chart/chartOptions/getXAxisConfig.js +20 -5
- package/dist/module/CrowdViewWidget/components/Chart/chartOptions/getXAxisConfig.js.map +1 -1
- package/dist/module/CrowdViewWidget/components/Chart/chartOptions/getYAxisConfig.js +15 -2
- package/dist/module/CrowdViewWidget/components/Chart/chartOptions/getYAxisConfig.js.map +1 -1
- package/dist/module/CrowdViewWidget/components/Chart/chartUtils/formatFullDate.js +20 -0
- package/dist/module/CrowdViewWidget/components/Chart/chartUtils/formatFullDate.js.map +1 -0
- package/dist/module/CrowdViewWidget/components/Chart/chartUtils/getTooltipFormatter.js +14 -23
- package/dist/module/CrowdViewWidget/components/Chart/chartUtils/getTooltipFormatter.js.map +1 -1
- package/dist/module/CrowdViewWidget/components/Chart/chartUtils/index.js +1 -0
- package/dist/module/CrowdViewWidget/components/Chart/chartUtils/index.js.map +1 -1
- package/dist/module/CrowdViewWidget/components/Chart/getOption.js +4 -4
- package/dist/module/CrowdViewWidget/components/Chart/getOption.js.map +1 -1
- package/dist/module/CrowdViewWidget/constants.js +6 -5
- package/dist/module/CrowdViewWidget/constants.js.map +1 -1
- package/dist/module/translations/sources/en.json +2 -1
- package/dist/types/CrowdViewWidget/components/Chart/chartOptions/getTooltipConfig.d.ts +1 -2
- package/dist/types/CrowdViewWidget/components/Chart/chartOptions/getXAxisConfig.d.ts +2 -1
- package/dist/types/CrowdViewWidget/components/Chart/chartOptions/getYAxisConfig.d.ts +4 -2
- package/dist/types/CrowdViewWidget/components/Chart/chartUtils/formatFullDate.d.ts +1 -0
- package/dist/types/CrowdViewWidget/components/Chart/chartUtils/index.d.ts +1 -0
- package/dist/types/CrowdViewWidget/constants.d.ts +4 -3
- package/package.json +3 -3
- package/src/CrowdViewWidget/components/Chart/Chart.tsx +1 -7
- package/src/CrowdViewWidget/components/Chart/chartOptions/getGridConfig.ts +5 -4
- package/src/CrowdViewWidget/components/Chart/chartOptions/getGridLines.ts +19 -10
- package/src/CrowdViewWidget/components/Chart/chartOptions/getLabelsConfig.ts +9 -5
- package/src/CrowdViewWidget/components/Chart/chartOptions/getTooltipConfig.ts +38 -79
- package/src/CrowdViewWidget/components/Chart/chartOptions/getXAxisConfig.ts +26 -2
- package/src/CrowdViewWidget/components/Chart/chartOptions/getYAxisConfig.ts +20 -3
- package/src/CrowdViewWidget/components/Chart/chartUtils/formatFullDate.ts +26 -0
- package/src/CrowdViewWidget/components/Chart/chartUtils/getTooltipFormatter.ts +49 -35
- package/src/CrowdViewWidget/components/Chart/chartUtils/index.ts +1 -0
- package/src/CrowdViewWidget/components/Chart/getOption.ts +2 -2
- package/src/CrowdViewWidget/constants.ts +9 -7
- package/src/translations/sources/en.json +2 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getYAxisConfig.js","names":["CHART_CONFIG","getYAxisConfig","_ref","bucketWidth","displayPrecision","
|
|
1
|
+
{"version":3,"file":"getYAxisConfig.js","names":["CHART_CONFIG","getYAxisConfig","_ref","bucketWidth","displayPrecision","selectedPriceRef","type","gridIndex","position","min","val","adjustedMin","Math","floor","max","adjustedMax","ceil","axisLine","show","axisTick","splitLine","axisLabel","lineHeight","margin","verticalAlignMinLabel","verticalAlignMaxLabel","formatter","value","toFixed","axisPointer","label","padding","params","axisDimension","axisIndex","current","Number","z","SENTIMENT_MIN","SENTIMENT_MAX","customValues","concat"],"sources":["../../../../../../src/CrowdViewWidget/components/Chart/chartOptions/getYAxisConfig.ts"],"sourcesContent":["import type { YAXisComponentOption } from 'echarts';\n\nimport { CHART_CONFIG } from '../../../constants';\n\ninterface GetYAxisConfigParams {\n bucketWidth: number;\n displayPrecision: number;\n selectedPriceRef: { current: number };\n}\n\nexport const getYAxisConfig = ({\n bucketWidth,\n displayPrecision,\n selectedPriceRef,\n}: GetYAxisConfigParams): YAXisComponentOption[] => [\n {\n type: 'value',\n gridIndex: 0,\n position: 'right',\n min: (val: { min: number }) => {\n const adjustedMin = val.min - bucketWidth;\n return Math.floor(adjustedMin / bucketWidth) * bucketWidth;\n },\n max: (val: { max: number }) => {\n const adjustedMax = val.max + bucketWidth;\n return Math.ceil(adjustedMax / bucketWidth) * bucketWidth;\n },\n axisLine: { show: false },\n axisTick: { show: false },\n splitLine: { show: false },\n axisLabel: {\n lineHeight: 20,\n margin: 4,\n verticalAlignMinLabel: 'bottom',\n verticalAlignMaxLabel: 'top',\n formatter: (value: number) => value.toFixed(displayPrecision),\n },\n axisPointer: {\n label: {\n padding: [4, 4, 4, 4],\n margin: -1,\n formatter: (params: {\n axisDimension?: string;\n axisIndex?: number;\n value: unknown;\n }) => {\n if (params.axisDimension === 'y' && params.axisIndex === 0) {\n selectedPriceRef.current = Number(params.value);\n return Number(params.value).toFixed(displayPrecision);\n }\n return '';\n },\n },\n },\n z: 30,\n },\n {\n type: 'value',\n gridIndex: 1,\n position: 'left',\n min: CHART_CONFIG.SENTIMENT_MIN,\n max: CHART_CONFIG.SENTIMENT_MAX,\n axisLine: { show: false },\n axisTick: { show: false },\n axisPointer: { show: false },\n splitLine: { show: false },\n axisLabel: {\n margin: 4,\n lineHeight: 20,\n verticalAlignMinLabel: 'bottom',\n verticalAlignMaxLabel: 'top',\n customValues: [\n CHART_CONFIG.SENTIMENT_MIN,\n CHART_CONFIG.SENTIMENT_MAX / 5,\n CHART_CONFIG.SENTIMENT_MAX / 2,\n (CHART_CONFIG.SENTIMENT_MAX * 4) / 5,\n CHART_CONFIG.SENTIMENT_MAX,\n ],\n formatter: (value: number) => `${value}%`,\n },\n z: 30,\n },\n];\n"],"mappings":"AAEA,SAASA,YAAY,QAAQ,oBAAoB;AAQjD,OAAO,MAAMC,cAAc,GAAGC,IAAA;EAAA,IAAC;IAC7BC,WAAW;IACXC,gBAAgB;IAChBC;EACoB,CAAC,GAAAH,IAAA;EAAA,OAA6B,CAClD;IACEI,IAAI,EAAE,OAAO;IACbC,SAAS,EAAE,CAAC;IACZC,QAAQ,EAAE,OAAO;IACjBC,GAAG,EAAGC,GAAoB,IAAK;MAC7B,MAAMC,WAAW,GAAGD,GAAG,CAACD,GAAG,GAAGN,WAAW;MACzC,OAAOS,IAAI,CAACC,KAAK,CAACF,WAAW,GAAGR,WAAW,CAAC,GAAGA,WAAW;IAC5D,CAAC;IACDW,GAAG,EAAGJ,GAAoB,IAAK;MAC7B,MAAMK,WAAW,GAAGL,GAAG,CAACI,GAAG,GAAGX,WAAW;MACzC,OAAOS,IAAI,CAACI,IAAI,CAACD,WAAW,GAAGZ,WAAW,CAAC,GAAGA,WAAW;IAC3D,CAAC;IACDc,QAAQ,EAAE;MAAEC,IAAI,EAAE;IAAM,CAAC;IACzBC,QAAQ,EAAE;MAAED,IAAI,EAAE;IAAM,CAAC;IACzBE,SAAS,EAAE;MAAEF,IAAI,EAAE;IAAM,CAAC;IAC1BG,SAAS,EAAE;MACTC,UAAU,EAAE,EAAE;MACdC,MAAM,EAAE,CAAC;MACTC,qBAAqB,EAAE,QAAQ;MAC/BC,qBAAqB,EAAE,KAAK;MAC5BC,SAAS,EAAGC,KAAa,IAAKA,KAAK,CAACC,OAAO,CAACxB,gBAAgB;IAC9D,CAAC;IACDyB,WAAW,EAAE;MACXC,KAAK,EAAE;QACLC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;QACrBR,MAAM,EAAE,CAAC,CAAC;QACVG,SAAS,EAAGM,MAIX,IAAK;UACJ,IAAIA,MAAM,CAACC,aAAa,KAAK,GAAG,IAAID,MAAM,CAACE,SAAS,KAAK,CAAC,EAAE;YAC1D7B,gBAAgB,CAAC8B,OAAO,GAAGC,MAAM,CAACJ,MAAM,CAACL,KAAK,CAAC;YAC/C,OAAOS,MAAM,CAACJ,MAAM,CAACL,KAAK,CAAC,CAACC,OAAO,CAACxB,gBAAgB,CAAC;UACvD;UACA,OAAO,EAAE;QACX;MACF;IACF,CAAC;IACDiC,CAAC,EAAE;EACL,CAAC,EACD;IACE/B,IAAI,EAAE,OAAO;IACbC,SAAS,EAAE,CAAC;IACZC,QAAQ,EAAE,MAAM;IAChBC,GAAG,EAAET,YAAY,CAACsC,aAAa;IAC/BxB,GAAG,EAAEd,YAAY,CAACuC,aAAa;IAC/BtB,QAAQ,EAAE;MAAEC,IAAI,EAAE;IAAM,CAAC;IACzBC,QAAQ,EAAE;MAAED,IAAI,EAAE;IAAM,CAAC;IACzBW,WAAW,EAAE;MAAEX,IAAI,EAAE;IAAM,CAAC;IAC5BE,SAAS,EAAE;MAAEF,IAAI,EAAE;IAAM,CAAC;IAC1BG,SAAS,EAAE;MACTE,MAAM,EAAE,CAAC;MACTD,UAAU,EAAE,EAAE;MACdE,qBAAqB,EAAE,QAAQ;MAC/BC,qBAAqB,EAAE,KAAK;MAC5Be,YAAY,EAAE,CACZxC,YAAY,CAACsC,aAAa,EAC1BtC,YAAY,CAACuC,aAAa,GAAG,CAAC,EAC9BvC,YAAY,CAACuC,aAAa,GAAG,CAAC,EAC7BvC,YAAY,CAACuC,aAAa,GAAG,CAAC,GAAI,CAAC,EACpCvC,YAAY,CAACuC,aAAa,CAC3B;MACDb,SAAS,EAAGC,KAAa,OAAAc,MAAA,CAAQd,KAAK;IACxC,CAAC;IACDU,CAAC,EAAE;EACL,CAAC,CACF;AAAA","ignoreList":[]}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
export const formatFullDate = (date, locale) => {
|
|
2
|
+
var _parts$find;
|
|
3
|
+
const formattedDate = date.toLocaleDateString(locale, {
|
|
4
|
+
day: 'numeric',
|
|
5
|
+
month: '2-digit',
|
|
6
|
+
year: '2-digit'
|
|
7
|
+
}).replace(/\//g, '.');
|
|
8
|
+
const formattedTime = date.toLocaleTimeString(locale, {
|
|
9
|
+
hour: 'numeric',
|
|
10
|
+
minute: '2-digit',
|
|
11
|
+
hour12: false
|
|
12
|
+
});
|
|
13
|
+
const formatter = new Intl.DateTimeFormat('en-US', {
|
|
14
|
+
timeZoneName: 'shortOffset'
|
|
15
|
+
});
|
|
16
|
+
const parts = formatter.formatToParts(date);
|
|
17
|
+
const timeZoneOffset = (_parts$find = parts.find(part => part.type === 'timeZoneName')) === null || _parts$find === void 0 ? void 0 : _parts$find.value;
|
|
18
|
+
return "".concat(formattedDate, " ").concat(formattedTime, " ").concat(timeZoneOffset);
|
|
19
|
+
};
|
|
20
|
+
//# sourceMappingURL=formatFullDate.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"formatFullDate.js","names":["formatFullDate","date","locale","_parts$find","formattedDate","toLocaleDateString","day","month","year","replace","formattedTime","toLocaleTimeString","hour","minute","hour12","formatter","Intl","DateTimeFormat","timeZoneName","parts","formatToParts","timeZoneOffset","find","part","type","value","concat"],"sources":["../../../../../../src/CrowdViewWidget/components/Chart/chartUtils/formatFullDate.ts"],"sourcesContent":["export const formatFullDate = (date: Date, locale: string): string => {\n const formattedDate = date\n .toLocaleDateString(locale, {\n day: 'numeric',\n month: '2-digit',\n year: '2-digit',\n })\n .replace(/\\//g, '.');\n\n const formattedTime = date.toLocaleTimeString(locale, {\n hour: 'numeric',\n minute: '2-digit',\n hour12: false,\n });\n\n const formatter = new Intl.DateTimeFormat('en-US', {\n timeZoneName: 'shortOffset',\n });\n\n const parts = formatter.formatToParts(date);\n const timeZoneOffset = parts.find(\n (part) => part.type === 'timeZoneName'\n )?.value;\n\n return `${formattedDate} ${formattedTime} ${timeZoneOffset}`;\n};\n"],"mappings":"AAAA,OAAO,MAAMA,cAAc,GAAGA,CAACC,IAAU,EAAEC,MAAc,KAAa;EAAA,IAAAC,WAAA;EACpE,MAAMC,aAAa,GAAGH,IAAI,CACvBI,kBAAkB,CAACH,MAAM,EAAE;IAC1BI,GAAG,EAAE,SAAS;IACdC,KAAK,EAAE,SAAS;IAChBC,IAAI,EAAE;EACR,CAAC,CAAC,CACDC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC;EAEtB,MAAMC,aAAa,GAAGT,IAAI,CAACU,kBAAkB,CAACT,MAAM,EAAE;IACpDU,IAAI,EAAE,SAAS;IACfC,MAAM,EAAE,SAAS;IACjBC,MAAM,EAAE;EACV,CAAC,CAAC;EAEF,MAAMC,SAAS,GAAG,IAAIC,IAAI,CAACC,cAAc,CAAC,OAAO,EAAE;IACjDC,YAAY,EAAE;EAChB,CAAC,CAAC;EAEF,MAAMC,KAAK,GAAGJ,SAAS,CAACK,aAAa,CAACnB,IAAI,CAAC;EAC3C,MAAMoB,cAAc,IAAAlB,WAAA,GAAGgB,KAAK,CAACG,IAAI,CAC9BC,IAAI,IAAKA,IAAI,CAACC,IAAI,KAAK,cAC1B,CAAC,cAAArB,WAAA,uBAFsBA,WAAA,CAEpBsB,KAAK;EAER,UAAAC,MAAA,CAAUtB,aAAa,OAAAsB,MAAA,CAAIhB,aAAa,OAAAgB,MAAA,CAAIL,cAAc;AAC5D,CAAC","ignoreList":[]}
|
|
@@ -1,14 +1,6 @@
|
|
|
1
1
|
import { colorPalette } from '@oanda/labs-widget-common';
|
|
2
2
|
import { BookType } from '../../../../gql/types/graphql';
|
|
3
|
-
|
|
4
|
-
day: 'numeric',
|
|
5
|
-
month: 'numeric',
|
|
6
|
-
year: 'numeric',
|
|
7
|
-
hour: 'numeric',
|
|
8
|
-
minute: '2-digit',
|
|
9
|
-
hour12: false,
|
|
10
|
-
timeZoneName: 'shortOffset'
|
|
11
|
-
};
|
|
3
|
+
import { formatFullDate } from './formatFullDate';
|
|
12
4
|
const SENTIMENT_DISPLAY_PRECISION = 2;
|
|
13
5
|
const TOOLTIP_STYLES = {
|
|
14
6
|
MOBILE_COLUMN_WIDTH: '33.3%',
|
|
@@ -36,14 +28,14 @@ const getSentimentOverbalanceLabel = (sentiment, bookType) => {
|
|
|
36
28
|
}
|
|
37
29
|
return bookType === BookType.Order ? 'buy_overbalance' : 'long_overbalance';
|
|
38
30
|
};
|
|
39
|
-
const formatCandleData = (candleData, labelCallback) => {
|
|
31
|
+
const formatCandleData = (candleData, labelCallback, isDesktop) => {
|
|
40
32
|
const [, open, close, low, high] = candleData;
|
|
41
33
|
const candleLabel = labelCallback('candle');
|
|
42
34
|
const openLabel = labelCallback('open');
|
|
43
35
|
const closeLabel = labelCallback('close');
|
|
44
36
|
const lowLabel = labelCallback('low');
|
|
45
37
|
const highLabel = labelCallback('high');
|
|
46
|
-
return "<div><b>".concat(candleLabel, ":</b></div>\n<div>").concat(openLabel, ": ").concat(open, " </div>\n<div>").concat(closeLabel, ": ").concat(close, " </div>\n<div>").concat(lowLabel, ": ").concat(low, " </div>\n<div>").concat(highLabel, ": ").concat(high, " </div>\n");
|
|
38
|
+
return isDesktop ? "<div><b>".concat(candleLabel, ":</b></div>\n<div style=\"display: flex; gap: 4px; margin-right: 4px;\">\n<div>").concat(openLabel, ": ").concat(open, " </div>\n<div>").concat(closeLabel, ": ").concat(close, " </div>\n<div>").concat(lowLabel, ": ").concat(low, " </div>\n<div>").concat(highLabel, ": ").concat(high, " </div>\n</div>") : "<div><b>".concat(candleLabel, ":</b></div>\n<div>").concat(openLabel, ": ").concat(open, " </div>\n<div>").concat(closeLabel, ": ").concat(close, " </div>\n<div>").concat(lowLabel, ": ").concat(low, " </div>\n<div>").concat(highLabel, ": ").concat(high, " </div>");
|
|
47
39
|
};
|
|
48
40
|
const formatBookData = _ref => {
|
|
49
41
|
let {
|
|
@@ -59,10 +51,10 @@ const formatBookData = _ref => {
|
|
|
59
51
|
const priceRangeEnd = (matchedBucket.price + bucketWidth).toFixed(bucketDisplayPrecision);
|
|
60
52
|
const sentimentLabel = getSentimentOverbalanceLabel(matchedBucket.sentiment, bookType);
|
|
61
53
|
const sentimentValue = Math.abs(matchedBucket.sentiment);
|
|
62
|
-
return isDesktop ? "<div><b>".concat(labelCallback(bookLabelKey), ":</b></div>\n<
|
|
54
|
+
return isDesktop ? "<div><b>".concat(labelCallback(bookLabelKey), ":</b></div>\n<span style=\"margin-right: 4px;\">").concat(labelCallback('price_range'), ": ").concat(priceRangeStart, " - ").concat(priceRangeEnd, " </span>\n<span style=\"margin-right: 4px;\">").concat(labelCallback(sentimentLabel), ": ").concat(sentimentValue, "% </span>") : "<div><b>".concat(labelCallback(bookLabelKey), ":</b></div>\n<div>").concat(labelCallback('price_range'), ":</div>\n<div>").concat(priceRangeStart, " - ").concat(priceRangeEnd, " </div>\n<div>").concat(labelCallback(sentimentLabel), ":</div>\n<div>").concat(sentimentValue, "% </div>");
|
|
63
55
|
};
|
|
64
|
-
const formatSentimentData = (sentimentLong, sentimentShort, labelCallback) => {
|
|
65
|
-
return "<div><b>".concat(labelCallback('sentiment'), ":</b></div>\n<div>").concat(labelCallback('long'), ": ").concat(sentimentLong.toFixed(SENTIMENT_DISPLAY_PRECISION), "% </div>\n<div>").concat(labelCallback('short'), ": ").concat(sentimentShort.toFixed(SENTIMENT_DISPLAY_PRECISION), "% </div>");
|
|
56
|
+
const formatSentimentData = (sentimentLong, sentimentShort, labelCallback, isDesktop) => {
|
|
57
|
+
return isDesktop ? "<div><b>".concat(labelCallback('sentiment'), ":</b></div>\n <span style=\"margin-right: 4px;\">").concat(labelCallback('long'), ": ").concat(sentimentLong.toFixed(SENTIMENT_DISPLAY_PRECISION), "% </span>\n <span style=\"margin-right: 4px;\">").concat(labelCallback('short'), ": ").concat(sentimentShort.toFixed(SENTIMENT_DISPLAY_PRECISION), "% </span>") : "<div><b>".concat(labelCallback('sentiment'), ":</b></div>\n<div>").concat(labelCallback('long'), ": ").concat(sentimentLong.toFixed(SENTIMENT_DISPLAY_PRECISION), "% </div>\n<div>").concat(labelCallback('short'), ": ").concat(sentimentShort.toFixed(SENTIMENT_DISPLAY_PRECISION), "% </div>");
|
|
66
58
|
};
|
|
67
59
|
const hasValidCandleData = candleData => !!candleData[1] && !!candleData[2] && !!candleData[3] && !!candleData[4];
|
|
68
60
|
const hasValidSentimentData = (sentimentLong, sentimentShort) => sentimentLong !== null && sentimentShort !== null;
|
|
@@ -114,8 +106,8 @@ export const getTooltipFormatter = _ref3 => {
|
|
|
114
106
|
if (!showCandles && !matchedBucket) {
|
|
115
107
|
return '';
|
|
116
108
|
}
|
|
117
|
-
const timeFormatted = time
|
|
118
|
-
const candleSection = showCandles ? formatCandleData(candleData, labelCallback) : '';
|
|
109
|
+
const timeFormatted = formatFullDate(time, locale);
|
|
110
|
+
const candleSection = showCandles ? formatCandleData(candleData, labelCallback, isDesktop) : '';
|
|
119
111
|
const bookSection = matchedBucket ? formatBookData({
|
|
120
112
|
matchedBucket,
|
|
121
113
|
bucketWidth,
|
|
@@ -124,14 +116,14 @@ export const getTooltipFormatter = _ref3 => {
|
|
|
124
116
|
labelCallback,
|
|
125
117
|
isDesktop
|
|
126
118
|
}) : '';
|
|
127
|
-
const sentimentSection = showSentiment && sentimentLong && sentimentShort ? formatSentimentData(sentimentLong, sentimentShort, labelCallback) : '';
|
|
119
|
+
const sentimentSection = showSentiment && sentimentLong && sentimentShort ? formatSentimentData(sentimentLong, sentimentShort, labelCallback, isDesktop) : '';
|
|
128
120
|
if (isDesktop) {
|
|
129
121
|
return buildDesktopTooltip({
|
|
130
122
|
timeFormatted,
|
|
131
123
|
candleSection,
|
|
132
124
|
sentimentSection,
|
|
133
125
|
bookSection,
|
|
134
|
-
|
|
126
|
+
isDark
|
|
135
127
|
});
|
|
136
128
|
}
|
|
137
129
|
return buildMobileTooltip({
|
|
@@ -144,15 +136,14 @@ export const getTooltipFormatter = _ref3 => {
|
|
|
144
136
|
};
|
|
145
137
|
const buildDesktopTooltip = _ref4 => {
|
|
146
138
|
let {
|
|
147
|
-
timeFormatted,
|
|
148
139
|
candleSection,
|
|
149
140
|
sentimentSection,
|
|
150
141
|
bookSection,
|
|
151
|
-
|
|
142
|
+
isDark
|
|
152
143
|
} = _ref4;
|
|
153
|
-
const
|
|
154
|
-
const
|
|
155
|
-
return "<div style=\"
|
|
144
|
+
const backgroundColor = isDark ? colorPalette.black : colorPalette.white;
|
|
145
|
+
const fullWidth = TOOLTIP_STYLES.FULL_WIDTH;
|
|
146
|
+
return "<div style=\"width: ".concat(fullWidth, "; background-color: ").concat(backgroundColor, ";\">\n <div style=\"width: ").concat(fullWidth, "; display: flex; justify-content: space-between;\">\n <div style=\"width: 40%;\">\n").concat(candleSection, "\n</div>\n<div style=\"width: 22%;\">\n").concat(sentimentSection, "\n</div>\n<div style=\"width: 38%;\">\n").concat(bookSection, "\n</div>\n</div>\n</div>");
|
|
156
147
|
};
|
|
157
148
|
const buildMobileTooltip = _ref5 => {
|
|
158
149
|
let {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getTooltipFormatter.js","names":["colorPalette","BookType","DATE_FORMAT_OPTIONS","day","month","year","hour","minute","hour12","timeZoneName","SENTIMENT_DISPLAY_PRECISION","TOOLTIP_STYLES","MOBILE_COLUMN_WIDTH","PADDING_BOTTOM","FULL_WIDTH","calculateBucketDisplayPrecision","bucketWidth","_bucketWidth$toString","toString","split","length","findSeriesParam","params","seriesId","find","series","findSentimentSeriesParam","sentimentLongs","sentimentShorts","_sentimentLongs$index","_sentimentShorts$inde","index","dataIndex","sentimentLong","sentimentShort","getSentimentOverbalanceLabel","sentiment","bookType","Order","formatCandleData","candleData","labelCallback","open","close","low","high","candleLabel","openLabel","closeLabel","lowLabel","highLabel","concat","formatBookData","_ref","matchedBucket","bucketDisplayPrecision","isDesktop","bookLabelKey","priceRangeStart","price","toFixed","priceRangeEnd","sentimentLabel","sentimentValue","Math","abs","formatSentimentData","hasValidCandleData","hasValidSentimentData","findMatchingBucket","buckets","bucketsIndex","selectedPrice","undefined","selectedBuckets","_ref2","getTooltipFormatter","_ref3","locale","isDark","Array","isArray","candleParam","booksParam","time","Date","axisValue","value","showCandles","showSentiment","timeFormatted","toLocaleString","replace","candleSection","bookSection","sentimentSection","buildDesktopTooltip","hasMatchedBucket","buildMobileTooltip","_ref4","padding","sentimentPadding","_ref5","backgroundColor","black","white","columnWidth","fullWidth"],"sources":["../../../../../../src/CrowdViewWidget/components/Chart/chartUtils/getTooltipFormatter.ts"],"sourcesContent":["import { colorPalette } from '@oanda/labs-widget-common';\n\nimport { BookType } from '../../../../gql/types/graphql';\nimport type { Bucket, TooltipParam } from '../types';\n\nconst DATE_FORMAT_OPTIONS: Intl.DateTimeFormatOptions = {\n day: 'numeric',\n month: 'numeric',\n year: 'numeric',\n\n hour: 'numeric',\n minute: '2-digit',\n hour12: false,\n\n timeZoneName: 'shortOffset',\n};\n\nconst SENTIMENT_DISPLAY_PRECISION = 2;\n\nconst TOOLTIP_STYLES = {\n MOBILE_COLUMN_WIDTH: '33.3%',\n PADDING_BOTTOM: '4px',\n FULL_WIDTH: '100%',\n} as const;\n\nconst calculateBucketDisplayPrecision = (bucketWidth: number): number => {\n return bucketWidth.toString().split('.')[1]?.length || 0;\n};\n\nconst findSeriesParam = <T extends TooltipParam['seriesId']>(\n params: TooltipParam[],\n seriesId: T\n): Extract<TooltipParam, { seriesId: T }> | undefined => {\n return params.find(\n (series): series is Extract<TooltipParam, { seriesId: T }> =>\n series.seriesId === seriesId\n );\n};\n\nconst findSentimentSeriesParam = (\n params: TooltipParam[],\n sentimentLongs: (number | null)[],\n sentimentShorts: (number | null)[]\n): {\n sentimentLong: number | null;\n sentimentShort: number | null;\n} => {\n const index = params[0].dataIndex as number;\n\n return {\n sentimentLong: sentimentLongs[index] ?? null,\n sentimentShort: sentimentShorts[index] ?? null,\n };\n};\n\nconst getSentimentOverbalanceLabel = (\n sentiment: number,\n bookType: BookType\n): string => {\n if (sentiment < 0) {\n return bookType === BookType.Order\n ? 'sell_overbalance'\n : 'short_overbalance';\n }\n return bookType === BookType.Order ? 'buy_overbalance' : 'long_overbalance';\n};\n\nconst formatCandleData = (\n candleData: [number, number, number, number, number],\n labelCallback: (key: string) => string\n): string => {\n const [, open, close, low, high] = candleData;\n const candleLabel = labelCallback('candle');\n const openLabel = labelCallback('open');\n const closeLabel = labelCallback('close');\n const lowLabel = labelCallback('low');\n const highLabel = labelCallback('high');\n\n return `<div><b>${candleLabel}:</b></div>\n<div>${openLabel}: ${open} </div>\n<div>${closeLabel}: ${close} </div>\n<div>${lowLabel}: ${low} </div>\n<div>${highLabel}: ${high} </div>\n`;\n};\n\nconst formatBookData = ({\n matchedBucket,\n bucketWidth,\n bucketDisplayPrecision,\n bookType,\n labelCallback,\n isDesktop,\n}: {\n matchedBucket: Bucket;\n bucketWidth: number;\n bucketDisplayPrecision: number;\n bookType: BookType;\n labelCallback: (key: string) => string;\n isDesktop: boolean;\n}): string => {\n const bookLabelKey = bookType === BookType.Order ? 'orders' : 'trades';\n const priceRangeStart = matchedBucket.price.toFixed(bucketDisplayPrecision);\n const priceRangeEnd = (matchedBucket.price + bucketWidth).toFixed(\n bucketDisplayPrecision\n );\n const sentimentLabel = getSentimentOverbalanceLabel(\n matchedBucket.sentiment,\n bookType\n );\n const sentimentValue = Math.abs(matchedBucket.sentiment);\n\n return isDesktop\n ? `<div><b>${labelCallback(bookLabelKey)}:</b></div>\n<div>${labelCallback('price_range')}: ${priceRangeStart} - ${priceRangeEnd} </div>\n<div>${labelCallback(sentimentLabel)}: ${sentimentValue}% </div>`\n : `<div><b>${labelCallback(bookLabelKey)}:</b></div>\n<div>${labelCallback('price_range')}:</div>\n<div>${priceRangeStart} - ${priceRangeEnd} </div>\n<div>${labelCallback(sentimentLabel)}:</div>\n<div>${sentimentValue}% </div>`;\n};\n\nconst formatSentimentData = (\n sentimentLong: number,\n sentimentShort: number,\n labelCallback: (key: string) => string\n): string => {\n return `<div><b>${labelCallback('sentiment')}:</b></div>\n<div>${labelCallback('long')}: ${sentimentLong.toFixed(SENTIMENT_DISPLAY_PRECISION)}% </div>\n<div>${labelCallback('short')}: ${sentimentShort.toFixed(SENTIMENT_DISPLAY_PRECISION)}% </div>`;\n};\n\nconst hasValidCandleData = (\n candleData: [number, number, number, number, number]\n): boolean =>\n !!candleData[1] && !!candleData[2] && !!candleData[3] && !!candleData[4];\n\nconst hasValidSentimentData = (\n sentimentLong: number | null,\n sentimentShort: number | null\n): boolean => sentimentLong !== null && sentimentShort !== null;\n\nconst findMatchingBucket = (\n buckets: Bucket[][],\n bucketsIndex: number | undefined,\n selectedPrice: number,\n bucketWidth: number\n): Bucket | undefined => {\n if (bucketsIndex === undefined) {\n return undefined;\n }\n const selectedBuckets = buckets[bucketsIndex];\n return selectedBuckets?.find(\n ({ price }) => selectedPrice >= price && selectedPrice < price + bucketWidth\n );\n};\n\nexport const getTooltipFormatter = ({\n params,\n buckets,\n bucketWidth,\n selectedPrice,\n bookType,\n labelCallback,\n sentimentLongs,\n sentimentShorts,\n isDesktop,\n locale,\n isDark,\n}: {\n params: TooltipParam[];\n buckets: Bucket[][];\n bucketWidth: number;\n selectedPrice: number;\n bookType: BookType;\n labelCallback: (key: string) => string;\n sentimentLongs: (number | null)[];\n sentimentShorts: (number | null)[];\n isDesktop: boolean;\n locale: string;\n isDark: boolean;\n}) => {\n if (!params || !Array.isArray(params) || params.length === 0) {\n return '';\n }\n\n const candleParam = findSeriesParam(params, 'candlestick');\n const booksParam = findSeriesParam(params, 'heatmap');\n const { sentimentLong, sentimentShort } = findSentimentSeriesParam(\n params,\n sentimentLongs,\n sentimentShorts\n );\n\n if (!candleParam) {\n return '';\n }\n\n const bucketDisplayPrecision = calculateBucketDisplayPrecision(bucketWidth);\n const time = new Date(candleParam.axisValue as string);\n const candleData = candleParam.value;\n const bucketsIndex = booksParam?.value[2];\n const matchedBucket = findMatchingBucket(\n buckets,\n bucketsIndex,\n selectedPrice,\n bucketWidth\n );\n const showCandles = hasValidCandleData(candleData);\n const showSentiment = hasValidSentimentData(sentimentLong, sentimentShort);\n\n if (!showCandles && !matchedBucket) {\n return '';\n }\n\n const timeFormatted = time\n .toLocaleString(locale, DATE_FORMAT_OPTIONS)\n .replace(/\\//g, '.');\n const candleSection = showCandles\n ? formatCandleData(candleData, labelCallback)\n : '';\n\n const bookSection = matchedBucket\n ? formatBookData({\n matchedBucket,\n bucketWidth,\n bucketDisplayPrecision,\n bookType,\n labelCallback,\n isDesktop,\n })\n : '';\n\n const sentimentSection =\n showSentiment && sentimentLong && sentimentShort\n ? formatSentimentData(sentimentLong, sentimentShort, labelCallback)\n : '';\n\n if (isDesktop) {\n return buildDesktopTooltip({\n timeFormatted,\n candleSection,\n sentimentSection,\n bookSection,\n hasMatchedBucket: !!matchedBucket,\n });\n }\n\n return buildMobileTooltip({\n timeFormatted,\n candleSection,\n sentimentSection,\n bookSection,\n isDark,\n });\n};\n\ninterface TooltipSections {\n timeFormatted: string;\n candleSection: string;\n sentimentSection: string;\n bookSection: string;\n}\n\nconst buildDesktopTooltip = ({\n timeFormatted,\n candleSection,\n sentimentSection,\n bookSection,\n hasMatchedBucket,\n}: TooltipSections & { hasMatchedBucket: boolean }): string => {\n const padding = TOOLTIP_STYLES.PADDING_BOTTOM;\n const sentimentPadding = hasMatchedBucket ? padding : '0px';\n\n return `<div style=\"padding-bottom: ${padding};\">${timeFormatted}</div>\n<div style=\"padding-bottom: ${padding};\">${candleSection}</div>\n<div style=\"padding-bottom: ${sentimentPadding};\">${sentimentSection}</div>\n<div>${bookSection}</div>\n`;\n};\n\nconst buildMobileTooltip = ({\n timeFormatted,\n candleSection,\n sentimentSection,\n bookSection,\n isDark,\n}: TooltipSections & { isDark: boolean }): string => {\n const backgroundColor = isDark ? colorPalette.black : colorPalette.white;\n const columnWidth = TOOLTIP_STYLES.MOBILE_COLUMN_WIDTH;\n const fullWidth = TOOLTIP_STYLES.FULL_WIDTH;\n const padding = TOOLTIP_STYLES.PADDING_BOTTOM;\n\n return `<div style=\"width: ${fullWidth}; background-color: ${backgroundColor};\">\n <div style=\"padding-bottom: ${padding};\">${timeFormatted}</div>\n <div style=\"width: ${fullWidth}; display: flex; justify-content: space-between;\">\n <div style=\"width: ${columnWidth};\">\n${candleSection}\n</div>\n<div style=\"width: ${columnWidth};\">\n${sentimentSection}\n</div>\n<div style=\"width: ${columnWidth};\">\n${bookSection}\n</div>\n</div>\n</div>`;\n};\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"getTooltipFormatter.js","names":["colorPalette","BookType","formatFullDate","SENTIMENT_DISPLAY_PRECISION","TOOLTIP_STYLES","MOBILE_COLUMN_WIDTH","PADDING_BOTTOM","FULL_WIDTH","calculateBucketDisplayPrecision","bucketWidth","_bucketWidth$toString","toString","split","length","findSeriesParam","params","seriesId","find","series","findSentimentSeriesParam","sentimentLongs","sentimentShorts","_sentimentLongs$index","_sentimentShorts$inde","index","dataIndex","sentimentLong","sentimentShort","getSentimentOverbalanceLabel","sentiment","bookType","Order","formatCandleData","candleData","labelCallback","isDesktop","open","close","low","high","candleLabel","openLabel","closeLabel","lowLabel","highLabel","concat","formatBookData","_ref","matchedBucket","bucketDisplayPrecision","bookLabelKey","priceRangeStart","price","toFixed","priceRangeEnd","sentimentLabel","sentimentValue","Math","abs","formatSentimentData","hasValidCandleData","hasValidSentimentData","findMatchingBucket","buckets","bucketsIndex","selectedPrice","undefined","selectedBuckets","_ref2","getTooltipFormatter","_ref3","locale","isDark","Array","isArray","candleParam","booksParam","time","Date","axisValue","value","showCandles","showSentiment","timeFormatted","candleSection","bookSection","sentimentSection","buildDesktopTooltip","buildMobileTooltip","_ref4","backgroundColor","black","white","fullWidth","_ref5","columnWidth","padding"],"sources":["../../../../../../src/CrowdViewWidget/components/Chart/chartUtils/getTooltipFormatter.ts"],"sourcesContent":["import { colorPalette } from '@oanda/labs-widget-common';\n\nimport { BookType } from '../../../../gql/types/graphql';\nimport type { Bucket, TooltipParam } from '../types';\nimport { formatFullDate } from './formatFullDate';\n\nconst SENTIMENT_DISPLAY_PRECISION = 2;\n\nconst TOOLTIP_STYLES = {\n MOBILE_COLUMN_WIDTH: '33.3%',\n PADDING_BOTTOM: '4px',\n FULL_WIDTH: '100%',\n} as const;\n\nconst calculateBucketDisplayPrecision = (bucketWidth: number): number => {\n return bucketWidth.toString().split('.')[1]?.length || 0;\n};\n\nconst findSeriesParam = <T extends TooltipParam['seriesId']>(\n params: TooltipParam[],\n seriesId: T\n): Extract<TooltipParam, { seriesId: T }> | undefined => {\n return params.find(\n (series): series is Extract<TooltipParam, { seriesId: T }> =>\n series.seriesId === seriesId\n );\n};\n\nconst findSentimentSeriesParam = (\n params: TooltipParam[],\n sentimentLongs: (number | null)[],\n sentimentShorts: (number | null)[]\n): {\n sentimentLong: number | null;\n sentimentShort: number | null;\n} => {\n const index = params[0].dataIndex as number;\n\n return {\n sentimentLong: sentimentLongs[index] ?? null,\n sentimentShort: sentimentShorts[index] ?? null,\n };\n};\n\nconst getSentimentOverbalanceLabel = (\n sentiment: number,\n bookType: BookType\n): string => {\n if (sentiment < 0) {\n return bookType === BookType.Order\n ? 'sell_overbalance'\n : 'short_overbalance';\n }\n return bookType === BookType.Order ? 'buy_overbalance' : 'long_overbalance';\n};\n\nconst formatCandleData = (\n candleData: [number, number, number, number, number],\n labelCallback: (key: string) => string,\n isDesktop: boolean\n): string => {\n const [, open, close, low, high] = candleData;\n const candleLabel = labelCallback('candle');\n const openLabel = labelCallback('open');\n const closeLabel = labelCallback('close');\n const lowLabel = labelCallback('low');\n const highLabel = labelCallback('high');\n\n return isDesktop\n ? `<div><b>${candleLabel}:</b></div>\n<div style=\"display: flex; gap: 4px; margin-right: 4px;\">\n<div>${openLabel}: ${open} </div>\n<div>${closeLabel}: ${close} </div>\n<div>${lowLabel}: ${low} </div>\n<div>${highLabel}: ${high} </div>\n</div>`\n : `<div><b>${candleLabel}:</b></div>\n<div>${openLabel}: ${open} </div>\n<div>${closeLabel}: ${close} </div>\n<div>${lowLabel}: ${low} </div>\n<div>${highLabel}: ${high} </div>`;\n};\n\nconst formatBookData = ({\n matchedBucket,\n bucketWidth,\n bucketDisplayPrecision,\n bookType,\n labelCallback,\n isDesktop,\n}: {\n matchedBucket: Bucket;\n bucketWidth: number;\n bucketDisplayPrecision: number;\n bookType: BookType;\n labelCallback: (key: string) => string;\n isDesktop: boolean;\n}): string => {\n const bookLabelKey = bookType === BookType.Order ? 'orders' : 'trades';\n const priceRangeStart = matchedBucket.price.toFixed(bucketDisplayPrecision);\n const priceRangeEnd = (matchedBucket.price + bucketWidth).toFixed(\n bucketDisplayPrecision\n );\n const sentimentLabel = getSentimentOverbalanceLabel(\n matchedBucket.sentiment,\n bookType\n );\n const sentimentValue = Math.abs(matchedBucket.sentiment);\n\n return isDesktop\n ? `<div><b>${labelCallback(bookLabelKey)}:</b></div>\n<span style=\"margin-right: 4px;\">${labelCallback('price_range')}: ${priceRangeStart} - ${priceRangeEnd} </span>\n<span style=\"margin-right: 4px;\">${labelCallback(sentimentLabel)}: ${sentimentValue}% </span>`\n : `<div><b>${labelCallback(bookLabelKey)}:</b></div>\n<div>${labelCallback('price_range')}:</div>\n<div>${priceRangeStart} - ${priceRangeEnd} </div>\n<div>${labelCallback(sentimentLabel)}:</div>\n<div>${sentimentValue}% </div>`;\n};\n\nconst formatSentimentData = (\n sentimentLong: number,\n sentimentShort: number,\n labelCallback: (key: string) => string,\n isDesktop: boolean\n): string => {\n return isDesktop\n ? `<div><b>${labelCallback('sentiment')}:</b></div>\n <span style=\"margin-right: 4px;\">${labelCallback('long')}: ${sentimentLong.toFixed(SENTIMENT_DISPLAY_PRECISION)}% </span>\n <span style=\"margin-right: 4px;\">${labelCallback('short')}: ${sentimentShort.toFixed(SENTIMENT_DISPLAY_PRECISION)}% </span>`\n : `<div><b>${labelCallback('sentiment')}:</b></div>\n<div>${labelCallback('long')}: ${sentimentLong.toFixed(SENTIMENT_DISPLAY_PRECISION)}% </div>\n<div>${labelCallback('short')}: ${sentimentShort.toFixed(SENTIMENT_DISPLAY_PRECISION)}% </div>`;\n};\n\nconst hasValidCandleData = (\n candleData: [number, number, number, number, number]\n): boolean =>\n !!candleData[1] && !!candleData[2] && !!candleData[3] && !!candleData[4];\n\nconst hasValidSentimentData = (\n sentimentLong: number | null,\n sentimentShort: number | null\n): boolean => sentimentLong !== null && sentimentShort !== null;\n\nconst findMatchingBucket = (\n buckets: Bucket[][],\n bucketsIndex: number | undefined,\n selectedPrice: number,\n bucketWidth: number\n): Bucket | undefined => {\n if (bucketsIndex === undefined) {\n return undefined;\n }\n const selectedBuckets = buckets[bucketsIndex];\n return selectedBuckets?.find(\n ({ price }) => selectedPrice >= price && selectedPrice < price + bucketWidth\n );\n};\n\nexport const getTooltipFormatter = ({\n params,\n buckets,\n bucketWidth,\n selectedPrice,\n bookType,\n labelCallback,\n sentimentLongs,\n sentimentShorts,\n isDesktop,\n locale,\n isDark,\n}: {\n params: TooltipParam[];\n buckets: Bucket[][];\n bucketWidth: number;\n selectedPrice: number;\n bookType: BookType;\n labelCallback: (key: string) => string;\n sentimentLongs: (number | null)[];\n sentimentShorts: (number | null)[];\n isDesktop: boolean;\n locale: string;\n isDark: boolean;\n}) => {\n if (!params || !Array.isArray(params) || params.length === 0) {\n return '';\n }\n\n const candleParam = findSeriesParam(params, 'candlestick');\n const booksParam = findSeriesParam(params, 'heatmap');\n const { sentimentLong, sentimentShort } = findSentimentSeriesParam(\n params,\n sentimentLongs,\n sentimentShorts\n );\n\n if (!candleParam) {\n return '';\n }\n\n const bucketDisplayPrecision = calculateBucketDisplayPrecision(bucketWidth);\n const time = new Date(candleParam.axisValue as string);\n const candleData = candleParam.value;\n const bucketsIndex = booksParam?.value[2];\n const matchedBucket = findMatchingBucket(\n buckets,\n bucketsIndex,\n selectedPrice,\n bucketWidth\n );\n const showCandles = hasValidCandleData(candleData);\n const showSentiment = hasValidSentimentData(sentimentLong, sentimentShort);\n\n if (!showCandles && !matchedBucket) {\n return '';\n }\n\n const timeFormatted = formatFullDate(time, locale);\n const candleSection = showCandles\n ? formatCandleData(candleData, labelCallback, isDesktop)\n : '';\n\n const bookSection = matchedBucket\n ? formatBookData({\n matchedBucket,\n bucketWidth,\n bucketDisplayPrecision,\n bookType,\n labelCallback,\n isDesktop,\n })\n : '';\n\n const sentimentSection =\n showSentiment && sentimentLong && sentimentShort\n ? formatSentimentData(\n sentimentLong,\n sentimentShort,\n labelCallback,\n isDesktop\n )\n : '';\n\n if (isDesktop) {\n return buildDesktopTooltip({\n timeFormatted,\n candleSection,\n sentimentSection,\n bookSection,\n isDark,\n });\n }\n\n return buildMobileTooltip({\n timeFormatted,\n candleSection,\n sentimentSection,\n bookSection,\n isDark,\n });\n};\n\ninterface TooltipSections {\n timeFormatted: string;\n candleSection: string;\n sentimentSection: string;\n bookSection: string;\n}\n\nconst buildDesktopTooltip = ({\n candleSection,\n sentimentSection,\n bookSection,\n isDark,\n}: TooltipSections & {\n isDark: boolean;\n}): string => {\n const backgroundColor = isDark ? colorPalette.black : colorPalette.white;\n const fullWidth = TOOLTIP_STYLES.FULL_WIDTH;\n\n return `<div style=\"width: ${fullWidth}; background-color: ${backgroundColor};\">\n <div style=\"width: ${fullWidth}; display: flex; justify-content: space-between;\">\n <div style=\"width: 40%;\">\n${candleSection}\n</div>\n<div style=\"width: 22%;\">\n${sentimentSection}\n</div>\n<div style=\"width: 38%;\">\n${bookSection}\n</div>\n</div>\n</div>`;\n};\n\nconst buildMobileTooltip = ({\n timeFormatted,\n candleSection,\n sentimentSection,\n bookSection,\n isDark,\n}: TooltipSections & { isDark: boolean }): string => {\n const backgroundColor = isDark ? colorPalette.black : colorPalette.white;\n const columnWidth = TOOLTIP_STYLES.MOBILE_COLUMN_WIDTH;\n const fullWidth = TOOLTIP_STYLES.FULL_WIDTH;\n const padding = TOOLTIP_STYLES.PADDING_BOTTOM;\n\n return `<div style=\"width: ${fullWidth}; background-color: ${backgroundColor};\">\n <div style=\"padding-bottom: ${padding};\">${timeFormatted}</div>\n <div style=\"width: ${fullWidth}; display: flex; justify-content: space-between;\">\n <div style=\"width: ${columnWidth};\">\n${candleSection}\n</div>\n<div style=\"width: ${columnWidth};\">\n${sentimentSection}\n</div>\n<div style=\"width: ${columnWidth};\">\n${bookSection}\n</div>\n</div>\n</div>`;\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../../../src/CrowdViewWidget/components/Chart/chartUtils/index.ts"],"sourcesContent":["export * from './formatXAxisAdditionalLabel';\nexport * from './formatXAxisLabel';\nexport * from './getChartStyles';\nexport * from './getGradientColor';\nexport * from './getLabelData';\nexport * from './getRectColor';\nexport * from './getTooltipFormatter';\nexport * from './handleLabelUpdate';\nexport * from './handleTooltipUpdate';\nexport * from './isDifferenceGreaterThanTwoWeeks';\nexport * from './normalizeLocale';\n"],"mappings":"AAAA,cAAc,8BAA8B;AAC5C,cAAc,oBAAoB;AAClC,cAAc,kBAAkB;AAChC,cAAc,oBAAoB;AAClC,cAAc,gBAAgB;AAC9B,cAAc,gBAAgB;AAC9B,cAAc,uBAAuB;AACrC,cAAc,qBAAqB;AACnC,cAAc,uBAAuB;AACrC,cAAc,mCAAmC;AACjD,cAAc,mBAAmB","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../../../src/CrowdViewWidget/components/Chart/chartUtils/index.ts"],"sourcesContent":["export * from './formatFullDate';\nexport * from './formatXAxisAdditionalLabel';\nexport * from './formatXAxisLabel';\nexport * from './getChartStyles';\nexport * from './getGradientColor';\nexport * from './getLabelData';\nexport * from './getRectColor';\nexport * from './getTooltipFormatter';\nexport * from './handleLabelUpdate';\nexport * from './handleTooltipUpdate';\nexport * from './isDifferenceGreaterThanTwoWeeks';\nexport * from './normalizeLocale';\n"],"mappings":"AAAA,cAAc,kBAAkB;AAChC,cAAc,8BAA8B;AAC5C,cAAc,oBAAoB;AAClC,cAAc,kBAAkB;AAChC,cAAc,oBAAoB;AAClC,cAAc,gBAAgB;AAC9B,cAAc,gBAAgB;AAC9B,cAAc,uBAAuB;AACrC,cAAc,qBAAqB;AACnC,cAAc,uBAAuB;AACrC,cAAc,mCAAmC;AACjD,cAAc,mBAAmB","ignoreList":[]}
|
|
@@ -54,7 +54,6 @@ export const getOption = _ref => {
|
|
|
54
54
|
bookType,
|
|
55
55
|
bucketWidth,
|
|
56
56
|
buckets,
|
|
57
|
-
displayPrecision,
|
|
58
57
|
labelCallback,
|
|
59
58
|
selectedPriceRef,
|
|
60
59
|
tooltipLinesColor: styles.tooltipLinesColor,
|
|
@@ -70,12 +69,13 @@ export const getOption = _ref => {
|
|
|
70
69
|
xAxis: getXAxisConfig({
|
|
71
70
|
dates,
|
|
72
71
|
isGreaterThanTwoWeeks,
|
|
73
|
-
locale
|
|
72
|
+
locale,
|
|
73
|
+
isDesktop
|
|
74
74
|
}),
|
|
75
75
|
yAxis: getYAxisConfig({
|
|
76
|
-
isDesktop,
|
|
77
76
|
bucketWidth,
|
|
78
|
-
displayPrecision
|
|
77
|
+
displayPrecision,
|
|
78
|
+
selectedPriceRef
|
|
79
79
|
}),
|
|
80
80
|
dataZoom: getDataZoomConfig({
|
|
81
81
|
isDesktop
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getOption.js","names":["CHART_CONFIG","getDataZoomConfig","getGridConfig","getGridLines","getLabelsConfig","getSeriesCandlestickConfig","getSeriesHeatmapConfig","getSeriesSentimentConfig","getTooltipConfig","getVisualMapConfig","getXAxisConfig","getYAxisConfig","isDifferenceGreaterThanTwoWeeks","getChartStyles","getOption","_ref","mainData","dates","candlesOpen","candlesClose","candlesLow","candlesHigh","bookPrices","bookIndexes","sentimentShorts","sentimentLongs","additionalData","bucketWidth","buckets","displayPrecision","bookType","sentimentThresholdMin","sentimentThresholdMax","isLoading","isDark","isDesktop","labelCallback","locale","styles","selectedPriceRef","current","initialStartZoom","INITIAL_START_ZOOM_DESKTOP","INITIAL_START_ZOOM_MOBILE","visibleXAxisData","slice","length","INITIAL_END_ZOOM","isGreaterThanTwoWeeks","heatmapChart","sentimentChart","animation","tooltip","tooltipLinesColor","grid","xAxis","yAxis","dataZoom","visualMap","sentimentLongColor","sentimentShortColor","graphic","dataset","source","series"],"sources":["../../../../../src/CrowdViewWidget/components/Chart/getOption.ts"],"sourcesContent":["import { CHART_CONFIG } from '../../constants';\nimport {\n getDataZoomConfig,\n getGridConfig,\n getGridLines,\n getLabelsConfig,\n getSeriesCandlestickConfig,\n getSeriesHeatmapConfig,\n getSeriesSentimentConfig,\n getTooltipConfig,\n getVisualMapConfig,\n getXAxisConfig,\n getYAxisConfig,\n} from './chartOptions';\nimport { isDifferenceGreaterThanTwoWeeks } from './chartUtils';\nimport { getChartStyles } from './chartUtils/getChartStyles';\nimport type { GetOptionType } from './types';\n\nexport const getOption: GetOptionType = ({\n mainData: {\n dates,\n candlesOpen,\n candlesClose,\n candlesLow,\n candlesHigh,\n bookPrices,\n bookIndexes,\n sentimentShorts,\n sentimentLongs,\n },\n additionalData: {\n bucketWidth,\n buckets,\n displayPrecision,\n bookType,\n sentimentThresholdMin,\n sentimentThresholdMax,\n },\n isLoading,\n isDark,\n isDesktop,\n labelCallback,\n locale,\n}) => {\n const styles = getChartStyles(isDark);\n const selectedPriceRef = { current: 0 };\n\n const initialStartZoom = isDesktop\n ? CHART_CONFIG.INITIAL_START_ZOOM_DESKTOP\n : CHART_CONFIG.INITIAL_START_ZOOM_MOBILE;\n\n const visibleXAxisData = dates.slice(\n (dates.length * initialStartZoom) / 100,\n (dates.length * CHART_CONFIG.INITIAL_END_ZOOM) / 100\n );\n\n const isGreaterThanTwoWeeks = isDifferenceGreaterThanTwoWeeks(\n visibleXAxisData[0],\n visibleXAxisData[visibleXAxisData.length - 1]\n );\n\n const heatmapChart =\n bookPrices && bookPrices.length > 0\n ? [\n getSeriesHeatmapConfig({\n bucketWidth,\n buckets,\n isDark,\n sentimentThresholdMax,\n sentimentThresholdMin,\n isLoading,\n }),\n ]\n : [];\n\n const sentimentChart =\n sentimentLongs && sentimentLongs.length > 0\n ? [\n getSeriesSentimentConfig({\n styles,\n isLoading,\n }),\n ]\n : [];\n\n return {\n animation: false,\n tooltip: getTooltipConfig({\n bookType,\n bucketWidth,\n buckets,\n
|
|
1
|
+
{"version":3,"file":"getOption.js","names":["CHART_CONFIG","getDataZoomConfig","getGridConfig","getGridLines","getLabelsConfig","getSeriesCandlestickConfig","getSeriesHeatmapConfig","getSeriesSentimentConfig","getTooltipConfig","getVisualMapConfig","getXAxisConfig","getYAxisConfig","isDifferenceGreaterThanTwoWeeks","getChartStyles","getOption","_ref","mainData","dates","candlesOpen","candlesClose","candlesLow","candlesHigh","bookPrices","bookIndexes","sentimentShorts","sentimentLongs","additionalData","bucketWidth","buckets","displayPrecision","bookType","sentimentThresholdMin","sentimentThresholdMax","isLoading","isDark","isDesktop","labelCallback","locale","styles","selectedPriceRef","current","initialStartZoom","INITIAL_START_ZOOM_DESKTOP","INITIAL_START_ZOOM_MOBILE","visibleXAxisData","slice","length","INITIAL_END_ZOOM","isGreaterThanTwoWeeks","heatmapChart","sentimentChart","animation","tooltip","tooltipLinesColor","grid","xAxis","yAxis","dataZoom","visualMap","sentimentLongColor","sentimentShortColor","graphic","dataset","source","series"],"sources":["../../../../../src/CrowdViewWidget/components/Chart/getOption.ts"],"sourcesContent":["import { CHART_CONFIG } from '../../constants';\nimport {\n getDataZoomConfig,\n getGridConfig,\n getGridLines,\n getLabelsConfig,\n getSeriesCandlestickConfig,\n getSeriesHeatmapConfig,\n getSeriesSentimentConfig,\n getTooltipConfig,\n getVisualMapConfig,\n getXAxisConfig,\n getYAxisConfig,\n} from './chartOptions';\nimport { isDifferenceGreaterThanTwoWeeks } from './chartUtils';\nimport { getChartStyles } from './chartUtils/getChartStyles';\nimport type { GetOptionType } from './types';\n\nexport const getOption: GetOptionType = ({\n mainData: {\n dates,\n candlesOpen,\n candlesClose,\n candlesLow,\n candlesHigh,\n bookPrices,\n bookIndexes,\n sentimentShorts,\n sentimentLongs,\n },\n additionalData: {\n bucketWidth,\n buckets,\n displayPrecision,\n bookType,\n sentimentThresholdMin,\n sentimentThresholdMax,\n },\n isLoading,\n isDark,\n isDesktop,\n labelCallback,\n locale,\n}) => {\n const styles = getChartStyles(isDark);\n const selectedPriceRef = { current: 0 };\n\n const initialStartZoom = isDesktop\n ? CHART_CONFIG.INITIAL_START_ZOOM_DESKTOP\n : CHART_CONFIG.INITIAL_START_ZOOM_MOBILE;\n\n const visibleXAxisData = dates.slice(\n (dates.length * initialStartZoom) / 100,\n (dates.length * CHART_CONFIG.INITIAL_END_ZOOM) / 100\n );\n\n const isGreaterThanTwoWeeks = isDifferenceGreaterThanTwoWeeks(\n visibleXAxisData[0],\n visibleXAxisData[visibleXAxisData.length - 1]\n );\n\n const heatmapChart =\n bookPrices && bookPrices.length > 0\n ? [\n getSeriesHeatmapConfig({\n bucketWidth,\n buckets,\n isDark,\n sentimentThresholdMax,\n sentimentThresholdMin,\n isLoading,\n }),\n ]\n : [];\n\n const sentimentChart =\n sentimentLongs && sentimentLongs.length > 0\n ? [\n getSeriesSentimentConfig({\n styles,\n isLoading,\n }),\n ]\n : [];\n\n return {\n animation: false,\n tooltip: getTooltipConfig({\n bookType,\n bucketWidth,\n buckets,\n labelCallback,\n selectedPriceRef,\n tooltipLinesColor: styles.tooltipLinesColor,\n sentimentLongs,\n sentimentShorts,\n isDesktop,\n isDark,\n locale,\n }),\n grid: getGridConfig({ isDesktop }),\n xAxis: getXAxisConfig({\n dates,\n isGreaterThanTwoWeeks,\n locale,\n isDesktop,\n }),\n yAxis: getYAxisConfig({\n bucketWidth,\n displayPrecision,\n selectedPriceRef,\n }),\n dataZoom: getDataZoomConfig({ isDesktop }),\n visualMap: getVisualMapConfig({\n sentimentLongColor: styles.sentimentLongColor,\n sentimentShortColor: styles.sentimentShortColor,\n }),\n graphic: [\n ...getGridLines({ isDark, isDesktop }),\n ...getLabelsConfig({ isDark, isDesktop, labelCallback }),\n ],\n dataset: {\n source: {\n dates,\n candlesOpen,\n candlesClose,\n candlesLow,\n candlesHigh,\n bookPrices: bookPrices ?? [],\n bookIndexes: bookIndexes ?? [],\n sentimentShorts,\n sentimentLongs,\n },\n },\n series: [\n getSeriesCandlestickConfig({\n styles,\n isLoading,\n }),\n ...heatmapChart,\n ...sentimentChart,\n ],\n };\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -33,14 +33,15 @@ const CHART_CONFIG_STATIC = {
|
|
|
33
33
|
X_AXIS_DATE_PADDING: ' ',
|
|
34
34
|
SENTIMENT_MIN: 0,
|
|
35
35
|
SENTIMENT_MAX: 100,
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
36
|
+
TOP_LABEL_SPACE_DESKTOP: 0,
|
|
37
|
+
TOP_LABEL_SPACE_MOBILE: 24,
|
|
38
|
+
TOOLTIP_HEIGHT_MOBILE: 85,
|
|
39
|
+
TOOLTIP_HEIGHT_DESKTOP: 46,
|
|
39
40
|
TOOLTIP_OFFSET: 8
|
|
40
41
|
};
|
|
41
42
|
const CHART_CONFIG_CALCULATED = {
|
|
42
|
-
HEIGHT_DESKTOP: CHART_CONFIG_STATIC.MAIN_HEIGHT_DESKTOP + CHART_CONFIG_STATIC.
|
|
43
|
-
HEIGHT_MOBILE: CHART_CONFIG_STATIC.MAIN_HEIGHT_MOBILE + CHART_CONFIG_STATIC.X_LABEL_SIZE + CHART_CONFIG_STATIC.
|
|
43
|
+
HEIGHT_DESKTOP: CHART_CONFIG_STATIC.MAIN_HEIGHT_DESKTOP + CHART_CONFIG_STATIC.TOP_LABEL_SPACE_DESKTOP + CHART_CONFIG_STATIC.X_LABEL_SIZE + CHART_CONFIG_STATIC.TOOLTIP_HEIGHT_DESKTOP,
|
|
44
|
+
HEIGHT_MOBILE: CHART_CONFIG_STATIC.MAIN_HEIGHT_MOBILE + CHART_CONFIG_STATIC.X_LABEL_SIZE + CHART_CONFIG_STATIC.TOP_LABEL_SPACE_MOBILE + CHART_CONFIG_STATIC.TOOLTIP_HEIGHT_MOBILE
|
|
44
45
|
};
|
|
45
46
|
export const CHART_CONFIG = _objectSpread(_objectSpread({}, CHART_CONFIG_STATIC), CHART_CONFIG_CALCULATED);
|
|
46
47
|
export const COLOR_MAP = {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"constants.js","names":["colorPalette","chroma","InstrumentId","BUCKET_CONFIG","MULTIPLIER_5M","MULTIPLIER_15M","MULTIPLIER_1H","MULTIPLIER_4H","PRICE_MARGIN_MULTIPLIER","TIME_THRESHOLDS","TWO_WEEKS_MS","CHART_CONFIG_STATIC","MAIN_HEIGHT_DESKTOP","MAIN_HEIGHT_MOBILE","MARGIN_BETWEEN","SENTIMENT_HEIGHT","WIDTH","X_LABEL_SIZE","Y_LABEL_SIZE_DESKTOP","Y_LABEL_SIZE_MOBILE","Y_SENTIMENT_LABEL_DESKTOP_SIZE","Y_SENTIMENT_LABEL_MOBILE_SIZE","INITIAL_START_ZOOM_DESKTOP","INITIAL_START_ZOOM_MOBILE","INITIAL_END_ZOOM","X_AXIS_DATE_PADDING","SENTIMENT_MIN","SENTIMENT_MAX","TOP_MARGIN_DESKTOP","TOP_MARGIN_MOBILE","MOBILE_TOOLTIP_HEIGHT","TOOLTIP_OFFSET","CHART_CONFIG_CALCULATED","HEIGHT_DESKTOP","HEIGHT_MOBILE","CHART_CONFIG","_objectSpread","COLOR_MAP","dark","long","darkBlue10","shade","hex","darkBlue90","short","darkYellow10","darkYellow90","backgroundColor","black","light","lightBlue10","tint","lightBlue90","lightYellow10","lightYellow90","white","INSTRUMENTS_CONFIG","EUR_AUD","mt5name","v20name","precision","defaultBucketWidth","EUR_GBP","EUR_JPY","EUR_USD","EUR_CHF","USD_CHF","USD_JPY","USD_CAD","GBP_USD","GBP_JPY","GBP_CHF","AUD_JPY","AUD_USD","NZD_USD","XAU_USD","XAG_USD"],"sources":["../../../src/CrowdViewWidget/constants.ts"],"sourcesContent":["import { colorPalette } from '@oanda/labs-widget-common';\nimport chroma from 'chroma-js';\n\nimport { InstrumentId } from './types';\n\nexport const BUCKET_CONFIG = {\n MULTIPLIER_5M: 1,\n MULTIPLIER_15M: 1,\n MULTIPLIER_1H: 2,\n MULTIPLIER_4H: 4,\n PRICE_MARGIN_MULTIPLIER: 2,\n} as const;\n\nexport const TIME_THRESHOLDS = {\n TWO_WEEKS_MS: 14 * 24 * 60 * 60 * 1000,\n} as const;\n\nconst CHART_CONFIG_STATIC = {\n MAIN_HEIGHT_DESKTOP: 410,\n MAIN_HEIGHT_MOBILE: 330,\n MARGIN_BETWEEN: 50,\n SENTIMENT_HEIGHT: 120,\n WIDTH: 9999,\n X_LABEL_SIZE: 40,\n Y_LABEL_SIZE_DESKTOP: 50,\n Y_LABEL_SIZE_MOBILE: 40,\n Y_SENTIMENT_LABEL_DESKTOP_SIZE: 40,\n Y_SENTIMENT_LABEL_MOBILE_SIZE: 30,\n INITIAL_START_ZOOM_DESKTOP: 70,\n INITIAL_START_ZOOM_MOBILE: 85,\n INITIAL_END_ZOOM: 100,\n X_AXIS_DATE_PADDING: ' ',\n SENTIMENT_MIN: 0,\n SENTIMENT_MAX: 100,\n TOP_MARGIN_DESKTOP: 0,\n TOP_MARGIN_MOBILE: 24,\n MOBILE_TOOLTIP_HEIGHT: 85,\n TOOLTIP_OFFSET: 8,\n};\n\nconst CHART_CONFIG_CALCULATED = {\n HEIGHT_DESKTOP:\n CHART_CONFIG_STATIC.MAIN_HEIGHT_DESKTOP +\n CHART_CONFIG_STATIC.TOP_MARGIN_DESKTOP +\n CHART_CONFIG_STATIC.X_LABEL_SIZE,\n HEIGHT_MOBILE:\n CHART_CONFIG_STATIC.MAIN_HEIGHT_MOBILE +\n CHART_CONFIG_STATIC.X_LABEL_SIZE +\n CHART_CONFIG_STATIC.TOP_MARGIN_MOBILE +\n CHART_CONFIG_STATIC.MOBILE_TOOLTIP_HEIGHT,\n};\nexport const CHART_CONFIG = {\n ...CHART_CONFIG_STATIC,\n ...CHART_CONFIG_CALCULATED,\n} as const;\n\nexport const COLOR_MAP = {\n dark: {\n long: [\n chroma(colorPalette.darkBlue10).shade(0.5).hex(),\n chroma(colorPalette.darkBlue90).shade(0.5).hex(),\n ],\n short: [\n chroma(colorPalette.darkYellow10).shade(0.5).hex(),\n chroma(colorPalette.darkYellow90).shade(0.5).hex(),\n ],\n backgroundColor: colorPalette.black,\n },\n light: {\n long: [\n chroma(colorPalette.lightBlue10).tint(0.5).hex(),\n chroma(colorPalette.lightBlue90).tint(0.5).hex(),\n ],\n short: [\n chroma(colorPalette.lightYellow10).tint(0.5).hex(),\n chroma(colorPalette.lightYellow90).tint(0.5).hex(),\n ],\n backgroundColor: colorPalette.white,\n },\n} as const;\n\nexport const INSTRUMENTS_CONFIG: Record<\n InstrumentId,\n {\n precision: number;\n defaultBucketWidth: number;\n v20name: string;\n mt5name: string;\n }\n> = {\n [InstrumentId.EUR_AUD]: {\n mt5name: 'EURAUD',\n v20name: 'EUR_AUD',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.EUR_GBP]: {\n mt5name: 'EURGBP',\n v20name: 'EUR_GBP',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.EUR_JPY]: {\n mt5name: 'EURJPY',\n v20name: 'EUR_JPY',\n precision: 3,\n defaultBucketWidth: 0.05,\n },\n [InstrumentId.EUR_USD]: {\n mt5name: 'EURUSD',\n v20name: 'EUR_USD',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.EUR_CHF]: {\n mt5name: 'EURCHF',\n v20name: 'EUR_CHF',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.USD_CHF]: {\n mt5name: 'USDCHF',\n v20name: 'USD_CHF',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.USD_JPY]: {\n mt5name: 'USDJPY',\n v20name: 'USD_JPY',\n precision: 3,\n defaultBucketWidth: 0.05,\n },\n [InstrumentId.USD_CAD]: {\n mt5name: 'USDCAD',\n v20name: 'USD_CAD',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.GBP_USD]: {\n mt5name: 'GBPUSD',\n v20name: 'GBP_USD',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.GBP_JPY]: {\n mt5name: 'GBPJPY',\n v20name: 'GBP_JPY',\n precision: 3,\n defaultBucketWidth: 0.05,\n },\n [InstrumentId.GBP_CHF]: {\n mt5name: 'GBPCHF',\n v20name: 'GBP_CHF',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.AUD_JPY]: {\n mt5name: 'AUDJPY',\n v20name: 'AUD_JPY',\n precision: 3,\n defaultBucketWidth: 0.05,\n },\n [InstrumentId.AUD_USD]: {\n mt5name: 'AUDUSD',\n v20name: 'AUD_USD',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.NZD_USD]: {\n mt5name: 'NZDUSD',\n v20name: 'NZD_USD',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.XAU_USD]: {\n mt5name: 'XAUUSD',\n v20name: 'XAU_USD',\n precision: 3,\n defaultBucketWidth: 0.5,\n },\n [InstrumentId.XAG_USD]: {\n mt5name: 'XAGUSD',\n v20name: 'XAG_USD',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n};\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"constants.js","names":["colorPalette","chroma","InstrumentId","BUCKET_CONFIG","MULTIPLIER_5M","MULTIPLIER_15M","MULTIPLIER_1H","MULTIPLIER_4H","PRICE_MARGIN_MULTIPLIER","TIME_THRESHOLDS","TWO_WEEKS_MS","CHART_CONFIG_STATIC","MAIN_HEIGHT_DESKTOP","MAIN_HEIGHT_MOBILE","MARGIN_BETWEEN","SENTIMENT_HEIGHT","WIDTH","X_LABEL_SIZE","Y_LABEL_SIZE_DESKTOP","Y_LABEL_SIZE_MOBILE","Y_SENTIMENT_LABEL_DESKTOP_SIZE","Y_SENTIMENT_LABEL_MOBILE_SIZE","INITIAL_START_ZOOM_DESKTOP","INITIAL_START_ZOOM_MOBILE","INITIAL_END_ZOOM","X_AXIS_DATE_PADDING","SENTIMENT_MIN","SENTIMENT_MAX","TOP_LABEL_SPACE_DESKTOP","TOP_LABEL_SPACE_MOBILE","TOOLTIP_HEIGHT_MOBILE","TOOLTIP_HEIGHT_DESKTOP","TOOLTIP_OFFSET","CHART_CONFIG_CALCULATED","HEIGHT_DESKTOP","HEIGHT_MOBILE","CHART_CONFIG","_objectSpread","COLOR_MAP","dark","long","darkBlue10","shade","hex","darkBlue90","short","darkYellow10","darkYellow90","backgroundColor","black","light","lightBlue10","tint","lightBlue90","lightYellow10","lightYellow90","white","INSTRUMENTS_CONFIG","EUR_AUD","mt5name","v20name","precision","defaultBucketWidth","EUR_GBP","EUR_JPY","EUR_USD","EUR_CHF","USD_CHF","USD_JPY","USD_CAD","GBP_USD","GBP_JPY","GBP_CHF","AUD_JPY","AUD_USD","NZD_USD","XAU_USD","XAG_USD"],"sources":["../../../src/CrowdViewWidget/constants.ts"],"sourcesContent":["import { colorPalette } from '@oanda/labs-widget-common';\nimport chroma from 'chroma-js';\n\nimport { InstrumentId } from './types';\n\nexport const BUCKET_CONFIG = {\n MULTIPLIER_5M: 1,\n MULTIPLIER_15M: 1,\n MULTIPLIER_1H: 2,\n MULTIPLIER_4H: 4,\n PRICE_MARGIN_MULTIPLIER: 2,\n} as const;\n\nexport const TIME_THRESHOLDS = {\n TWO_WEEKS_MS: 14 * 24 * 60 * 60 * 1000,\n} as const;\n\nconst CHART_CONFIG_STATIC = {\n MAIN_HEIGHT_DESKTOP: 410,\n MAIN_HEIGHT_MOBILE: 330,\n MARGIN_BETWEEN: 50,\n SENTIMENT_HEIGHT: 120,\n WIDTH: 9999,\n X_LABEL_SIZE: 40,\n Y_LABEL_SIZE_DESKTOP: 50,\n Y_LABEL_SIZE_MOBILE: 40,\n Y_SENTIMENT_LABEL_DESKTOP_SIZE: 40,\n Y_SENTIMENT_LABEL_MOBILE_SIZE: 30,\n INITIAL_START_ZOOM_DESKTOP: 70,\n INITIAL_START_ZOOM_MOBILE: 85,\n INITIAL_END_ZOOM: 100,\n X_AXIS_DATE_PADDING: ' ',\n SENTIMENT_MIN: 0,\n SENTIMENT_MAX: 100,\n TOP_LABEL_SPACE_DESKTOP: 0,\n TOP_LABEL_SPACE_MOBILE: 24,\n TOOLTIP_HEIGHT_MOBILE: 85,\n TOOLTIP_HEIGHT_DESKTOP: 46,\n TOOLTIP_OFFSET: 8,\n};\n\nconst CHART_CONFIG_CALCULATED = {\n HEIGHT_DESKTOP:\n CHART_CONFIG_STATIC.MAIN_HEIGHT_DESKTOP +\n CHART_CONFIG_STATIC.TOP_LABEL_SPACE_DESKTOP +\n CHART_CONFIG_STATIC.X_LABEL_SIZE +\n CHART_CONFIG_STATIC.TOOLTIP_HEIGHT_DESKTOP,\n HEIGHT_MOBILE:\n CHART_CONFIG_STATIC.MAIN_HEIGHT_MOBILE +\n CHART_CONFIG_STATIC.X_LABEL_SIZE +\n CHART_CONFIG_STATIC.TOP_LABEL_SPACE_MOBILE +\n CHART_CONFIG_STATIC.TOOLTIP_HEIGHT_MOBILE,\n};\nexport const CHART_CONFIG = {\n ...CHART_CONFIG_STATIC,\n ...CHART_CONFIG_CALCULATED,\n} as const;\n\nexport const COLOR_MAP = {\n dark: {\n long: [\n chroma(colorPalette.darkBlue10).shade(0.5).hex(),\n chroma(colorPalette.darkBlue90).shade(0.5).hex(),\n ],\n short: [\n chroma(colorPalette.darkYellow10).shade(0.5).hex(),\n chroma(colorPalette.darkYellow90).shade(0.5).hex(),\n ],\n backgroundColor: colorPalette.black,\n },\n light: {\n long: [\n chroma(colorPalette.lightBlue10).tint(0.5).hex(),\n chroma(colorPalette.lightBlue90).tint(0.5).hex(),\n ],\n short: [\n chroma(colorPalette.lightYellow10).tint(0.5).hex(),\n chroma(colorPalette.lightYellow90).tint(0.5).hex(),\n ],\n backgroundColor: colorPalette.white,\n },\n} as const;\n\nexport const INSTRUMENTS_CONFIG: Record<\n InstrumentId,\n {\n precision: number;\n defaultBucketWidth: number;\n v20name: string;\n mt5name: string;\n }\n> = {\n [InstrumentId.EUR_AUD]: {\n mt5name: 'EURAUD',\n v20name: 'EUR_AUD',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.EUR_GBP]: {\n mt5name: 'EURGBP',\n v20name: 'EUR_GBP',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.EUR_JPY]: {\n mt5name: 'EURJPY',\n v20name: 'EUR_JPY',\n precision: 3,\n defaultBucketWidth: 0.05,\n },\n [InstrumentId.EUR_USD]: {\n mt5name: 'EURUSD',\n v20name: 'EUR_USD',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.EUR_CHF]: {\n mt5name: 'EURCHF',\n v20name: 'EUR_CHF',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.USD_CHF]: {\n mt5name: 'USDCHF',\n v20name: 'USD_CHF',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.USD_JPY]: {\n mt5name: 'USDJPY',\n v20name: 'USD_JPY',\n precision: 3,\n defaultBucketWidth: 0.05,\n },\n [InstrumentId.USD_CAD]: {\n mt5name: 'USDCAD',\n v20name: 'USD_CAD',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.GBP_USD]: {\n mt5name: 'GBPUSD',\n v20name: 'GBP_USD',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.GBP_JPY]: {\n mt5name: 'GBPJPY',\n v20name: 'GBP_JPY',\n precision: 3,\n defaultBucketWidth: 0.05,\n },\n [InstrumentId.GBP_CHF]: {\n mt5name: 'GBPCHF',\n v20name: 'GBP_CHF',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.AUD_JPY]: {\n mt5name: 'AUDJPY',\n v20name: 'AUD_JPY',\n precision: 3,\n defaultBucketWidth: 0.05,\n },\n [InstrumentId.AUD_USD]: {\n mt5name: 'AUDUSD',\n v20name: 'AUD_USD',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.NZD_USD]: {\n mt5name: 'NZDUSD',\n v20name: 'NZD_USD',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n [InstrumentId.XAU_USD]: {\n mt5name: 'XAUUSD',\n v20name: 'XAU_USD',\n precision: 3,\n defaultBucketWidth: 0.5,\n },\n [InstrumentId.XAG_USD]: {\n mt5name: 'XAGUSD',\n v20name: 'XAG_USD',\n precision: 5,\n defaultBucketWidth: 0.0005,\n },\n};\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -29,6 +29,7 @@
|
|
|
29
29
|
"sentiment": "Sentiment",
|
|
30
30
|
"short": "Short",
|
|
31
31
|
"short_overbalance": "Short overbalance",
|
|
32
|
-
"tap_chart_to_see_more_details": "Tap chart to see more details",
|
|
32
|
+
"tap_chart_to_see_more_details": "Tap the chart to see more details",
|
|
33
|
+
"hover_chart_to_see_more_details": "Hover over the chart to see more details",
|
|
33
34
|
"trades": "Trades"
|
|
34
35
|
}
|
|
@@ -5,7 +5,6 @@ interface GetTooltipConfigParams {
|
|
|
5
5
|
bookType: BookType;
|
|
6
6
|
bucketWidth: number;
|
|
7
7
|
buckets: Bucket[][];
|
|
8
|
-
displayPrecision: number;
|
|
9
8
|
labelCallback: (key: string, params?: Record<string, unknown>) => string;
|
|
10
9
|
selectedPriceRef: {
|
|
11
10
|
current: number;
|
|
@@ -17,5 +16,5 @@ interface GetTooltipConfigParams {
|
|
|
17
16
|
isDark: boolean;
|
|
18
17
|
locale: string;
|
|
19
18
|
}
|
|
20
|
-
export declare const getTooltipConfig: ({ bookType, bucketWidth, buckets,
|
|
19
|
+
export declare const getTooltipConfig: ({ bookType, bucketWidth, buckets, labelCallback, selectedPriceRef, tooltipLinesColor, sentimentLongs, sentimentShorts, isDesktop, isDark, locale, }: GetTooltipConfigParams) => TooltipComponentOption;
|
|
21
20
|
export {};
|
|
@@ -3,6 +3,7 @@ interface GetXAxisConfigParams {
|
|
|
3
3
|
dates: string[];
|
|
4
4
|
isGreaterThanTwoWeeks: boolean;
|
|
5
5
|
locale: string;
|
|
6
|
+
isDesktop: boolean;
|
|
6
7
|
}
|
|
7
|
-
export declare const getXAxisConfig: ({ dates, isGreaterThanTwoWeeks, locale, }: GetXAxisConfigParams) => XAXisComponentOption[];
|
|
8
|
+
export declare const getXAxisConfig: ({ dates, isGreaterThanTwoWeeks, locale, isDesktop, }: GetXAxisConfigParams) => XAXisComponentOption[];
|
|
8
9
|
export {};
|
|
@@ -2,7 +2,9 @@ import type { YAXisComponentOption } from 'echarts';
|
|
|
2
2
|
interface GetYAxisConfigParams {
|
|
3
3
|
bucketWidth: number;
|
|
4
4
|
displayPrecision: number;
|
|
5
|
-
|
|
5
|
+
selectedPriceRef: {
|
|
6
|
+
current: number;
|
|
7
|
+
};
|
|
6
8
|
}
|
|
7
|
-
export declare const getYAxisConfig: ({ bucketWidth, displayPrecision,
|
|
9
|
+
export declare const getYAxisConfig: ({ bucketWidth, displayPrecision, selectedPriceRef, }: GetYAxisConfigParams) => YAXisComponentOption[];
|
|
8
10
|
export {};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const formatFullDate: (date: Date, locale: string) => string;
|
|
@@ -28,9 +28,10 @@ export declare const CHART_CONFIG: {
|
|
|
28
28
|
readonly X_AXIS_DATE_PADDING: string;
|
|
29
29
|
readonly SENTIMENT_MIN: number;
|
|
30
30
|
readonly SENTIMENT_MAX: number;
|
|
31
|
-
readonly
|
|
32
|
-
readonly
|
|
33
|
-
readonly
|
|
31
|
+
readonly TOP_LABEL_SPACE_DESKTOP: number;
|
|
32
|
+
readonly TOP_LABEL_SPACE_MOBILE: number;
|
|
33
|
+
readonly TOOLTIP_HEIGHT_MOBILE: number;
|
|
34
|
+
readonly TOOLTIP_HEIGHT_DESKTOP: number;
|
|
34
35
|
readonly TOOLTIP_OFFSET: number;
|
|
35
36
|
};
|
|
36
37
|
export declare const COLOR_MAP: {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@oanda/labs-crowd-view-widget",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.57",
|
|
4
4
|
"description": "Labs Crowd View Widget",
|
|
5
5
|
"main": "dist/main/index.js",
|
|
6
6
|
"module": "dist/module/index.js",
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
"author": "OANDA",
|
|
14
14
|
"license": "UNLICENSED",
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@oanda/labs-widget-common": "^1.0.
|
|
16
|
+
"@oanda/labs-widget-common": "^1.0.239",
|
|
17
17
|
"@oanda/mono-i18n": "10.0.1",
|
|
18
18
|
"chroma-js": "^3.1.2",
|
|
19
19
|
"decimal.js": "^10.6.0",
|
|
@@ -24,5 +24,5 @@
|
|
|
24
24
|
"@graphql-codegen/client-preset": "4.1.0",
|
|
25
25
|
"@types/chroma-js": "^3.1.2"
|
|
26
26
|
},
|
|
27
|
-
"gitHead": "
|
|
27
|
+
"gitHead": "a4fa86d785d1359fdb0eba942e26a4e9b99b72f2"
|
|
28
28
|
}
|
|
@@ -19,12 +19,10 @@ import {
|
|
|
19
19
|
import * as echarts from 'echarts/core';
|
|
20
20
|
import { CanvasRenderer } from 'echarts/renderers';
|
|
21
21
|
import React, { useCallback, useEffect, useMemo, useRef } from 'react';
|
|
22
|
-
import { useMediaQuery } from 'usehooks-ts';
|
|
23
22
|
|
|
24
23
|
import { CHART_CONFIG } from '../../constants';
|
|
25
24
|
import {
|
|
26
25
|
handleLabelUpdate,
|
|
27
|
-
handleTooltipUpdate,
|
|
28
26
|
isDifferenceGreaterThanTwoWeeks,
|
|
29
27
|
normalizeLocale,
|
|
30
28
|
} from './chartUtils';
|
|
@@ -56,11 +54,8 @@ const Chart = ({
|
|
|
56
54
|
}: ChartProps) => {
|
|
57
55
|
const { isDark } = useLayoutProvider();
|
|
58
56
|
const { lang, locale } = useLocale();
|
|
59
|
-
const canHover = useMediaQuery('(hover: hover)');
|
|
60
57
|
const labelTimerRef = useRef<NodeJS.Timeout | null>(null);
|
|
61
58
|
const isGreaterThanTwoWeeksRef = useRef<boolean | null>(null);
|
|
62
|
-
const zoomTimerRef = useRef<NodeJS.Timeout | null>(null);
|
|
63
|
-
const tooltipVisibleRef = useRef<boolean>(true);
|
|
64
59
|
|
|
65
60
|
const initialIsGreaterThanTwoWeeks = useMemo(() => {
|
|
66
61
|
const { dates } = mainData;
|
|
@@ -104,7 +99,6 @@ const Chart = ({
|
|
|
104
99
|
// Memoize event handler to prevent unnecessary re-renders
|
|
105
100
|
const handleDataZoom = useCallback(
|
|
106
101
|
(_params: DataZoomEvent, instance: EChartsType) => {
|
|
107
|
-
handleTooltipUpdate(instance, zoomTimerRef, tooltipVisibleRef, canHover);
|
|
108
102
|
handleLabelUpdate(
|
|
109
103
|
instance,
|
|
110
104
|
mainData,
|
|
@@ -113,7 +107,7 @@ const Chart = ({
|
|
|
113
107
|
normalizeLocale(locale)
|
|
114
108
|
);
|
|
115
109
|
},
|
|
116
|
-
[mainData,
|
|
110
|
+
[mainData, locale]
|
|
117
111
|
);
|
|
118
112
|
|
|
119
113
|
const chartHeight = isDesktop
|
|
@@ -14,11 +14,12 @@ export const getGridConfig = ({
|
|
|
14
14
|
Y_SENTIMENT_LABEL_MOBILE_SIZE,
|
|
15
15
|
Y_LABEL_SIZE_DESKTOP,
|
|
16
16
|
Y_LABEL_SIZE_MOBILE,
|
|
17
|
-
|
|
18
|
-
|
|
17
|
+
TOP_LABEL_SPACE_DESKTOP,
|
|
18
|
+
TOP_LABEL_SPACE_MOBILE,
|
|
19
19
|
MAIN_HEIGHT_DESKTOP,
|
|
20
20
|
MAIN_HEIGHT_MOBILE,
|
|
21
|
-
|
|
21
|
+
TOOLTIP_HEIGHT_MOBILE,
|
|
22
|
+
TOOLTIP_HEIGHT_DESKTOP,
|
|
22
23
|
} = CHART_CONFIG;
|
|
23
24
|
|
|
24
25
|
const mainHeight = isDesktop ? MAIN_HEIGHT_DESKTOP : MAIN_HEIGHT_MOBILE;
|
|
@@ -26,7 +27,7 @@ export const getGridConfig = ({
|
|
|
26
27
|
const position = {
|
|
27
28
|
left: `${isDesktop ? Y_SENTIMENT_LABEL_DESKTOP_SIZE : Y_SENTIMENT_LABEL_MOBILE_SIZE}px`,
|
|
28
29
|
right: `${isDesktop ? Y_LABEL_SIZE_DESKTOP : Y_LABEL_SIZE_MOBILE}px`,
|
|
29
|
-
top: `${isDesktop ?
|
|
30
|
+
top: `${isDesktop ? TOP_LABEL_SPACE_DESKTOP + TOOLTIP_HEIGHT_DESKTOP : TOP_LABEL_SPACE_MOBILE + TOOLTIP_HEIGHT_MOBILE}px`,
|
|
30
31
|
height: `${mainHeight}px`,
|
|
31
32
|
};
|
|
32
33
|
return [
|