@oanda/labs-crowd-view-widget 1.0.51 → 1.0.53

package/dist/main/CrowdViewWidget/components/Chart/ChartWithData.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.ChartWithData = void 0;
 var _labsWidgetCommon = require("@oanda/labs-widget-common");
 var _react = _interopRequireDefault(require("react"));
+var _Legend = require("../Legend");
 var _Chart = require("./Chart");
 var _useCrowdViewData = require("./useCrowdViewData");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -17,11 +18,13 @@ const ChartWithData = _ref => {
     granularity
   } = _ref;
   const {
-    size
+    size,
+    isDark
   } = (0, _labsWidgetCommon.useLayoutProvider)();
   const isDesktop = size === _labsWidgetCommon.Size.DESKTOP;
   const {
-    data,
+    mainData,
+    additionalData,
     loading,
     error
   } = (0, _useCrowdViewData.useCrowdViewData)({
@@ -31,19 +34,25 @@ const ChartWithData = _ref => {
     granularity
   });
   return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement("div", {
-    className: "lw-relative lw-h-[450px] lw-w-full"
+    className: "lw-relative lw-h-[610px] lw-w-full"
   }, error && _react.default.createElement("div", {
-    className: "lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-[calc(100%-30px)] lw-w-full lw-items-center lw-justify-center lw-border lw-border-solid lw-border-border-primary"
+    className: "lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full lw-items-center lw-justify-center lw-border lw-border-solid lw-border-border-primary"
   }, _react.default.createElement(_labsWidgetCommon.ChartError, null)), loading && _react.default.createElement("div", {
-    className: "lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-[calc(100%-30px)] lw-w-full lw-items-center lw-justify-center lw-border lw-border-solid lw-border-border-primary"
+    className: "lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full lw-items-center lw-justify-center lw-border lw-border-solid lw-border-border-primary"
   }, _react.default.createElement(_labsWidgetCommon.Spinner, {
     size: _labsWidgetCommon.SpinnerSize.lg
-  })), !loading && !error && !!data && _react.default.createElement("div", {
+  })), !loading && !error && !!mainData && !!additionalData && _react.default.createElement("div", {
     className: "lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full"
   }, _react.default.createElement(_Chart.Chart, {
-    data: data,
-    isDesktop: isDesktop
-  }))));
+    additionalData: additionalData,
+    isDesktop: isDesktop,
+    mainData: mainData
+  }))), _react.default.createElement(_Legend.Legend, {
+    bookType: bookType,
+    isDark: isDark,
+    longValues: [additionalData === null || additionalData === void 0 ? void 0 : additionalData.sentimentThresholdMin, additionalData === null || additionalData === void 0 ? void 0 : additionalData.sentimentThresholdMax],
+    shortValues: [additionalData === null || additionalData === void 0 ? void 0 : additionalData.sentimentThresholdMin, additionalData === null || additionalData === void 0 ? void 0 : additionalData.sentimentThresholdMax]
+  }));
 };
 exports.ChartWithData = ChartWithData;
 //# sourceMappingURL=ChartWithData.js.map

package/dist/main/CrowdViewWidget/components/Chart/ChartWithData.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChartWithData.js","names":["_labsWidgetCommon","require","_react","_interopRequireDefault","_Chart","_useCrowdViewData","e","__esModule","default","ChartWithData","_ref","instrument","bookType","division","granularity","size","useLayoutProvider","isDesktop","Size","DESKTOP","data","loading","error","useCrowdViewData","createElement","Fragment","className","ChartError","Spinner","SpinnerSize","lg","Chart","exports"],"sources":["../../../../../src/CrowdViewWidget/components/Chart/ChartWithData.tsx"],"sourcesContent":["import {\n  ChartError,\n  Size,\n  Spinner,\n  SpinnerSize,\n  useLayoutProvider,\n} from '@oanda/labs-widget-common';\nimport React from 'react';\n\nimport { Chart } from './Chart';\nimport type { ChartWithDataProps } from './types';\nimport { useCrowdViewData } from './useCrowdViewData';\n\nconst ChartWithData = ({\n  instrument,\n  bookType,\n  division,\n  granularity,\n}: ChartWithDataProps) => {\n  const { size } = useLayoutProvider();\n  const isDesktop = size === Size.DESKTOP;\n\n  const { data, loading, error } = useCrowdViewData({\n    instrument,\n    bookType,\n    division,\n    granularity,\n  });\n\n  return (\n    <>\n      <div className=\"lw-relative lw-h-[450px] lw-w-full\">\n        {error && (\n          <div className=\"lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-[calc(100%-30px)] lw-w-full lw-items-center lw-justify-center lw-border lw-border-solid lw-border-border-primary\">\n            <ChartError />\n          </div>\n        )}\n        {loading && (\n          <div className=\"lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-[calc(100%-30px)] lw-w-full lw-items-center lw-justify-center lw-border lw-border-solid lw-border-border-primary\">\n            <Spinner size={SpinnerSize.lg} />\n          </div>\n        )}\n        {!loading && !error && !!data && (\n          <div className=\"lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full\">\n            <Chart data={data} isDesktop={isDesktop} />\n          </div>\n        )}\n      </div>\n    </>\n  );\n};\n\nexport { ChartWithData };\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,OAAA;AAOA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEA,IAAAG,MAAA,GAAAH,OAAA;AAEA,IAAAI,iBAAA,GAAAJ,OAAA;AAAsD,SAAAE,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEtD,MAAMG,aAAa,GAAGC,IAAA,IAKI;EAAA,IALH;IACrBC,UAAU;IACVC,QAAQ;IACRC,QAAQ;IACRC;EACkB,CAAC,GAAAJ,IAAA;EACnB,MAAM;IAAEK;EAAK,CAAC,GAAG,IAAAC,mCAAiB,EAAC,CAAC;EACpC,MAAMC,SAAS,GAAGF,IAAI,KAAKG,sBAAI,CAACC,OAAO;EAEvC,MAAM;IAAEC,IAAI;IAAEC,OAAO;IAAEC;EAAM,CAAC,GAAG,IAAAC,kCAAgB,EAAC;IAChDZ,UAAU;IACVC,QAAQ;IACRC,QAAQ;IACRC;EACF,CAAC,CAAC;EAEF,OACEZ,MAAA,CAAAM,OAAA,CAAAgB,aAAA,CAAAtB,MAAA,CAAAM,OAAA,CAAAiB,QAAA,QACEvB,MAAA,CAAAM,OAAA,CAAAgB,aAAA;IAAKE,SAAS,EAAC;EAAoC,GAChDJ,KAAK,IACJpB,MAAA,CAAAM,OAAA,CAAAgB,aAAA;IAAKE,SAAS,EAAC;EAA8J,GAC3KxB,MAAA,CAAAM,OAAA,CAAAgB,aAAA,CAACxB,iBAAA,CAAA2B,UAAU,MAAE,CACV,CACN,EACAN,OAAO,IACNnB,MAAA,CAAAM,OAAA,CAAAgB,aAAA;IAAKE,SAAS,EAAC;EAA8J,GAC3KxB,MAAA,CAAAM,OAAA,CAAAgB,aAAA,CAACxB,iBAAA,CAAA4B,OAAO;IAACb,IAAI,EAAEc,6BAAW,CAACC;EAAG,CAAE,CAC7B,CACN,EACA,CAACT,OAAO,IAAI,CAACC,KAAK,IAAI,CAAC,CAACF,IAAI,IAC3BlB,MAAA,CAAAM,OAAA,CAAAgB,aAAA;IAAKE,SAAS,EAAC;EAA4D,GACzExB,MAAA,CAAAM,OAAA,CAAAgB,aAAA,CAACpB,MAAA,CAAA2B,KAAK;IAACX,IAAI,EAAEA,IAAK;IAACH,SAAS,EAAEA;EAAU,CAAE,CACvC,CAEJ,CACL,CAAC;AAEP,CAAC;AAACe,OAAA,CAAAvB,aAAA,GAAAA,aAAA","ignoreList":[]}
+{"version":3,"file":"ChartWithData.js","names":["_labsWidgetCommon","require","_react","_interopRequireDefault","_Legend","_Chart","_useCrowdViewData","e","__esModule","default","ChartWithData","_ref","instrument","bookType","division","granularity","size","isDark","useLayoutProvider","isDesktop","Size","DESKTOP","mainData","additionalData","loading","error","useCrowdViewData","createElement","Fragment","className","ChartError","Spinner","SpinnerSize","lg","Chart","Legend","longValues","sentimentThresholdMin","sentimentThresholdMax","shortValues","exports"],"sources":["../../../../../src/CrowdViewWidget/components/Chart/ChartWithData.tsx"],"sourcesContent":["import {\n  ChartError,\n  Size,\n  Spinner,\n  SpinnerSize,\n  useLayoutProvider,\n} from '@oanda/labs-widget-common';\nimport React from 'react';\n\nimport { Legend } from '../Legend';\nimport { Chart } from './Chart';\nimport type { ChartWithDataProps } from './types';\nimport { useCrowdViewData } from './useCrowdViewData';\n\nconst ChartWithData = ({\n  instrument,\n  bookType,\n  division,\n  granularity,\n}: ChartWithDataProps) => {\n  const { size, isDark } = useLayoutProvider();\n  const isDesktop = size === Size.DESKTOP;\n\n  const { mainData, additionalData, loading, error } = useCrowdViewData({\n    instrument,\n    bookType,\n    division,\n    granularity,\n  });\n\n  return (\n    <>\n      <div className=\"lw-relative lw-h-[610px] lw-w-full\">\n        {error && (\n          <div className=\"lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full lw-items-center lw-justify-center lw-border lw-border-solid lw-border-border-primary\">\n            <ChartError />\n          </div>\n        )}\n        {loading && (\n          <div className=\"lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full lw-items-center lw-justify-center lw-border lw-border-solid lw-border-border-primary\">\n            <Spinner size={SpinnerSize.lg} />\n          </div>\n        )}\n        {!loading && !error && !!mainData && !!additionalData && (\n          <div className=\"lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full\">\n            <Chart\n              additionalData={additionalData}\n              isDesktop={isDesktop}\n              mainData={mainData}\n            />\n          </div>\n        )}\n      </div>\n      <Legend\n        bookType={bookType}\n        isDark={isDark}\n        longValues={[\n          additionalData?.sentimentThresholdMin,\n          additionalData?.sentimentThresholdMax,\n        ]}\n        shortValues={[\n          additionalData?.sentimentThresholdMin,\n          additionalData?.sentimentThresholdMax,\n        ]}\n      />\n    </>\n  );\n};\n\nexport { ChartWithData };\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,OAAA;AAOA,IAAAC,MAAA,GAAAC,sBAAA,CAAAF,OAAA;AAEA,IAAAG,OAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AAEA,IAAAK,iBAAA,GAAAL,OAAA;AAAsD,SAAAE,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEtD,MAAMG,aAAa,GAAGC,IAAA,IAKI;EAAA,IALH;IACrBC,UAAU;IACVC,QAAQ;IACRC,QAAQ;IACRC;EACkB,CAAC,GAAAJ,IAAA;EACnB,MAAM;IAAEK,IAAI;IAAEC;EAAO,CAAC,GAAG,IAAAC,mCAAiB,EAAC,CAAC;EAC5C,MAAMC,SAAS,GAAGH,IAAI,KAAKI,sBAAI,CAACC,OAAO;EAEvC,MAAM;IAAEC,QAAQ;IAAEC,cAAc;IAAEC,OAAO;IAAEC;EAAM,CAAC,GAAG,IAAAC,kCAAgB,EAAC;IACpEd,UAAU;IACVC,QAAQ;IACRC,QAAQ;IACRC;EACF,CAAC,CAAC;EAEF,OACEb,MAAA,CAAAO,OAAA,CAAAkB,aAAA,CAAAzB,MAAA,CAAAO,OAAA,CAAAmB,QAAA,QACE1B,MAAA,CAAAO,OAAA,CAAAkB,aAAA;IAAKE,SAAS,EAAC;EAAoC,GAChDJ,KAAK,IACJvB,MAAA,CAAAO,OAAA,CAAAkB,aAAA;IAAKE,SAAS,EAAC;EAAiJ,GAC9J3B,MAAA,CAAAO,OAAA,CAAAkB,aAAA,CAAC3B,iBAAA,CAAA8B,UAAU,MAAE,CACV,CACN,EACAN,OAAO,IACNtB,MAAA,CAAAO,OAAA,CAAAkB,aAAA;IAAKE,SAAS,EAAC;EAAiJ,GAC9J3B,MAAA,CAAAO,OAAA,CAAAkB,aAAA,CAAC3B,iBAAA,CAAA+B,OAAO;IAACf,IAAI,EAAEgB,6BAAW,CAACC;EAAG,CAAE,CAC7B,CACN,EACA,CAACT,OAAO,IAAI,CAACC,KAAK,IAAI,CAAC,CAACH,QAAQ,IAAI,CAAC,CAACC,cAAc,IACnDrB,MAAA,CAAAO,OAAA,CAAAkB,aAAA;IAAKE,SAAS,EAAC;EAA4D,GACzE3B,MAAA,CAAAO,OAAA,CAAAkB,aAAA,CAACtB,MAAA,CAAA6B,KAAK;IACJX,cAAc,EAAEA,cAAe;IAC/BJ,SAAS,EAAEA,SAAU;IACrBG,QAAQ,EAAEA;EAAS,CACpB,CACE,CAEJ,CAAC,EACNpB,MAAA,CAAAO,OAAA,CAAAkB,aAAA,CAACvB,OAAA,CAAA+B,MAAM;IACLtB,QAAQ,EAAEA,QAAS;IACnBI,MAAM,EAAEA,MAAO;IACfmB,UAAU,EAAE,CACVb,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAEc,qBAAqB,EACrCd,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAEe,qBAAqB,CACrC;IACFC,WAAW,EAAE,CACXhB,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAEc,qBAAqB,EACrCd,cAAc,aAAdA,cAAc,uBAAdA,cAAc,CAAEe,qBAAqB;EACrC,CACH,CACD,CAAC;AAEP,CAAC;AAACE,OAAA,CAAA9B,aAAA,GAAAA,aAAA","ignoreList":[]}

package/dist/main/CrowdViewWidget/components/Chart/chartOptions.js

@@ -4,69 +4,92 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getOption = void 0;
-var _labsWidgetCommon = require("@oanda/labs-widget-common");
+var _chromaJs = _interopRequireDefault(require("chroma-js"));
 var _constants = require("../../constants");
 var _chartUtils = require("./utils/chartUtils");
-function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
-function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
-function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
-function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
-function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
-const getOption = (_ref, isDark, isDesktop, labelCallback) => {
+var _getChartStyles = require("./utils/getChartStyles");
+var _getGridLines = require("./utils/getGridLines");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+const getOption = _ref => {
   let {
-    xAxisData,
-    candlesSeriesData,
-    orderPositionBooks,
-    bucketWidth,
-    buckets,
-    precision,
-    bookType
+    mainData: {
+      dates,
+      candlesOpen,
+      candlesClose,
+      candlesLow,
+      candlesHigh,
+      bookPrices,
+      bookIndexes,
+      sentimentShorts,
+      sentimentLongs
+    },
+    additionalData: {
+      bucketWidth,
+      buckets,
+      displayPrecision,
+      bookType,
+      sentimentThresholdMin,
+      sentimentThresholdMax
+    },
+    isDark,
+    isDesktop,
+    labelCallback
   } = _ref;
   let selectedPrice;
-  const visibleXAxisData = xAxisData.slice(xAxisData.length * _constants.CHART_CONFIG.INITIAL_START_ZOOM / 100, xAxisData.length * _constants.CHART_CONFIG.INITIAL_END_ZOOM / 100);
+  const {
+    sentimentLongColor,
+    sentimentShortColor,
+    candleLongColor,
+    candleShortColor,
+    sentimentAreaOpacity,
+    tooltipLinesColor,
+    sentimentLabelColor
+  } = (0, _getChartStyles.getChartStyles)(isDark);
+  const visibleXAxisData = dates.slice(dates.length * _constants.CHART_CONFIG.INITIAL_START_ZOOM / 100, dates.length * _constants.CHART_CONFIG.INITIAL_END_ZOOM / 100);
   const isGreaterThanTwoWeeks = (0, _chartUtils.isDifferenceGreaterThanTwoWeeks)(visibleXAxisData[0], visibleXAxisData[visibleXAxisData.length - 1]);
   const labelsData = (0, _chartUtils.getLabelData)({
-    xAxisData,
+    dates,
     isGreaterThanTwoWeeks
   });
-  const gridLines = (0, _labsWidgetCommon.getGridLines)({
+  const gridMainLines = (0, _getGridLines.getGridLines)({
     isDark,
-    chartWidth: _constants.CHART_CONFIG.WIDTH,
-    chartHeight: _constants.CHART_CONFIG.HEIGHT,
-    xLabelsSize: _constants.CHART_CONFIG.X_LABEL_SIZE,
-    yLabelSize: isDesktop ? _constants.CHART_CONFIG.Y_LABEL_SIZE_DESKTOP : _constants.CHART_CONFIG.Y_LABEL_SIZE_MOBILE,
-    bottomLeftBox: false
+    isDesktop
   });
   return {
     animation: false,
     dataZoom: [{
+      id: 'main',
       type: 'inside',
       xAxisIndex: 0,
       start: _constants.CHART_CONFIG.INITIAL_START_ZOOM,
-      end: _constants.CHART_CONFIG.INITIAL_END_ZOOM
+      end: _constants.CHART_CONFIG.INITIAL_END_ZOOM,
+      filterMode: 'filter'
+    }, {
+      id: 'sentiment',
+      type: 'inside',
+      xAxisIndex: 1,
+      start: _constants.CHART_CONFIG.INITIAL_START_ZOOM,
+      end: _constants.CHART_CONFIG.INITIAL_END_ZOOM,
+      filterMode: 'none'
     }],
     tooltip: {
       trigger: 'axis',
       axisPointer: {
         type: 'cross',
         axis: 'x',
+        lineStyle: {
+          color: tooltipLinesColor
+        },
         crossStyle: {
-          color: isDark ? _labsWidgetCommon.colorPalette.orange : _labsWidgetCommon.themeColors.borderPrimary.light
+          color: tooltipLinesColor
         },
         label: {
+          padding: 0,
+          lineHeight: 24,
           formatter: params => {
-            if (params.axisDimension === 'y') {
+            if (params.axisDimension === 'y' && params.axisIndex === 0) {
               selectedPrice = Number(params.value);
-              return Number(params.value).toFixed(precision);
-            }
-            if (params.axisDimension === 'x') {
-              const date = new Date(params.value);
-              return date.toLocaleString(undefined, {
-                hour: '2-digit',
-                minute: '2-digit',
-                day: 'numeric',
-                month: 'short'
-              });
+              return " ".concat(Number(params.value).toFixed(displayPrecision), " ");
             }
             return null;
           }
@@ -79,13 +102,16 @@ const getOption = (_ref, isDark, isDesktop, labelCallback) => {
         bucketWidth,
         selectedPrice,
         labelCallback,
-        precision,
         bookType
       })
     },
-    xAxis: {
+    xAxis: [{
       type: 'category',
-      data: xAxisData,
+      name: 'xAxis-less-than-two-weeks',
+      nameTextStyle: {
+        fontSize: 0
+      },
+      id: 'main-xAxis',
       splitNumber: 1,
       axisTick: {
         show: false
@@ -95,12 +121,25 @@ const getOption = (_ref, isDark, isDesktop, labelCallback) => {
         margin: 0,
         formatter: value => (0, _chartUtils.formatXAxisLabel)(value, isGreaterThanTwoWeeks)
       }
-    },
-    yAxis: {
+    }, {
+      type: 'category',
+      gridIndex: 1,
+      show: false,
+      data: dates,
+      splitNumber: 1,
+      axisTick: {
+        show: false
+      },
+      axisLabel: {
+        show: false
+      }
+    }],
+    yAxis: [{
       type: 'value',
+      gridIndex: 0,
       position: 'right',
-      min: val => val.min - bucketWidth * 2,
-      max: val => val.max + bucketWidth * 2,
+      min: val => val.min - bucketWidth * _constants.BUCKET_CONFIG.PRICE_MARGIN_MULTIPLIER,
+      max: val => val.max + bucketWidth * _constants.BUCKET_CONFIG.PRICE_MARGIN_MULTIPLIER,
       axisLine: {
         show: false
       },
@@ -110,19 +149,111 @@ const getOption = (_ref, isDark, isDesktop, labelCallback) => {
       axisLabel: {
         showMaxLabel: false,
         showMinLabel: false,
+        formatter: value => value.toFixed(displayPrecision - 1)
+      }
+    }, {
+      type: 'value',
+      gridIndex: 1,
+      position: 'right',
+      min: _constants.CHART_CONFIG.SENTIMENT_MIN,
+      max: _constants.CHART_CONFIG.SENTIMENT_MAX,
+      interval: _constants.CHART_CONFIG.SENTIMENT_INTERVAL,
+      axisLine: {
+        show: false
+      },
+      axisTick: {
+        show: false
+      },
+      axisLabel: {
+        verticalAlignMaxLabel: 'top',
+        verticalAlignMinLabel: 'bottom',
+        lineHeight: 20,
         margin: isDesktop ? 4 : 2,
-        formatter: value => value.toFixed(precision - 1)
+        rich: {
+          shortRect: {
+            backgroundColor: (0, _chromaJs.default)(sentimentShortColor).alpha(0.3).css(),
+            borderColor: sentimentShortColor,
+            borderWidth: 1,
+            width: 8,
+            height: 8
+          },
+          longRect: {
+            backgroundColor: (0, _chromaJs.default)(sentimentLongColor).alpha(0.3).css(),
+            borderColor: sentimentLongColor,
+            borderWidth: 1,
+            width: 8,
+            height: 8
+          }
+        },
+        formatter: value => {
+          if (value === _constants.CHART_CONFIG.SENTIMENT_MIN) {
+            return "{shortRect| } ".concat(labelCallback('short'));
+          }
+          if (value === _constants.CHART_CONFIG.SENTIMENT_MAX) {
+            return "{longRect| } ".concat(labelCallback('long'));
+          }
+          if (value === _constants.CHART_CONFIG.SENTIMENT_MAX / 2) {
+            return '50%';
+          }
+          return undefined;
+        }
+      }
+    }],
+    axisPointer: {
+      link: [{
+        xAxisIndex: 'all'
+      }]
+    },
+    visualMap: {
+      show: false,
+      seriesId: 'sentiment',
+      dimension: 1,
+      pieces: [{
+        lt: _constants.CHART_CONFIG.SENTIMENT_MAX / 2,
+        color: sentimentShortColor
+      }, {
+        gte: _constants.CHART_CONFIG.SENTIMENT_MAX / 2,
+        lte: _constants.CHART_CONFIG.SENTIMENT_MAX,
+        color: sentimentLongColor
+      }, {
+        gt: _constants.CHART_CONFIG.SENTIMENT_MAX,
+        color: sentimentLongColor
+      }]
+    },
+    dataset: {
+      source: {
+        dates,
+        candlesOpen,
+        candlesClose,
+        candlesLow,
+        candlesHigh,
+        bookPrices,
+        bookIndexes,
+        sentimentShorts,
+        sentimentLongs
       }
     },
     series: [{
       type: 'candlestick',
       id: 'candlestick',
-      data: candlesSeriesData,
+      gridIndex: 0,
+      xAxisIndex: 0,
+      yAxisIndex: 0,
+      encode: {
+        x: 'dates',
+        y: ['open', 'close', 'low', 'high']
+      },
       itemStyle: {
-        color: isDark ? _labsWidgetCommon.colorPalette.orange : _labsWidgetCommon.colorPalette.raspberryLight,
-        color0: isDark ? _labsWidgetCommon.colorPalette.bottleGreenDark : _labsWidgetCommon.colorPalette.bottleGreenLight,
-        borderColor: isDark ? _labsWidgetCommon.colorPalette.orange : _labsWidgetCommon.colorPalette.raspberryLight,
-        borderColor0: isDark ? _labsWidgetCommon.colorPalette.bottleGreenDark : _labsWidgetCommon.colorPalette.bottleGreenLight
+        color: (0, _chromaJs.default)(candleShortColor).desaturate().css(),
+        color0: (0, _chromaJs.default)(candleLongColor).desaturate().css(),
+        borderColor: candleShortColor,
+        borderColor0: candleLongColor
+      },
+      emphasis: {
+        itemStyle: {
+          color: candleShortColor,
+          color0: candleLongColor
+        }
       },
       markPoint: {
         symbol: 'circle',
@@ -131,13 +262,24 @@ const getOption = (_ref, isDark, isDesktop, labelCallback) => {
       }
     }, {
       type: 'custom',
+      gridIndex: 0,
       name: 'heatmap',
       id: 'heatmap',
+      xAxisIndex: 0,
+      yAxisIndex: 0,
       silent: true,
       clip: true,
+      encode: {
+        x: 'dates',
+        y: 'bookPrices'
+      },
+      dimensions: ['dates', 'bookPrices', 'bookIndexes'],
       renderItem: (_params, api) => {
         const xVal = api.value(0);
         const bucketIndex = api.value(2);
+        if (!bucketIndex) {
+          return null;
+        }
         const metaValues = buckets[bucketIndex];
         const [rectWidth, rectHeight] = api.size([0, bucketWidth]);
         const items = metaValues.map(_ref2 => {
@@ -155,7 +297,7 @@ const getOption = (_ref, isDark, isDesktop, labelCallback) => {
               height: rectHeight
             },
             style: {
-              fill: (0, _chartUtils.getRectColor)(sentiment, isDark)
+              fill: (0, _chartUtils.getRectColor)(sentiment, isDark, sentimentThresholdMin, sentimentThresholdMax)
             },
             silent: true,
             emphasisDisabled: true
@@ -167,26 +309,90 @@ const getOption = (_ref, isDark, isDesktop, labelCallback) => {
           silent: true,
           emphasisDisabled: true
         };
+      }
+    }, {
+      type: 'line',
+      name: 'sentiment-short',
+      id: 'sentiment',
+      xAxisIndex: 1,
+      yAxisIndex: 1,
+      showSymbol: false,
+      symbol: 'none',
+      lineStyle: {
+        width: 3,
+        opacity: 1
+      },
+      areaStyle: {
+        color: sentimentShortColor,
+        opacity: sentimentAreaOpacity
+      },
+      emphasis: {
+        disabled: true
+      },
+      stack: 'sentiment',
+      dimensions: ['dates', 'sentimentShorts', 'sentimentLongs'],
+      encode: {
+        x: 'dates',
+        y: 'sentimentShorts'
+      }
+    }, {
+      type: 'line',
+      name: 'sentiment-long',
+      id: 'sentiment-long',
+      xAxisIndex: 1,
+      yAxisIndex: 1,
+      symbol: 'none',
+      lineStyle: {
+        color: 'transparent',
+        width: 0
+      },
+      areaStyle: {
+        color: sentimentLongColor,
+        opacity: sentimentAreaOpacity
       },
-      data: orderPositionBooks
+      stack: 'sentiment',
+      emphasis: {
+        disabled: true
+      },
+      tooltip: {
+        show: false
+      },
+      dimensions: ['dates', 'sentimentLongs'],
+      encode: {
+        x: 'dates',
+        y: 'sentimentLongs'
+      }
     }],
     grid: [{
       name: 'main-grid',
+      id: 'main-grid',
+      height: "".concat(_constants.CHART_CONFIG.MAIN_HEIGHT, "px"),
       top: '0px',
       left: '0px',
       right: "".concat(isDesktop ? _constants.CHART_CONFIG.Y_LABEL_SIZE_DESKTOP : _constants.CHART_CONFIG.Y_LABEL_SIZE_MOBILE, "px"),
       bottom: "".concat(_constants.CHART_CONFIG.X_LABEL_SIZE, "px")
+    }, {
+      name: 'sentiment-grid',
+      id: 'sentiment-grid',
+      height: "".concat(_constants.CHART_CONFIG.SENTIMENT_HEIGHT, "px"),
+      bottom: "0px",
+      left: '0px',
+      right: "".concat(isDesktop ? _constants.CHART_CONFIG.Y_LABEL_SIZE_DESKTOP : _constants.CHART_CONFIG.Y_LABEL_SIZE_MOBILE, "px")
     }],
-    graphic: [...gridLines, _objectSpread(_objectSpread({}, (0, _labsWidgetCommon.getLineCommons)(isDark)), {}, {
-      top: 0,
-      right: 0,
-      shape: {
-        x1: 0,
-        y1: 0,
-        x2: 0,
-        y2: 0
+    graphic: [...gridMainLines, {
+      type: 'text',
+      silent: true,
+      z: 1,
+      left: 4,
+      bottom: _constants.CHART_CONFIG_CALCULATED.SENTIMENT_TEXT_POSITION,
+      style: {
+        text: "".concat(labelCallback('sentiment'), ":"),
+        fontFamily: 'Sofia W03',
+        fontSize: 14,
+        fontWeight: 'bold',
+        fill: sentimentLabelColor
       }
-    })]
+    }]
   };
 };
 exports.getOption = getOption;

package/dist/main/CrowdViewWidget/components/Chart/chartOptions.js.map

@@ -1 +1 @@
-{"version":3,"file":"chartOptions.js","names":["_labsWidgetCommon","require","_constants","_chartUtils","ownKeys","e","r","t","Object","keys","getOwnPropertySymbols","o","filter","getOwnPropertyDescriptor","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty","getOwnPropertyDescriptors","defineProperties","defineProperty","_toPropertyKey","value","configurable","writable","i","_toPrimitive","Symbol","toPrimitive","call","TypeError","String","Number","getOption","_ref","isDark","isDesktop","labelCallback","xAxisData","candlesSeriesData","orderPositionBooks","bucketWidth","buckets","precision","bookType","selectedPrice","visibleXAxisData","slice","CHART_CONFIG","INITIAL_START_ZOOM","INITIAL_END_ZOOM","isGreaterThanTwoWeeks","isDifferenceGreaterThanTwoWeeks","labelsData","getLabelData","gridLines","getGridLines","chartWidth","WIDTH","chartHeight","HEIGHT","xLabelsSize","X_LABEL_SIZE","yLabelSize","Y_LABEL_SIZE_DESKTOP","Y_LABEL_SIZE_MOBILE","bottomLeftBox","animation","dataZoom","type","xAxisIndex","start","end","tooltip","trigger","axisPointer","axis","crossStyle","color","colorPalette","orange","themeColors","borderPrimary","light","label","formatter","params","axisDimension","toFixed","date","Date","toLocaleString","undefined","hour","minute","day","month","confine","getTooltipFormatter","xAxis","data","splitNumber","axisTick","show","axisLabel","padding","margin","formatXAxisLabel","yAxis","position","min","val","max","axisLine","showMaxLabel","showMinLabel","series","id","itemStyle","raspberryLight","color0","bottleGreenDark","bottleGreenLight","borderColor","borderColor0","markPoint","symbol","symbolSize","name","silent","clip","renderItem","_params","api","xVal","bucketIndex","metaValues","rectWidth","rectHeight","size","items","map","_ref2","price","sentiment","coord","shape","x","y","width","height","style","fill","getRectColor","emphasisDisabled","children","grid","top","left","right","concat","bottom","graphic","getLineCommons","x1","y1","x2","y2","exports"],"sources":["../../../../../src/CrowdViewWidget/components/Chart/chartOptions.ts"],"sourcesContent":["import {\n  colorPalette,\n  getGridLines,\n  getLineCommons,\n  themeColors,\n} from '@oanda/labs-widget-common';\n\nimport { CHART_CONFIG } from '../../constants';\nimport type { Bucket, GetOptionType } from './types';\nimport {\n  formatXAxisLabel,\n  getLabelData,\n  getRectColor,\n  getTooltipFormatter,\n  isDifferenceGreaterThanTwoWeeks,\n} from './utils/chartUtils';\n\n// @ts-expect-error\nexport const getOption: GetOptionType = (\n  {\n    xAxisData,\n    candlesSeriesData,\n    orderPositionBooks,\n    bucketWidth,\n    buckets,\n    precision,\n    bookType,\n  },\n  isDark,\n  isDesktop,\n  labelCallback\n) => {\n  let selectedPrice: number;\n  const visibleXAxisData = xAxisData.slice(\n    (xAxisData.length * CHART_CONFIG.INITIAL_START_ZOOM) / 100,\n    (xAxisData.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 labelsData = getLabelData({\n    xAxisData,\n    isGreaterThanTwoWeeks,\n  });\n\n  const gridLines = getGridLines({\n    isDark,\n    chartWidth: CHART_CONFIG.WIDTH,\n    chartHeight: CHART_CONFIG.HEIGHT,\n    xLabelsSize: CHART_CONFIG.X_LABEL_SIZE,\n    yLabelSize: isDesktop\n      ? CHART_CONFIG.Y_LABEL_SIZE_DESKTOP\n      : CHART_CONFIG.Y_LABEL_SIZE_MOBILE,\n    bottomLeftBox: false,\n  });\n\n  return {\n    animation: false,\n    dataZoom: [\n      {\n        type: 'inside',\n        xAxisIndex: 0,\n        start: CHART_CONFIG.INITIAL_START_ZOOM,\n        end: CHART_CONFIG.INITIAL_END_ZOOM,\n      },\n    ],\n    tooltip: {\n      trigger: 'axis',\n      axisPointer: {\n        type: 'cross',\n        axis: 'x',\n        crossStyle: {\n          color: isDark ? colorPalette.orange : themeColors.borderPrimary.light,\n        },\n        label: {\n          formatter: (params) => {\n            if (params.axisDimension === 'y') {\n              selectedPrice = Number(params.value);\n              return Number(params.value).toFixed(precision);\n            }\n\n            if (params.axisDimension === 'x') {\n              const date = new Date(params.value as string);\n              return date.toLocaleString(undefined, {\n                hour: '2-digit',\n                minute: '2-digit',\n                day: 'numeric',\n                month: 'short',\n              });\n            }\n\n            return null;\n          },\n        },\n      },\n      confine: true,\n      formatter: (params) =>\n        getTooltipFormatter({\n          params,\n          buckets,\n          bucketWidth,\n          selectedPrice,\n          labelCallback,\n          precision,\n          bookType,\n        }),\n    },\n    xAxis: {\n      type: 'category',\n      data: xAxisData,\n      splitNumber: 1,\n      axisTick: {\n        show: false,\n      },\n      axisLabel: {\n        padding: [8, 16, 8, 16],\n        margin: 0,\n        formatter: (value) => formatXAxisLabel(value, isGreaterThanTwoWeeks),\n      },\n    },\n    yAxis: {\n      type: 'value',\n      position: 'right',\n      min: (val) => val.min - bucketWidth * 2,\n      max: (val) => val.max + bucketWidth * 2,\n      axisLine: { show: false },\n      axisTick: { show: false },\n      axisLabel: {\n        showMaxLabel: false,\n        showMinLabel: false,\n        margin: isDesktop ? 4 : 2,\n        formatter: (value: number) => value.toFixed(precision - 1),\n      },\n    },\n    series: [\n      {\n        type: 'candlestick',\n        id: 'candlestick',\n        data: candlesSeriesData,\n        itemStyle: {\n          color: isDark ? colorPalette.orange : colorPalette.raspberryLight,\n          color0: isDark\n            ? colorPalette.bottleGreenDark\n            : colorPalette.bottleGreenLight,\n          borderColor: isDark\n            ? colorPalette.orange\n            : colorPalette.raspberryLight,\n          borderColor0: isDark\n            ? colorPalette.bottleGreenDark\n            : colorPalette.bottleGreenLight,\n        },\n\n        markPoint: {\n          symbol: 'circle',\n          symbolSize: 0,\n          data: labelsData,\n        },\n      },\n      {\n        type: 'custom',\n        name: 'heatmap',\n        id: 'heatmap',\n        silent: true,\n        clip: true,\n        renderItem: (_params, api) => {\n          const xVal = api.value(0);\n          const bucketIndex = api.value(2) as number;\n          const metaValues = buckets[bucketIndex];\n\n          const [rectWidth, rectHeight] = api.size!([\n            0,\n            bucketWidth,\n          ]) as number[];\n\n          const items = metaValues.map(({ price, sentiment }: Bucket) => {\n            const start = api.coord([xVal, price]);\n\n            return {\n              type: 'rect',\n              shape: {\n                x: start[0] - rectWidth / 2,\n                y: start[1] - rectHeight,\n                width: rectWidth + 1,\n                height: rectHeight,\n              },\n              style: {\n                fill: getRectColor(sentiment, isDark),\n              },\n              silent: true,\n              emphasisDisabled: true,\n            };\n          });\n\n          return {\n            type: 'group',\n            children: items,\n            silent: true,\n            emphasisDisabled: true,\n          };\n        },\n        data: orderPositionBooks,\n      },\n    ],\n    grid: [\n      {\n        name: 'main-grid',\n        top: '0px',\n        left: '0px',\n        right: `${isDesktop ? CHART_CONFIG.Y_LABEL_SIZE_DESKTOP : CHART_CONFIG.Y_LABEL_SIZE_MOBILE}px`,\n        bottom: `${CHART_CONFIG.X_LABEL_SIZE}px`,\n      },\n    ],\n    graphic: [\n      ...gridLines,\n      {\n        ...getLineCommons(isDark as boolean),\n        top: 0,\n        right: 0,\n        shape: {\n          x1: 0,\n          y1: 0,\n          x2: 0,\n          y2: 0,\n        },\n      },\n    ],\n  };\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"chartOptions.js","names":["_chromaJs","_interopRequireDefault","require","_constants","_chartUtils","_getChartStyles","_getGridLines","e","__esModule","default","getOption","_ref","mainData","dates","candlesOpen","candlesClose","candlesLow","candlesHigh","bookPrices","bookIndexes","sentimentShorts","sentimentLongs","additionalData","bucketWidth","buckets","displayPrecision","bookType","sentimentThresholdMin","sentimentThresholdMax","isDark","isDesktop","labelCallback","selectedPrice","sentimentLongColor","sentimentShortColor","candleLongColor","candleShortColor","sentimentAreaOpacity","tooltipLinesColor","sentimentLabelColor","getChartStyles","visibleXAxisData","slice","length","CHART_CONFIG","INITIAL_START_ZOOM","INITIAL_END_ZOOM","isGreaterThanTwoWeeks","isDifferenceGreaterThanTwoWeeks","labelsData","getLabelData","gridMainLines","getGridLines","animation","dataZoom","id","type","xAxisIndex","start","end","filterMode","tooltip","trigger","axisPointer","axis","lineStyle","color","crossStyle","label","padding","lineHeight","formatter","params","axisDimension","axisIndex","Number","value","concat","toFixed","confine","getTooltipFormatter","xAxis","name","nameTextStyle","fontSize","splitNumber","axisTick","show","axisLabel","margin","formatXAxisLabel","gridIndex","data","yAxis","position","min","val","BUCKET_CONFIG","PRICE_MARGIN_MULTIPLIER","max","axisLine","showMaxLabel","showMinLabel","SENTIMENT_MIN","SENTIMENT_MAX","interval","SENTIMENT_INTERVAL","verticalAlignMaxLabel","verticalAlignMinLabel","rich","shortRect","backgroundColor","chroma","alpha","css","borderColor","borderWidth","width","height","longRect","undefined","link","visualMap","seriesId","dimension","pieces","lt","gte","lte","gt","dataset","source","series","yAxisIndex","encode","x","y","itemStyle","desaturate","color0","borderColor0","emphasis","markPoint","symbol","symbolSize","silent","clip","dimensions","renderItem","_params","api","xVal","bucketIndex","metaValues","rectWidth","rectHeight","size","items","map","_ref2","price","sentiment","coord","shape","style","fill","getRectColor","emphasisDisabled","children","showSymbol","opacity","areaStyle","disabled","stack","grid","MAIN_HEIGHT","top","left","right","Y_LABEL_SIZE_DESKTOP","Y_LABEL_SIZE_MOBILE","bottom","X_LABEL_SIZE","SENTIMENT_HEIGHT","graphic","z","CHART_CONFIG_CALCULATED","SENTIMENT_TEXT_POSITION","text","fontFamily","fontWeight","exports"],"sources":["../../../../../src/CrowdViewWidget/components/Chart/chartOptions.ts"],"sourcesContent":["import chroma from 'chroma-js';\n\nimport {\n  BUCKET_CONFIG,\n  CHART_CONFIG,\n  CHART_CONFIG_CALCULATED,\n} from '../../constants';\nimport type { Bucket, GetOptionType, TooltipParam } from './types';\nimport {\n  formatXAxisLabel,\n  getLabelData,\n  getRectColor,\n  getTooltipFormatter,\n  isDifferenceGreaterThanTwoWeeks,\n} from './utils/chartUtils';\nimport { getChartStyles } from './utils/getChartStyles';\nimport { getGridLines } from './utils/getGridLines';\n\n// @ts-expect-error\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  isDark,\n  isDesktop,\n  labelCallback,\n}) => {\n  let selectedPrice: number;\n  const {\n    sentimentLongColor,\n    sentimentShortColor,\n    candleLongColor,\n    candleShortColor,\n    sentimentAreaOpacity,\n    tooltipLinesColor,\n    sentimentLabelColor,\n  } = getChartStyles(isDark);\n\n  const visibleXAxisData = dates.slice(\n    (dates.length * CHART_CONFIG.INITIAL_START_ZOOM) / 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 labelsData = getLabelData({\n    dates,\n    isGreaterThanTwoWeeks,\n  });\n\n  const gridMainLines = getGridLines({\n    isDark,\n    isDesktop,\n  });\n\n  return {\n    animation: false,\n    dataZoom: [\n      {\n        id: 'main',\n        type: 'inside',\n        xAxisIndex: 0,\n        start: CHART_CONFIG.INITIAL_START_ZOOM,\n        end: CHART_CONFIG.INITIAL_END_ZOOM,\n        filterMode: 'filter',\n      },\n      {\n        id: 'sentiment',\n        type: 'inside',\n        xAxisIndex: 1,\n        start: CHART_CONFIG.INITIAL_START_ZOOM,\n        end: CHART_CONFIG.INITIAL_END_ZOOM,\n        filterMode: 'none',\n      },\n    ],\n    tooltip: {\n      trigger: 'axis',\n      axisPointer: {\n        type: 'cross',\n        axis: 'x',\n        lineStyle: {\n          color: tooltipLinesColor,\n        },\n        crossStyle: {\n          color: tooltipLinesColor,\n        },\n        label: {\n          padding: 0,\n          lineHeight: 24,\n          formatter: (params) => {\n            if (params.axisDimension === 'y' && params.axisIndex === 0) {\n              selectedPrice = Number(params.value);\n              return ` ${Number(params.value).toFixed(displayPrecision)} `;\n            }\n\n            return null;\n          },\n        },\n      },\n      confine: true,\n      formatter: (params: TooltipParam[]) =>\n        getTooltipFormatter({\n          params,\n          buckets,\n          bucketWidth,\n          selectedPrice,\n          labelCallback,\n          bookType,\n        }),\n    },\n    xAxis: [\n      {\n        type: 'category',\n        name: 'xAxis-less-than-two-weeks',\n        nameTextStyle: {\n          fontSize: 0,\n        },\n        id: 'main-xAxis',\n        splitNumber: 1,\n        axisTick: {\n          show: false,\n        },\n        axisLabel: {\n          padding: [8, 16, 8, 16],\n          margin: 0,\n          formatter: (value) => formatXAxisLabel(value, isGreaterThanTwoWeeks),\n        },\n      },\n      {\n        type: 'category',\n        gridIndex: 1,\n        show: false,\n        data: dates,\n        splitNumber: 1,\n        axisTick: {\n          show: false,\n        },\n        axisLabel: {\n          show: false,\n        },\n      },\n    ],\n    yAxis: [\n      {\n        type: 'value',\n        gridIndex: 0,\n        position: 'right',\n        min: (val) =>\n          val.min - bucketWidth * BUCKET_CONFIG.PRICE_MARGIN_MULTIPLIER,\n        max: (val) =>\n          val.max + bucketWidth * BUCKET_CONFIG.PRICE_MARGIN_MULTIPLIER,\n        axisLine: { show: false },\n        axisTick: { show: false },\n        axisLabel: {\n          showMaxLabel: false,\n          showMinLabel: false,\n          formatter: (value: number) => value.toFixed(displayPrecision - 1),\n        },\n      },\n      {\n        type: 'value',\n        gridIndex: 1,\n        position: 'right',\n        min: CHART_CONFIG.SENTIMENT_MIN,\n        max: CHART_CONFIG.SENTIMENT_MAX,\n        interval: CHART_CONFIG.SENTIMENT_INTERVAL,\n        axisLine: { show: false },\n        axisTick: { show: false },\n        axisLabel: {\n          verticalAlignMaxLabel: 'top',\n          verticalAlignMinLabel: 'bottom',\n          lineHeight: 20,\n          margin: isDesktop ? 4 : 2,\n          rich: {\n            shortRect: {\n              backgroundColor: chroma(sentimentShortColor).alpha(0.3).css(),\n              borderColor: sentimentShortColor,\n              borderWidth: 1,\n              width: 8,\n              height: 8,\n            },\n            longRect: {\n              backgroundColor: chroma(sentimentLongColor).alpha(0.3).css(),\n              borderColor: sentimentLongColor,\n              borderWidth: 1,\n              width: 8,\n              height: 8,\n            },\n          },\n          formatter: (value: number) => {\n            if (value === CHART_CONFIG.SENTIMENT_MIN) {\n              return `{shortRect| } ${labelCallback('short')}`;\n            }\n\n            if (value === CHART_CONFIG.SENTIMENT_MAX) {\n              return `{longRect| } ${labelCallback('long')}`;\n            }\n\n            if (value === CHART_CONFIG.SENTIMENT_MAX / 2) {\n              return '50%';\n            }\n\n            return undefined;\n          },\n        },\n      },\n    ],\n    axisPointer: {\n      link: [\n        {\n          xAxisIndex: 'all',\n        },\n      ],\n    },\n    visualMap: {\n      show: false,\n      seriesId: 'sentiment',\n      dimension: 1,\n      pieces: [\n        {\n          lt: CHART_CONFIG.SENTIMENT_MAX / 2,\n          color: sentimentShortColor,\n        },\n        {\n          gte: CHART_CONFIG.SENTIMENT_MAX / 2,\n          lte: CHART_CONFIG.SENTIMENT_MAX,\n          color: sentimentLongColor,\n        },\n        {\n          gt: CHART_CONFIG.SENTIMENT_MAX,\n          color: sentimentLongColor,\n        },\n      ],\n    },\n    dataset: {\n      source: {\n        dates,\n        candlesOpen,\n        candlesClose,\n        candlesLow,\n        candlesHigh,\n        bookPrices,\n        bookIndexes,\n        sentimentShorts,\n        sentimentLongs,\n      },\n    },\n    series: [\n      {\n        type: 'candlestick',\n        id: 'candlestick',\n        gridIndex: 0,\n        xAxisIndex: 0,\n        yAxisIndex: 0,\n        encode: {\n          x: 'dates',\n          y: ['open', 'close', 'low', 'high'],\n        },\n        itemStyle: {\n          color: chroma(candleShortColor).desaturate().css(),\n          color0: chroma(candleLongColor).desaturate().css(),\n          borderColor: candleShortColor,\n          borderColor0: candleLongColor,\n        },\n        emphasis: {\n          itemStyle: {\n            color: candleShortColor,\n            color0: candleLongColor,\n          },\n        },\n        markPoint: {\n          symbol: 'circle',\n          symbolSize: 0,\n          data: labelsData,\n        },\n      },\n      {\n        type: 'custom',\n        gridIndex: 0,\n        name: 'heatmap',\n        id: 'heatmap',\n        xAxisIndex: 0,\n        yAxisIndex: 0,\n        silent: true,\n        clip: true,\n        encode: {\n          x: 'dates',\n          y: 'bookPrices',\n        },\n        dimensions: ['dates', 'bookPrices', 'bookIndexes'],\n        renderItem: (_params, api) => {\n          const xVal = api.value(0);\n          const bucketIndex = api.value(2) as number;\n\n          if (!bucketIndex) {\n            return null;\n          }\n\n          const metaValues = buckets[bucketIndex];\n\n          const [rectWidth, rectHeight] = api.size!([\n            0,\n            bucketWidth,\n          ]) as number[];\n\n          const items = metaValues.map(({ price, sentiment }: Bucket) => {\n            const start = api.coord([xVal, price]);\n\n            return {\n              type: 'rect',\n              shape: {\n                x: start[0] - rectWidth / 2,\n                y: start[1] - rectHeight,\n                width: rectWidth + 1,\n                height: rectHeight,\n              },\n              style: {\n                fill: getRectColor(\n                  sentiment,\n                  isDark,\n                  sentimentThresholdMin,\n                  sentimentThresholdMax\n                ),\n              },\n              silent: true,\n              emphasisDisabled: true,\n            };\n          });\n\n          return {\n            type: 'group',\n            children: items,\n            silent: true,\n            emphasisDisabled: true,\n          };\n        },\n      },\n      {\n        type: 'line',\n        name: 'sentiment-short',\n        id: 'sentiment',\n        xAxisIndex: 1,\n        yAxisIndex: 1,\n        showSymbol: false,\n        symbol: 'none',\n        lineStyle: {\n          width: 3,\n          opacity: 1,\n        },\n        areaStyle: {\n          color: sentimentShortColor,\n          opacity: sentimentAreaOpacity,\n        },\n        emphasis: {\n          disabled: true,\n        },\n        stack: 'sentiment',\n        dimensions: ['dates', 'sentimentShorts', 'sentimentLongs'],\n        encode: {\n          x: 'dates',\n          y: 'sentimentShorts',\n        },\n      },\n      {\n        type: 'line',\n        name: 'sentiment-long',\n        id: 'sentiment-long',\n        xAxisIndex: 1,\n        yAxisIndex: 1,\n        symbol: 'none',\n        lineStyle: {\n          color: 'transparent',\n          width: 0,\n        },\n        areaStyle: {\n          color: sentimentLongColor,\n          opacity: sentimentAreaOpacity,\n        },\n        stack: 'sentiment',\n        emphasis: {\n          disabled: true,\n        },\n        tooltip: {\n          show: false,\n        },\n        dimensions: ['dates', 'sentimentLongs'],\n        encode: {\n          x: 'dates',\n          y: 'sentimentLongs',\n        },\n      },\n    ],\n    grid: [\n      {\n        name: 'main-grid',\n        id: 'main-grid',\n        height: `${CHART_CONFIG.MAIN_HEIGHT}px`,\n        top: '0px',\n        left: '0px',\n        right: `${isDesktop ? CHART_CONFIG.Y_LABEL_SIZE_DESKTOP : CHART_CONFIG.Y_LABEL_SIZE_MOBILE}px`,\n        bottom: `${CHART_CONFIG.X_LABEL_SIZE}px`,\n      },\n      {\n        name: 'sentiment-grid',\n        id: 'sentiment-grid',\n        height: `${CHART_CONFIG.SENTIMENT_HEIGHT}px`,\n        bottom: `0px`,\n        left: '0px',\n        right: `${isDesktop ? CHART_CONFIG.Y_LABEL_SIZE_DESKTOP : CHART_CONFIG.Y_LABEL_SIZE_MOBILE}px`,\n      },\n    ],\n    graphic: [\n      ...gridMainLines,\n      {\n        type: 'text',\n        silent: true,\n        z: 1,\n        left: 4,\n        bottom: CHART_CONFIG_CALCULATED.SENTIMENT_TEXT_POSITION,\n        style: {\n          text: `${labelCallback('sentiment')}:`,\n          fontFamily: 'Sofia W03',\n          fontSize: 14,\n          fontWeight: 'bold',\n          fill: sentimentLabelColor,\n        },\n      },\n    ],\n  };\n};\n"],"mappings":";;;;;;AAAA,IAAAA,SAAA,GAAAC,sBAAA,CAAAC,OAAA;AAEA,IAAAC,UAAA,GAAAD,OAAA;AAMA,IAAAE,WAAA,GAAAF,OAAA;AAOA,IAAAG,eAAA,GAAAH,OAAA;AACA,IAAAI,aAAA,GAAAJ,OAAA;AAAoD,SAAAD,uBAAAM,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAG7C,MAAMG,SAAwB,GAAGC,IAAA,IAuBlC;EAAA,IAvBmC;IACvCC,QAAQ,EAAE;MACRC,KAAK;MACLC,WAAW;MACXC,YAAY;MACZC,UAAU;MACVC,WAAW;MACXC,UAAU;MACVC,WAAW;MACXC,eAAe;MACfC;IACF,CAAC;IACDC,cAAc,EAAE;MACdC,WAAW;MACXC,OAAO;MACPC,gBAAgB;MAChBC,QAAQ;MACRC,qBAAqB;MACrBC;IACF,CAAC;IACDC,MAAM;IACNC,SAAS;IACTC;EACF,CAAC,GAAApB,IAAA;EACC,IAAIqB,aAAqB;EACzB,MAAM;IACJC,kBAAkB;IAClBC,mBAAmB;IACnBC,eAAe;IACfC,gBAAgB;IAChBC,oBAAoB;IACpBC,iBAAiB;IACjBC;EACF,CAAC,GAAG,IAAAC,8BAAc,EAACX,MAAM,CAAC;EAE1B,MAAMY,gBAAgB,GAAG5B,KAAK,CAAC6B,KAAK,CACjC7B,KAAK,CAAC8B,MAAM,GAAGC,uBAAY,CAACC,kBAAkB,GAAI,GAAG,EACrDhC,KAAK,CAAC8B,MAAM,GAAGC,uBAAY,CAACE,gBAAgB,GAAI,GACnD,CAAC;EAED,MAAMC,qBAAqB,GAAG,IAAAC,2CAA+B,EAC3DP,gBAAgB,CAAC,CAAC,CAAC,EACnBA,gBAAgB,CAACA,gBAAgB,CAACE,MAAM,GAAG,CAAC,CAC9C,CAAC;EAED,MAAMM,UAAU,GAAG,IAAAC,wBAAY,EAAC;IAC9BrC,KAAK;IACLkC;EACF,CAAC,CAAC;EAEF,MAAMI,aAAa,GAAG,IAAAC,0BAAY,EAAC;IACjCvB,MAAM;IACNC;EACF,CAAC,CAAC;EAEF,OAAO;IACLuB,SAAS,EAAE,KAAK;IAChBC,QAAQ,EAAE,CACR;MACEC,EAAE,EAAE,MAAM;MACVC,IAAI,EAAE,QAAQ;MACdC,UAAU,EAAE,CAAC;MACbC,KAAK,EAAEd,uBAAY,CAACC,kBAAkB;MACtCc,GAAG,EAAEf,uBAAY,CAACE,gBAAgB;MAClCc,UAAU,EAAE;IACd,CAAC,EACD;MACEL,EAAE,EAAE,WAAW;MACfC,IAAI,EAAE,QAAQ;MACdC,UAAU,EAAE,CAAC;MACbC,KAAK,EAAEd,uBAAY,CAACC,kBAAkB;MACtCc,GAAG,EAAEf,uBAAY,CAACE,gBAAgB;MAClCc,UAAU,EAAE;IACd,CAAC,CACF;IACDC,OAAO,EAAE;MACPC,OAAO,EAAE,MAAM;MACfC,WAAW,EAAE;QACXP,IAAI,EAAE,OAAO;QACbQ,IAAI,EAAE,GAAG;QACTC,SAAS,EAAE;UACTC,KAAK,EAAE5B;QACT,CAAC;QACD6B,UAAU,EAAE;UACVD,KAAK,EAAE5B;QACT,CAAC;QACD8B,KAAK,EAAE;UACLC,OAAO,EAAE,CAAC;UACVC,UAAU,EAAE,EAAE;UACdC,SAAS,EAAGC,MAAM,IAAK;YACrB,IAAIA,MAAM,CAACC,aAAa,KAAK,GAAG,IAAID,MAAM,CAACE,SAAS,KAAK,CAAC,EAAE;cAC1D1C,aAAa,GAAG2C,MAAM,CAACH,MAAM,CAACI,KAAK,CAAC;cACpC,WAAAC,MAAA,CAAWF,MAAM,CAACH,MAAM,CAACI,KAAK,CAAC,CAACE,OAAO,CAACrD,gBAAgB,CAAC;YAC3D;YAEA,OAAO,IAAI;UACb;QACF;MACF,CAAC;MACDsD,OAAO,EAAE,IAAI;MACbR,SAAS,EAAGC,MAAsB,IAChC,IAAAQ,+BAAmB,EAAC;QAClBR,MAAM;QACNhD,OAAO;QACPD,WAAW;QACXS,aAAa;QACbD,aAAa;QACbL;MACF,CAAC;IACL,CAAC;IACDuD,KAAK,EAAE,CACL;MACEzB,IAAI,EAAE,UAAU;MAChB0B,IAAI,EAAE,2BAA2B;MACjCC,aAAa,EAAE;QACbC,QAAQ,EAAE;MACZ,CAAC;MACD7B,EAAE,EAAE,YAAY;MAChB8B,WAAW,EAAE,CAAC;MACdC,QAAQ,EAAE;QACRC,IAAI,EAAE;MACR,CAAC;MACDC,SAAS,EAAE;QACTnB,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC;QACvBoB,MAAM,EAAE,CAAC;QACTlB,SAAS,EAAGK,KAAK,IAAK,IAAAc,4BAAgB,EAACd,KAAK,EAAE7B,qBAAqB;MACrE;IACF,CAAC,EACD;MACES,IAAI,EAAE,UAAU;MAChBmC,SAAS,EAAE,CAAC;MACZJ,IAAI,EAAE,KAAK;MACXK,IAAI,EAAE/E,KAAK;MACXwE,WAAW,EAAE,CAAC;MACdC,QAAQ,EAAE;QACRC,IAAI,EAAE;MACR,CAAC;MACDC,SAAS,EAAE;QACTD,IAAI,EAAE;MACR;IACF,CAAC,CACF;IACDM,KAAK,EAAE,CACL;MACErC,IAAI,EAAE,OAAO;MACbmC,SAAS,EAAE,CAAC;MACZG,QAAQ,EAAE,OAAO;MACjBC,GAAG,EAAGC,GAAG,IACPA,GAAG,CAACD,GAAG,GAAGxE,WAAW,GAAG0E,wBAAa,CAACC,uBAAuB;MAC/DC,GAAG,EAAGH,GAAG,IACPA,GAAG,CAACG,GAAG,GAAG5E,WAAW,GAAG0E,wBAAa,CAACC,uBAAuB;MAC/DE,QAAQ,EAAE;QAAEb,IAAI,EAAE;MAAM,CAAC;MACzBD,QAAQ,EAAE;QAAEC,IAAI,EAAE;MAAM,CAAC;MACzBC,SAAS,EAAE;QACTa,YAAY,EAAE,KAAK;QACnBC,YAAY,EAAE,KAAK;QACnB/B,SAAS,EAAGK,KAAa,IAAKA,KAAK,CAACE,OAAO,CAACrD,gBAAgB,GAAG,CAAC;MAClE;IACF,CAAC,EACD;MACE+B,IAAI,EAAE,OAAO;MACbmC,SAAS,EAAE,CAAC;MACZG,QAAQ,EAAE,OAAO;MACjBC,GAAG,EAAEnD,uBAAY,CAAC2D,aAAa;MAC/BJ,GAAG,EAAEvD,uBAAY,CAAC4D,aAAa;MAC/BC,QAAQ,EAAE7D,uBAAY,CAAC8D,kBAAkB;MACzCN,QAAQ,EAAE;QAAEb,IAAI,EAAE;MAAM,CAAC;MACzBD,QAAQ,EAAE;QAAEC,IAAI,EAAE;MAAM,CAAC;MACzBC,SAAS,EAAE;QACTmB,qBAAqB,EAAE,KAAK;QAC5BC,qBAAqB,EAAE,QAAQ;QAC/BtC,UAAU,EAAE,EAAE;QACdmB,MAAM,EAAE3D,SAAS,GAAG,CAAC,GAAG,CAAC;QACzB+E,IAAI,EAAE;UACJC,SAAS,EAAE;YACTC,eAAe,EAAE,IAAAC,iBAAM,EAAC9E,mBAAmB,CAAC,CAAC+E,KAAK,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAC;YAC7DC,WAAW,EAAEjF,mBAAmB;YAChCkF,WAAW,EAAE,CAAC;YACdC,KAAK,EAAE,CAAC;YACRC,MAAM,EAAE;UACV,CAAC;UACDC,QAAQ,EAAE;YACRR,eAAe,EAAE,IAAAC,iBAAM,EAAC/E,kBAAkB,CAAC,CAACgF,KAAK,CAAC,GAAG,CAAC,CAACC,GAAG,CAAC,CAAC;YAC5DC,WAAW,EAAElF,kBAAkB;YAC/BmF,WAAW,EAAE,CAAC;YACdC,KAAK,EAAE,CAAC;YACRC,MAAM,EAAE;UACV;QACF,CAAC;QACD/C,SAAS,EAAGK,KAAa,IAAK;UAC5B,IAAIA,KAAK,KAAKhC,uBAAY,CAAC2D,aAAa,EAAE;YACxC,wBAAA1B,MAAA,CAAwB9C,aAAa,CAAC,OAAO,CAAC;UAChD;UAEA,IAAI6C,KAAK,KAAKhC,uBAAY,CAAC4D,aAAa,EAAE;YACxC,uBAAA3B,MAAA,CAAuB9C,aAAa,CAAC,MAAM,CAAC;UAC9C;UAEA,IAAI6C,KAAK,KAAKhC,uBAAY,CAAC4D,aAAa,GAAG,CAAC,EAAE;YAC5C,OAAO,KAAK;UACd;UAEA,OAAOgB,SAAS;QAClB;MACF;IACF,CAAC,CACF;IACDzD,WAAW,EAAE;MACX0D,IAAI,EAAE,CACJ;QACEhE,UAAU,EAAE;MACd,CAAC;IAEL,CAAC;IACDiE,SAAS,EAAE;MACTnC,IAAI,EAAE,KAAK;MACXoC,QAAQ,EAAE,WAAW;MACrBC,SAAS,EAAE,CAAC;MACZC,MAAM,EAAE,CACN;QACEC,EAAE,EAAElF,uBAAY,CAAC4D,aAAa,GAAG,CAAC;QAClCtC,KAAK,EAAEhC;MACT,CAAC,EACD;QACE6F,GAAG,EAAEnF,uBAAY,CAAC4D,aAAa,GAAG,CAAC;QACnCwB,GAAG,EAAEpF,uBAAY,CAAC4D,aAAa;QAC/BtC,KAAK,EAAEjC;MACT,CAAC,EACD;QACEgG,EAAE,EAAErF,uBAAY,CAAC4D,aAAa;QAC9BtC,KAAK,EAAEjC;MACT,CAAC;IAEL,CAAC;IACDiG,OAAO,EAAE;MACPC,MAAM,EAAE;QACNtH,KAAK;QACLC,WAAW;QACXC,YAAY;QACZC,UAAU;QACVC,WAAW;QACXC,UAAU;QACVC,WAAW;QACXC,eAAe;QACfC;MACF;IACF,CAAC;IACD+G,MAAM,EAAE,CACN;MACE5E,IAAI,EAAE,aAAa;MACnBD,EAAE,EAAE,aAAa;MACjBoC,SAAS,EAAE,CAAC;MACZlC,UAAU,EAAE,CAAC;MACb4E,UAAU,EAAE,CAAC;MACbC,MAAM,EAAE;QACNC,CAAC,EAAE,OAAO;QACVC,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM;MACpC,CAAC;MACDC,SAAS,EAAE;QACTvE,KAAK,EAAE,IAAA8C,iBAAM,EAAC5E,gBAAgB,CAAC,CAACsG,UAAU,CAAC,CAAC,CAACxB,GAAG,CAAC,CAAC;QAClDyB,MAAM,EAAE,IAAA3B,iBAAM,EAAC7E,eAAe,CAAC,CAACuG,UAAU,CAAC,CAAC,CAACxB,GAAG,CAAC,CAAC;QAClDC,WAAW,EAAE/E,gBAAgB;QAC7BwG,YAAY,EAAEzG;MAChB,CAAC;MACD0G,QAAQ,EAAE;QACRJ,SAAS,EAAE;UACTvE,KAAK,EAAE9B,gBAAgB;UACvBuG,MAAM,EAAExG;QACV;MACF,CAAC;MACD2G,SAAS,EAAE;QACTC,MAAM,EAAE,QAAQ;QAChBC,UAAU,EAAE,CAAC;QACbpD,IAAI,EAAE3C;MACR;IACF,CAAC,EACD;MACEO,IAAI,EAAE,QAAQ;MACdmC,SAAS,EAAE,CAAC;MACZT,IAAI,EAAE,SAAS;MACf3B,EAAE,EAAE,SAAS;MACbE,UAAU,EAAE,CAAC;MACb4E,UAAU,EAAE,CAAC;MACbY,MAAM,EAAE,IAAI;MACZC,IAAI,EAAE,IAAI;MACVZ,MAAM,EAAE;QACNC,CAAC,EAAE,OAAO;QACVC,CAAC,EAAE;MACL,CAAC;MACDW,UAAU,EAAE,CAAC,OAAO,EAAE,YAAY,EAAE,aAAa,CAAC;MAClDC,UAAU,EAAEA,CAACC,OAAO,EAAEC,GAAG,KAAK;QAC5B,MAAMC,IAAI,GAAGD,GAAG,CAAC1E,KAAK,CAAC,CAAC,CAAC;QACzB,MAAM4E,WAAW,GAAGF,GAAG,CAAC1E,KAAK,CAAC,CAAC,CAAW;QAE1C,IAAI,CAAC4E,WAAW,EAAE;UAChB,OAAO,IAAI;QACb;QAEA,MAAMC,UAAU,GAAGjI,OAAO,CAACgI,WAAW,CAAC;QAEvC,MAAM,CAACE,SAAS,EAAEC,UAAU,CAAC,GAAGL,GAAG,CAACM,IAAI,CAAE,CACxC,CAAC,EACDrI,WAAW,CACZ,CAAa;QAEd,MAAMsI,KAAK,GAAGJ,UAAU,CAACK,GAAG,CAACC,KAAA,IAAkC;UAAA,IAAjC;YAAEC,KAAK;YAAEC;UAAkB,CAAC,GAAAF,KAAA;UACxD,MAAMrG,KAAK,GAAG4F,GAAG,CAACY,KAAK,CAAC,CAACX,IAAI,EAAES,KAAK,CAAC,CAAC;UAEtC,OAAO;YACLxG,IAAI,EAAE,MAAM;YACZ2G,KAAK,EAAE;cACL5B,CAAC,EAAE7E,KAAK,CAAC,CAAC,CAAC,GAAGgG,SAAS,GAAG,CAAC;cAC3BlB,CAAC,EAAE9E,KAAK,CAAC,CAAC,CAAC,GAAGiG,UAAU;cACxBtC,KAAK,EAAEqC,SAAS,GAAG,CAAC;cACpBpC,MAAM,EAAEqC;YACV,CAAC;YACDS,KAAK,EAAE;cACLC,IAAI,EAAE,IAAAC,wBAAY,EAChBL,SAAS,EACTpI,MAAM,EACNF,qBAAqB,EACrBC,qBACF;YACF,CAAC;YACDqH,MAAM,EAAE,IAAI;YACZsB,gBAAgB,EAAE;UACpB,CAAC;QACH,CAAC,CAAC;QAEF,OAAO;UACL/G,IAAI,EAAE,OAAO;UACbgH,QAAQ,EAAEX,KAAK;UACfZ,MAAM,EAAE,IAAI;UACZsB,gBAAgB,EAAE;QACpB,CAAC;MACH;IACF,CAAC,EACD;MACE/G,IAAI,EAAE,MAAM;MACZ0B,IAAI,EAAE,iBAAiB;MACvB3B,EAAE,EAAE,WAAW;MACfE,UAAU,EAAE,CAAC;MACb4E,UAAU,EAAE,CAAC;MACboC,UAAU,EAAE,KAAK;MACjB1B,MAAM,EAAE,MAAM;MACd9E,SAAS,EAAE;QACToD,KAAK,EAAE,CAAC;QACRqD,OAAO,EAAE;MACX,CAAC;MACDC,SAAS,EAAE;QACTzG,KAAK,EAAEhC,mBAAmB;QAC1BwI,OAAO,EAAErI;MACX,CAAC;MACDwG,QAAQ,EAAE;QACR+B,QAAQ,EAAE;MACZ,CAAC;MACDC,KAAK,EAAE,WAAW;MAClB1B,UAAU,EAAE,CAAC,OAAO,EAAE,iBAAiB,EAAE,gBAAgB,CAAC;MAC1Db,MAAM,EAAE;QACNC,CAAC,EAAE,OAAO;QACVC,CAAC,EAAE;MACL;IACF,CAAC,EACD;MACEhF,IAAI,EAAE,MAAM;MACZ0B,IAAI,EAAE,gBAAgB;MACtB3B,EAAE,EAAE,gBAAgB;MACpBE,UAAU,EAAE,CAAC;MACb4E,UAAU,EAAE,CAAC;MACbU,MAAM,EAAE,MAAM;MACd9E,SAAS,EAAE;QACTC,KAAK,EAAE,aAAa;QACpBmD,KAAK,EAAE;MACT,CAAC;MACDsD,SAAS,EAAE;QACTzG,KAAK,EAAEjC,kBAAkB;QACzByI,OAAO,EAAErI;MACX,CAAC;MACDwI,KAAK,EAAE,WAAW;MAClBhC,QAAQ,EAAE;QACR+B,QAAQ,EAAE;MACZ,CAAC;MACD/G,OAAO,EAAE;QACP0B,IAAI,EAAE;MACR,CAAC;MACD4D,UAAU,EAAE,CAAC,OAAO,EAAE,gBAAgB,CAAC;MACvCb,MAAM,EAAE;QACNC,CAAC,EAAE,OAAO;QACVC,CAAC,EAAE;MACL;IACF,CAAC,CACF;IACDsC,IAAI,EAAE,CACJ;MACE5F,IAAI,EAAE,WAAW;MACjB3B,EAAE,EAAE,WAAW;MACf+D,MAAM,KAAAzC,MAAA,CAAKjC,uBAAY,CAACmI,WAAW,OAAI;MACvCC,GAAG,EAAE,KAAK;MACVC,IAAI,EAAE,KAAK;MACXC,KAAK,KAAArG,MAAA,CAAK/C,SAAS,GAAGc,uBAAY,CAACuI,oBAAoB,GAAGvI,uBAAY,CAACwI,mBAAmB,OAAI;MAC9FC,MAAM,KAAAxG,MAAA,CAAKjC,uBAAY,CAAC0I,YAAY;IACtC,CAAC,EACD;MACEpG,IAAI,EAAE,gBAAgB;MACtB3B,EAAE,EAAE,gBAAgB;MACpB+D,MAAM,KAAAzC,MAAA,CAAKjC,uBAAY,CAAC2I,gBAAgB,OAAI;MAC5CF,MAAM,OAAO;MACbJ,IAAI,EAAE,KAAK;MACXC,KAAK,KAAArG,MAAA,CAAK/C,SAAS,GAAGc,uBAAY,CAACuI,oBAAoB,GAAGvI,uBAAY,CAACwI,mBAAmB;IAC5F,CAAC,CACF;IACDI,OAAO,EAAE,CACP,GAAGrI,aAAa,EAChB;MACEK,IAAI,EAAE,MAAM;MACZyF,MAAM,EAAE,IAAI;MACZwC,CAAC,EAAE,CAAC;MACJR,IAAI,EAAE,CAAC;MACPI,MAAM,EAAEK,kCAAuB,CAACC,uBAAuB;MACvDvB,KAAK,EAAE;QACLwB,IAAI,KAAA/G,MAAA,CAAK9C,aAAa,CAAC,WAAW,CAAC,MAAG;QACtC8J,UAAU,EAAE,WAAW;QACvBzG,QAAQ,EAAE,EAAE;QACZ0G,UAAU,EAAE,MAAM;QAClBzB,IAAI,EAAE9H;MACR;IACF,CAAC;EAEL,CAAC;AACH,CAAC;AAACwJ,OAAA,CAAArL,SAAA,GAAAA,SAAA","ignoreList":[]}

package/dist/main/CrowdViewWidget/components/Chart/types.js.map

@@ -1 +1 @@
-{"version":3,"file":"types.js","names":[],"sources":["../../../../../src/CrowdViewWidget/components/Chart/types.ts"],"sourcesContent":["import type { EChartsOption } from 'echarts';\n\nimport type {\n  BookType,\n  Division,\n  Granularity,\n} from '../../../gql/types/graphql';\nimport type { InstrumentId } from '../../types';\n\nexport interface Bucket {\n  price: number;\n  sentiment: number;\n}\n\nexport interface UseCrowdViewDataProps {\n  instrument: InstrumentId;\n  bookType: BookType;\n  division: Division;\n  granularity: Granularity;\n}\n\ninterface CrowdViewData {\n  xAxisData: string[];\n  // [open, close, low, high]\n  candlesSeriesData: [number, number, number, number][];\n  // [time, price, index]\n  orderPositionBooks: [string, number | null, number][];\n  bucketWidth: number;\n  buckets: Bucket[][];\n  precision: number;\n  bookType: BookType;\n}\n\nexport interface UseCrowdViewDataReturn {\n  data: CrowdViewData | null;\n  loading: boolean;\n  error: boolean;\n}\n\nexport type GetOptionType = (\n  props: CrowdViewData,\n  isDark: boolean,\n  isDesktop: boolean,\n  labelCallback: (key: string, params?: Record<string, unknown>) => string\n) => EChartsOption;\n\nexport interface ChartProps {\n  data: CrowdViewData;\n  isDesktop: boolean;\n}\n\nexport interface ChartWithDataProps {\n  bookType: BookType;\n  division: Division;\n  instrument: InstrumentId;\n  granularity: Granularity;\n}\n\nexport interface GetLabelsDataProps {\n  xAxisData: string[];\n  isGreaterThanTwoWeeks: boolean;\n}\n"],"mappings":"","ignoreList":[]}
+{"version":3,"file":"types.js","names":[],"sources":["../../../../../src/CrowdViewWidget/components/Chart/types.ts"],"sourcesContent":["import type { EChartsOption } from 'echarts';\n\nimport type {\n  BookType,\n  Division,\n  Granularity,\n} from '../../../gql/types/graphql';\nimport type { InstrumentId } from '../../types';\n\nexport interface Bucket {\n  price: number;\n  sentiment: number;\n}\n\nexport interface UseCrowdViewDataProps {\n  instrument: InstrumentId;\n  bookType: BookType;\n  division: Division;\n  granularity: Granularity;\n}\n\ninterface CrowdViewMainData {\n  dates: string[];\n  candlesOpen: number[];\n  candlesClose: number[];\n  candlesLow: number[];\n  candlesHigh: number[];\n  bookPrices?: (number | null)[];\n  bookIndexes?: (number | null)[];\n  sentimentShorts: (number | null)[];\n  sentimentLongs: (number | null)[];\n}\n\ninterface CrowdViewAdditionalData {\n  bucketWidth: number;\n  buckets: Bucket[][];\n  displayPrecision: number;\n  bookType: BookType;\n  sentimentThresholdMin: number;\n  sentimentThresholdMax: number;\n}\n\nexport interface UseCrowdViewDataReturn {\n  mainData?: CrowdViewMainData | null;\n  additionalData?: CrowdViewAdditionalData | null;\n  loading: boolean;\n  error: boolean;\n}\n\ninterface GetOptionProps {\n  mainData: CrowdViewMainData;\n  additionalData: CrowdViewAdditionalData;\n  isDark: boolean;\n  isDesktop: boolean;\n  labelCallback: (key: string, params?: Record<string, unknown>) => string;\n}\n\nexport type GetOptionType = (props: GetOptionProps) => EChartsOption;\n\nexport interface ChartProps {\n  mainData: CrowdViewMainData;\n  additionalData: CrowdViewAdditionalData;\n  isDesktop: boolean;\n}\n\nexport interface ChartWithDataProps {\n  bookType: BookType;\n  division: Division;\n  instrument: InstrumentId;\n  granularity: Granularity;\n}\n\nexport interface GetLabelsDataProps {\n  dates: string[];\n  isGreaterThanTwoWeeks: boolean;\n}\n\ninterface BaseTooltipParam {\n  [key: string]: unknown;\n  seriesId?: string;\n  seriesName?: string;\n  seriesType?: string;\n  axisValue?: string | number;\n  axisValueLabel?: string;\n  axisDimension?: string;\n  axisIndex?: number;\n  value: unknown;\n}\n\nexport type TooltipParam =\n  | (BaseTooltipParam & {\n      seriesId: 'candlestick';\n      value: [number, number, number, number, number]; // [0, open, close, low, high]\n    })\n  | (BaseTooltipParam & {\n      seriesId: 'heatmap';\n      value: [string, number, number]; // [time, price, index]\n    })\n  | (BaseTooltipParam & {\n      seriesId: 'sentiment';\n      value: [string, number, number]; // [time, shortPercent, longPercent]\n    });\n\nexport interface DataZoomBatchItem {\n  [key: string]: unknown;\n  start: number;\n  end: number;\n  dataZoomId?: string;\n}\n\nexport interface DataZoomEvent {\n  [key: string]: unknown;\n  type: 'datazoom';\n  batch?: DataZoomBatchItem[];\n}\n\nexport interface DataZoomItem {\n  startValue: number;\n  endValue: number;\n}\n\nexport type DataZoomArray = Array<DataZoomItem>;\n\nexport interface XAxisItem {\n  name?: string;\n}\n\nexport type XAxisArray = Array<XAxisItem>;\n"],"mappings":"","ignoreList":[]}