@oanda/labs-currency-power-balance-widget 1.0.182 → 1.0.184
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 +1476 -0
- package/dist/main/CurrencyPowerBalanceWidget/ChartWithData.js +3 -4
- package/dist/main/CurrencyPowerBalanceWidget/ChartWithData.js.map +1 -1
- package/dist/main/CurrencyPowerBalanceWidget/Main.js +2 -2
- package/dist/main/CurrencyPowerBalanceWidget/Main.js.map +1 -1
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/formatters.js +11 -2
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/formatters.js.map +1 -1
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/getOption.js +2 -2
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/getOption.js.map +1 -1
- package/dist/main/gql/getCurrencyPowerBalance.js +12 -3
- package/dist/main/gql/getCurrencyPowerBalance.js.map +1 -1
- package/dist/main/gql/types/fragment-masking.js +2 -3
- package/dist/main/gql/types/fragment-masking.js.map +1 -1
- package/dist/main/gql/types/gql.js +1 -2
- package/dist/main/gql/types/gql.js.map +1 -1
- package/dist/module/CurrencyPowerBalanceWidget/ChartWithData.js +3 -4
- package/dist/module/CurrencyPowerBalanceWidget/ChartWithData.js.map +1 -1
- package/dist/module/CurrencyPowerBalanceWidget/Main.js +2 -2
- package/dist/module/CurrencyPowerBalanceWidget/Main.js.map +1 -1
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/formatters.js +11 -2
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/formatters.js.map +1 -1
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/getOption.js +2 -2
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/getOption.js.map +1 -1
- package/dist/module/gql/getCurrencyPowerBalance.js +12 -3
- package/dist/module/gql/getCurrencyPowerBalance.js.map +1 -1
- package/dist/module/gql/types/fragment-masking.js +2 -3
- package/dist/module/gql/types/fragment-masking.js.map +1 -1
- package/dist/module/gql/types/gql.js +1 -2
- package/dist/module/gql/types/gql.js.map +1 -1
- package/package.json +3 -3
|
@@ -13,7 +13,6 @@ var _Chart = require("./components/Chart");
|
|
|
13
13
|
var _constants = require("./constants");
|
|
14
14
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
15
15
|
const ChartWithData = _ref => {
|
|
16
|
-
var _data$currencyPowerBa, _;
|
|
17
16
|
let {
|
|
18
17
|
timeUnit,
|
|
19
18
|
currencies
|
|
@@ -35,7 +34,7 @@ const ChartWithData = _ref => {
|
|
|
35
34
|
},
|
|
36
35
|
fetchPolicy: 'cache-and-network'
|
|
37
36
|
});
|
|
38
|
-
const showError =
|
|
37
|
+
const showError = data?.currencyPowerBalance?.length === 0 || error || currencies && (currencies.length === 0 || currencies.length === 1);
|
|
39
38
|
return _react.default.createElement(_react.default.Fragment, null, loading && _react.default.createElement("div", {
|
|
40
39
|
className: "lw-mb-[50px] lw-flex lw-h-[375px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary"
|
|
41
40
|
}, _react.default.createElement(_labsWidgetCommon.Spinner, {
|
|
@@ -43,7 +42,7 @@ const ChartWithData = _ref => {
|
|
|
43
42
|
})), !loading && !showError && _react.default.createElement(_Chart.Chart, {
|
|
44
43
|
currencies: currencies,
|
|
45
44
|
timeUnit: timeUnit,
|
|
46
|
-
values: data
|
|
45
|
+
values: data?.currencyPowerBalance
|
|
47
46
|
}), !loading && showError && _react.default.createElement("div", {
|
|
48
47
|
className: "lw-flex lw-h-[375px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary"
|
|
49
48
|
}, _react.default.createElement(_labsWidgetCommon.ChartError, null)), isDesktop && _react.default.createElement(_labsWidgetCommon.Tooltip, {
|
|
@@ -52,7 +51,7 @@ const ChartWithData = _ref => {
|
|
|
52
51
|
className: "lw-mt-2 lw-h-8"
|
|
53
52
|
}, !loading && !showError && _react.default.createElement(_labsWidgetCommon.LastUpdated, {
|
|
54
53
|
labelCallback: lang,
|
|
55
|
-
timestamp: data
|
|
54
|
+
timestamp: data?.currencyPowerBalance[0]?.updatedAt
|
|
56
55
|
})));
|
|
57
56
|
};
|
|
58
57
|
exports.ChartWithData = ChartWithData;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChartWithData.js","names":["_client","require","_labsWidgetCommon","_monoI18n","_react","_interopRequireDefault","_getCurrencyPowerBalance","_Chart","_constants","e","__esModule","default","ChartWithData","_ref","
|
|
1
|
+
{"version":3,"file":"ChartWithData.js","names":["_client","require","_labsWidgetCommon","_monoI18n","_react","_interopRequireDefault","_getCurrencyPowerBalance","_Chart","_constants","e","__esModule","default","ChartWithData","_ref","timeUnit","currencies","size","useLayoutProvider","isDesktop","Size","DESKTOP","lang","useLocale","loading","data","error","useQuery","getCurrencyPowerBalance","variables","fetchPolicy","showError","currencyPowerBalance","length","createElement","Fragment","className","Spinner","SpinnerSize","lg","Chart","values","ChartError","Tooltip","id","CURRENCY_POWER_BALANCE_TOOLTIP_ID","LastUpdated","labelCallback","timestamp","updatedAt","exports"],"sources":["../../../src/CurrencyPowerBalanceWidget/ChartWithData.tsx"],"sourcesContent":["import { useQuery } from '@apollo/client';\nimport {\n ChartError,\n LastUpdated,\n Size,\n Spinner,\n SpinnerSize,\n Tooltip,\n useLayoutProvider,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport React from 'react';\n\nimport { getCurrencyPowerBalance } from '../gql/getCurrencyPowerBalance';\nimport type {\n GetCurrencyPowerBalanceQuery,\n GetCurrencyPowerBalanceQueryVariables,\n} from '../gql/types/graphql';\nimport { Chart } from './components/Chart';\nimport { CURRENCY_POWER_BALANCE_TOOLTIP_ID } from './constants';\nimport type { ChartWithDataProps } from './types';\n\nconst ChartWithData = ({ timeUnit, currencies }: ChartWithDataProps) => {\n const { size } = useLayoutProvider();\n const isDesktop = size === Size.DESKTOP;\n const { lang } = useLocale();\n const { loading, data, error } = useQuery<\n GetCurrencyPowerBalanceQuery,\n GetCurrencyPowerBalanceQueryVariables\n >(getCurrencyPowerBalance, {\n variables: {\n timeUnit,\n },\n fetchPolicy: 'cache-and-network',\n });\n\n const showError =\n data?.currencyPowerBalance?.length === 0 ||\n error ||\n (currencies && (currencies.length === 0 || currencies.length === 1));\n\n return (\n <>\n {loading && (\n <div className=\"lw-mb-[50px] lw-flex lw-h-[375px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary\">\n <Spinner size={SpinnerSize.lg} />\n </div>\n )}\n {!loading && !showError && (\n <Chart\n currencies={currencies}\n timeUnit={timeUnit}\n values={data?.currencyPowerBalance!}\n />\n )}\n {!loading && showError && (\n <div className=\"lw-flex lw-h-[375px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary\">\n <ChartError />\n </div>\n )}\n {isDesktop && <Tooltip id={CURRENCY_POWER_BALANCE_TOOLTIP_ID} />}\n <div className=\"lw-mt-2 lw-h-8\">\n {!loading && !showError && (\n <LastUpdated\n labelCallback={lang}\n timestamp={data?.currencyPowerBalance![0]?.updatedAt}\n />\n )}\n </div>\n </>\n );\n};\n\nexport { ChartWithData };\n"],"mappings":";;;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAD,OAAA;AASA,IAAAE,SAAA,GAAAF,OAAA;AACA,IAAAG,MAAA,GAAAC,sBAAA,CAAAJ,OAAA;AAEA,IAAAK,wBAAA,GAAAL,OAAA;AAKA,IAAAM,MAAA,GAAAN,OAAA;AACA,IAAAO,UAAA,GAAAP,OAAA;AAAgE,SAAAI,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAGhE,MAAMG,aAAa,GAAGC,IAAA,IAAkD;EAAA,IAAjD;IAAEC,QAAQ;IAAEC;EAA+B,CAAC,GAAAF,IAAA;EACjE,MAAM;IAAEG;EAAK,CAAC,GAAG,IAAAC,mCAAiB,EAAC,CAAC;EACpC,MAAMC,SAAS,GAAGF,IAAI,KAAKG,sBAAI,CAACC,OAAO;EACvC,MAAM;IAAEC;EAAK,CAAC,GAAG,IAAAC,mBAAS,EAAC,CAAC;EAC5B,MAAM;IAAEC,OAAO;IAAEC,IAAI;IAAEC;EAAM,CAAC,GAAG,IAAAC,gBAAQ,EAGvCC,gDAAuB,EAAE;IACzBC,SAAS,EAAE;MACTd;IACF,CAAC;IACDe,WAAW,EAAE;EACf,CAAC,CAAC;EAEF,MAAMC,SAAS,GACbN,IAAI,EAAEO,oBAAoB,EAAEC,MAAM,KAAK,CAAC,IACxCP,KAAK,IACJV,UAAU,KAAKA,UAAU,CAACiB,MAAM,KAAK,CAAC,IAAIjB,UAAU,CAACiB,MAAM,KAAK,CAAC,CAAE;EAEtE,OACE5B,MAAA,CAAAO,OAAA,CAAAsB,aAAA,CAAA7B,MAAA,CAAAO,OAAA,CAAAuB,QAAA,QACGX,OAAO,IACNnB,MAAA,CAAAO,OAAA,CAAAsB,aAAA;IAAKE,SAAS,EAAC;EAAgH,GAC7H/B,MAAA,CAAAO,OAAA,CAAAsB,aAAA,CAAC/B,iBAAA,CAAAkC,OAAO;IAACpB,IAAI,EAAEqB,6BAAW,CAACC;EAAG,CAAE,CAC7B,CACN,EACA,CAACf,OAAO,IAAI,CAACO,SAAS,IACrB1B,MAAA,CAAAO,OAAA,CAAAsB,aAAA,CAAC1B,MAAA,CAAAgC,KAAK;IACJxB,UAAU,EAAEA,UAAW;IACvBD,QAAQ,EAAEA,QAAS;IACnB0B,MAAM,EAAEhB,IAAI,EAAEO;EAAsB,CACrC,CACF,EACA,CAACR,OAAO,IAAIO,SAAS,IACpB1B,MAAA,CAAAO,OAAA,CAAAsB,aAAA;IAAKE,SAAS,EAAC;EAAmG,GAChH/B,MAAA,CAAAO,OAAA,CAAAsB,aAAA,CAAC/B,iBAAA,CAAAuC,UAAU,MAAE,CACV,CACN,EACAvB,SAAS,IAAId,MAAA,CAAAO,OAAA,CAAAsB,aAAA,CAAC/B,iBAAA,CAAAwC,OAAO;IAACC,EAAE,EAAEC;EAAkC,CAAE,CAAC,EAChExC,MAAA,CAAAO,OAAA,CAAAsB,aAAA;IAAKE,SAAS,EAAC;EAAgB,GAC5B,CAACZ,OAAO,IAAI,CAACO,SAAS,IACrB1B,MAAA,CAAAO,OAAA,CAAAsB,aAAA,CAAC/B,iBAAA,CAAA2C,WAAW;IACVC,aAAa,EAAEzB,IAAK;IACpB0B,SAAS,EAAEvB,IAAI,EAAEO,oBAAoB,CAAE,CAAC,CAAC,EAAEiB;EAAU,CACtD,CAEA,CACL,CAAC;AAEP,CAAC;AAACC,OAAA,CAAArC,aAAA,GAAAA,aAAA","ignoreList":[]}
|
|
@@ -41,9 +41,9 @@ const Main = _ref => {
|
|
|
41
41
|
key: label,
|
|
42
42
|
className: "lw-mb-6 lw-flex lw-justify-center lw-font-sans lw-text-lg lw-font-bold",
|
|
43
43
|
"data-testid": "time-unit-label"
|
|
44
|
-
}, tooltipLabel ? _react.default.createElement("span", null,
|
|
44
|
+
}, tooltipLabel ? _react.default.createElement("span", null, `${lang(tooltipLabel.translationKey, {
|
|
45
45
|
count: tooltipLabel.count
|
|
46
|
-
}))
|
|
46
|
+
})}`) : _react.default.createElement("span", null, `${lang(label)}`));
|
|
47
47
|
})) : _react.default.createElement(_labsWidgetCommon.TimeUnitSwitch, {
|
|
48
48
|
callback: setSelectedTimeUnit,
|
|
49
49
|
options: _config.timeUnitConfig,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Main.js","names":["_labsWidgetCommon","require","_monoI18n","_react","_interopRequireWildcard","_graphql","_ChartWithData","_config","_constants","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","Main","_ref","timeUnit","currencies","size","useLayoutProvider","lang","useLocale","selectedTimeUnit","setSelectedTimeUnit","useState","CurrencyPowerBalanceTimeUnit","CurrentDay","createElement","Fragment","className","timeUnitConfig","filter","_ref2","value","map","_ref3","tooltipLabel","label","key","
|
|
1
|
+
{"version":3,"file":"Main.js","names":["_labsWidgetCommon","require","_monoI18n","_react","_interopRequireWildcard","_graphql","_ChartWithData","_config","_constants","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","Main","_ref","timeUnit","currencies","size","useLayoutProvider","lang","useLocale","selectedTimeUnit","setSelectedTimeUnit","useState","CurrencyPowerBalanceTimeUnit","CurrentDay","createElement","Fragment","className","timeUnitConfig","filter","_ref2","value","map","_ref3","tooltipLabel","label","key","translationKey","count","TimeUnitSwitch","callback","options","selected","tooltipId","CURRENCY_POWER_BALANCE_TOOLTIP_ID","ChartWithData","exports"],"sources":["../../../src/CurrencyPowerBalanceWidget/Main.tsx"],"sourcesContent":["import { TimeUnitSwitch, useLayoutProvider } from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport React, { useState } from 'react';\n\nimport { CurrencyPowerBalanceTimeUnit } from '../gql/types/graphql';\nimport { ChartWithData } from './ChartWithData';\nimport { timeUnitConfig } from './config';\nimport { CURRENCY_POWER_BALANCE_TOOLTIP_ID } from './constants';\nimport type { MainProps } from './types';\n\nconst Main = ({ timeUnit, currencies }: MainProps) => {\n const { size } = useLayoutProvider();\n const { lang } = useLocale();\n const [selectedTimeUnit, setSelectedTimeUnit] = useState(\n timeUnit || CurrencyPowerBalanceTimeUnit.CurrentDay\n );\n return (\n <>\n {size && (\n <div\n className=\"lw-flex lw-flex-col lw-text-sm lw-tracking-normal\"\n data-testid=\"currency-power-balance-wrapper\"\n >\n {timeUnit && currencies ? (\n <>\n {timeUnitConfig\n .filter(({ value }) => value === selectedTimeUnit)\n .map(({ tooltipLabel, label }) => (\n <div\n key={label}\n className=\"lw-mb-6 lw-flex lw-justify-center lw-font-sans lw-text-lg lw-font-bold\"\n data-testid=\"time-unit-label\"\n >\n {tooltipLabel ? (\n <span>{`${lang(tooltipLabel!.translationKey, { count: tooltipLabel!.count })}`}</span>\n ) : (\n <span>{`${lang(label)}`}</span>\n )}\n </div>\n ))}\n </>\n ) : (\n <TimeUnitSwitch<CurrencyPowerBalanceTimeUnit>\n callback={setSelectedTimeUnit}\n options={timeUnitConfig}\n selected={selectedTimeUnit}\n tooltipId={CURRENCY_POWER_BALANCE_TOOLTIP_ID}\n />\n )}\n <ChartWithData\n currencies={timeUnit && currencies}\n timeUnit={selectedTimeUnit}\n />\n </div>\n )}\n </>\n );\n};\n\nexport { Main };\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -36,9 +36,18 @@ const tooltipFormatter = values => {
|
|
|
36
36
|
seriesName,
|
|
37
37
|
value
|
|
38
38
|
} = _ref3;
|
|
39
|
-
return
|
|
39
|
+
return `<div style="display:flex;align-items:center;">
|
|
40
|
+
<div style="display:flex;align-items:center;width:50px;margin-right:10px;">
|
|
41
|
+
${marker}
|
|
42
|
+
<span>${seriesName}</span>
|
|
43
|
+
</div>
|
|
44
|
+
<span>${value[1]}</span>
|
|
45
|
+
</div>`;
|
|
40
46
|
});
|
|
41
|
-
return
|
|
47
|
+
return `<div style="display:flex; flex-direction:column;">
|
|
48
|
+
<span style="margin-bottom:5px;">${date}</span>
|
|
49
|
+
${row.join('\n')}
|
|
50
|
+
</div>`;
|
|
42
51
|
};
|
|
43
52
|
exports.tooltipFormatter = tooltipFormatter;
|
|
44
53
|
const formatLegendData = values => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"formatters.js","names":["_labsWidgetCommon","require","_graphql","_constants","isMonthWeek","timeUnit","CurrencyPowerBalanceTimeUnit","M3","M1","W1","exports","xAxisLabelFormatter","label","date","time","getChartDateAndTime","isDateFormat","chartDateFormat","intervalFormatter","dataLength","Math","round","VERTICAL_LINE_COUNT","tooltipFormatter","values","chartDateTimeFormat","value","row","sort","_ref","_ref2","valueA","valueB","Number","map","_ref3","marker","seriesName","
|
|
1
|
+
{"version":3,"file":"formatters.js","names":["_labsWidgetCommon","require","_graphql","_constants","isMonthWeek","timeUnit","CurrencyPowerBalanceTimeUnit","M3","M1","W1","exports","xAxisLabelFormatter","label","date","time","getChartDateAndTime","isDateFormat","chartDateFormat","intervalFormatter","dataLength","Math","round","VERTICAL_LINE_COUNT","tooltipFormatter","values","chartDateTimeFormat","value","row","sort","_ref","_ref2","valueA","valueB","Number","map","_ref3","marker","seriesName","join","formatLegendData","dataCurrencies","_ref4","currency","list","length","CURRENCIES_ORDER","filter","includes","name","itemStyle","color","COLOR_CONFIG"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/formatters.ts"],"sourcesContent":["import {\n chartDateFormat,\n chartDateTimeFormat,\n getChartDateAndTime,\n} from '@oanda/labs-widget-common';\n\nimport type { CurrencyPowerBalance } from '../../../../gql/types/graphql';\nimport { CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';\nimport {\n COLOR_CONFIG,\n CURRENCIES_ORDER,\n VERTICAL_LINE_COUNT,\n} from './constants';\nimport type { TooltipFormatterParams } from './types';\n\nconst isMonthWeek = (timeUnit: CurrencyPowerBalanceTimeUnit) =>\n timeUnit === CurrencyPowerBalanceTimeUnit.M3 ||\n timeUnit === CurrencyPowerBalanceTimeUnit.M1 ||\n timeUnit === CurrencyPowerBalanceTimeUnit.W1;\n\nconst xAxisLabelFormatter = (\n label: string,\n timeUnit: CurrencyPowerBalanceTimeUnit\n) => {\n const { date, time } = getChartDateAndTime(label);\n const isDateFormat = isMonthWeek(timeUnit) || time === '00:00';\n\n return isDateFormat ? chartDateFormat(date) : time;\n};\n\nconst intervalFormatter = (dataLength: number) =>\n Math.round(dataLength / VERTICAL_LINE_COUNT);\n\nconst tooltipFormatter = (values: TooltipFormatterParams[]) => {\n const date = chartDateTimeFormat(getChartDateAndTime(values[0].value[0]));\n\n const row = values\n .sort(\n ({ value: valueA }, { value: valueB }) =>\n Number(valueB[1]) - Number(valueA[1])\n )\n .map(\n ({\n marker,\n seriesName,\n value,\n }) => `<div style=\"display:flex;align-items:center;\">\n <div style=\"display:flex;align-items:center;width:50px;margin-right:10px;\">\n ${marker}\n <span>${seriesName}</span>\n </div>\n <span>${value[1]}</span>\n </div>`\n );\n\n return `<div style=\"display:flex; flex-direction:column;\">\n <span style=\"margin-bottom:5px;\">${date}</span>\n ${row.join('\\n')}\n </div>`;\n};\n\nconst formatLegendData = (values: CurrencyPowerBalance[]) => {\n const dataCurrencies = values.map(({ currency }) => currency);\n\n const list =\n dataCurrencies.length === CURRENCIES_ORDER.length\n ? CURRENCIES_ORDER\n : CURRENCIES_ORDER.filter((currency) =>\n dataCurrencies.includes(currency)\n );\n\n return list.map((currency) => ({\n name: currency,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\n }));\n};\n\nexport {\n formatLegendData,\n intervalFormatter,\n isMonthWeek,\n tooltipFormatter,\n xAxisLabelFormatter,\n};\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,OAAA;AAOA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,UAAA,GAAAF,OAAA;AAOA,MAAMG,WAAW,GAAIC,QAAsC,IACzDA,QAAQ,KAAKC,qCAA4B,CAACC,EAAE,IAC5CF,QAAQ,KAAKC,qCAA4B,CAACE,EAAE,IAC5CH,QAAQ,KAAKC,qCAA4B,CAACG,EAAE;AAACC,OAAA,CAAAN,WAAA,GAAAA,WAAA;AAE/C,MAAMO,mBAAmB,GAAGA,CAC1BC,KAAa,EACbP,QAAsC,KACnC;EACH,MAAM;IAAEQ,IAAI;IAAEC;EAAK,CAAC,GAAG,IAAAC,qCAAmB,EAACH,KAAK,CAAC;EACjD,MAAMI,YAAY,GAAGZ,WAAW,CAACC,QAAQ,CAAC,IAAIS,IAAI,KAAK,OAAO;EAE9D,OAAOE,YAAY,GAAG,IAAAC,iCAAe,EAACJ,IAAI,CAAC,GAAGC,IAAI;AACpD,CAAC;AAACJ,OAAA,CAAAC,mBAAA,GAAAA,mBAAA;AAEF,MAAMO,iBAAiB,GAAIC,UAAkB,IAC3CC,IAAI,CAACC,KAAK,CAACF,UAAU,GAAGG,8BAAmB,CAAC;AAACZ,OAAA,CAAAQ,iBAAA,GAAAA,iBAAA;AAE/C,MAAMK,gBAAgB,GAAIC,MAAgC,IAAK;EAC7D,MAAMX,IAAI,GAAG,IAAAY,qCAAmB,EAAC,IAAAV,qCAAmB,EAACS,MAAM,CAAC,CAAC,CAAC,CAACE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;EAEzE,MAAMC,GAAG,GAAGH,MAAM,CACfI,IAAI,CACH,CAAAC,IAAA,EAAAC,KAAA;IAAA,IAAC;MAAEJ,KAAK,EAAEK;IAAO,CAAC,GAAAF,IAAA;IAAA,IAAE;MAAEH,KAAK,EAAEM;IAAO,CAAC,GAAAF,KAAA;IAAA,OACnCG,MAAM,CAACD,MAAM,CAAC,CAAC,CAAC,CAAC,GAAGC,MAAM,CAACF,MAAM,CAAC,CAAC,CAAC,CAAC;EAAA,CACzC,CAAC,CACAG,GAAG,CACFC,KAAA;IAAA,IAAC;MACCC,MAAM;MACNC,UAAU;MACVX;IACF,CAAC,GAAAS,KAAA;IAAA,OAAK;AACZ;AACA,UAAUC,MAAM;AAChB,gBAAgBC,UAAU;AAC1B;AACA,cAAcX,KAAK,CAAC,CAAC,CAAC;AACtB,WAAW;EAAA,CACP,CAAC;EAEH,OAAO;AACT,uCAAuCb,IAAI;AAC3C,MAAMc,GAAG,CAACW,IAAI,CAAC,IAAI,CAAC;AACpB,SAAS;AACT,CAAC;AAAC5B,OAAA,CAAAa,gBAAA,GAAAA,gBAAA;AAEF,MAAMgB,gBAAgB,GAAIf,MAA8B,IAAK;EAC3D,MAAMgB,cAAc,GAAGhB,MAAM,CAACU,GAAG,CAACO,KAAA;IAAA,IAAC;MAAEC;IAAS,CAAC,GAAAD,KAAA;IAAA,OAAKC,QAAQ;EAAA,EAAC;EAE7D,MAAMC,IAAI,GACRH,cAAc,CAACI,MAAM,KAAKC,2BAAgB,CAACD,MAAM,GAC7CC,2BAAgB,GAChBA,2BAAgB,CAACC,MAAM,CAAEJ,QAAQ,IAC/BF,cAAc,CAACO,QAAQ,CAACL,QAAQ,CAClC,CAAC;EAEP,OAAOC,IAAI,CAACT,GAAG,CAAEQ,QAAQ,KAAM;IAC7BM,IAAI,EAAEN,QAAQ;IACdO,SAAS,EAAE;MACTC,KAAK,EAAEC,uBAAY,CAACT,QAAQ;IAC9B;EACF,CAAC,CAAC,CAAC;AACL,CAAC;AAAChC,OAAA,CAAA6B,gBAAA,GAAAA,gBAAA","ignoreList":[]}
|
|
@@ -147,8 +147,8 @@ const getOption = (chartData, timeUnit, isDark, isDesktop, isMobile, lang) => {
|
|
|
147
147
|
name: 'main-grid',
|
|
148
148
|
top: '0px',
|
|
149
149
|
left: '0px',
|
|
150
|
-
right:
|
|
151
|
-
bottom:
|
|
150
|
+
right: `${isMobile ? _constants.Y_LABEL_SIZE_MOBILE : _constants.Y_LABEL_SIZE}px`,
|
|
151
|
+
bottom: `${isMobile ? _constants.X_LABEL_SIZE_MOBILE : _constants.X_LABEL_SIZE}px`
|
|
152
152
|
}],
|
|
153
153
|
graphic: [...baseGridLines]
|
|
154
154
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getOption.js","names":["_labsWidgetCommon","require","_graphql","_constants","_formatters","_utils","getOption","chartData","timeUnit","isDark","isDesktop","isMobile","lang","currentTheme","Theme","Dark","Light","dataTimestamps","power","map","x","Date","point","getTime","weekendsIndexes","findLastIndexesBeforeWeekend","disableWeekendsIndicator","CurrencyPowerBalanceTimeUnit","CurrentDay","PreviousDay","M3","includes","length","weekendsMarks","item","xAxis","label","formatter","seriesData","_ref","index","currency","name","type","symbol","showSymbol","itemStyle","color","COLOR_CONFIG","data","_ref2","price","markLine","show","position","align","distance","padding","fontSize","shadowBlur","shadowOffsetX","shadowOffsetY","borderWidth","themeColors","textPrimary","shadowColor","borderRadius","backgroundColor","borderPrimary","bgSecondary","emphasis","lineStyle","width","opacity","undefined","legendData","formatLegendData","baseGridLines","getGridLines","chartWidth","CHART_WIDTH","chartHeight","CHART_HEIGHT","xLabelsSize","X_LABEL_SIZE_MOBILE","X_LABEL_SIZE","yLabelSize","Y_LABEL_SIZE_MOBILE","Y_LABEL_SIZE","bottomLeftBox","marginBottom","LEGEND_HEIGHT_MOBILE","LEGEND_HEIGHT","animation","legend","bottom","icon","tooltip","trigger","axisPointer","axis","z","TOOLTIP_LINE_COLOR_CONFIG","DARK","LIGHT","tooltipFormatter","extraCssText","axisTick","axisLine","splitLine","axisLabel","margin","rotate","interval","intervalFormatter","xAxisLabelFormatter","yAxis","splitNumber","boundaryGap","showMaxLabel","showMinLabel","series","grid","top","left","right","concat","graphic","exports"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/getOption.ts"],"sourcesContent":["import { getGridLines, Theme, themeColors } from '@oanda/labs-widget-common';\n\nimport type { CurrencyPowerBalance } from '../../../../gql/types/graphql';\nimport { CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';\nimport {\n CHART_HEIGHT,\n CHART_WIDTH,\n COLOR_CONFIG,\n LEGEND_HEIGHT,\n LEGEND_HEIGHT_MOBILE,\n TOOLTIP_LINE_COLOR_CONFIG,\n X_LABEL_SIZE,\n X_LABEL_SIZE_MOBILE,\n Y_LABEL_SIZE,\n Y_LABEL_SIZE_MOBILE,\n} from './constants';\nimport {\n formatLegendData,\n intervalFormatter,\n tooltipFormatter,\n xAxisLabelFormatter,\n} from './formatters';\nimport { findLastIndexesBeforeWeekend } from './utils';\n\nconst getOption = (\n chartData: CurrencyPowerBalance[],\n timeUnit: CurrencyPowerBalanceTimeUnit,\n isDark: boolean,\n isDesktop: boolean,\n isMobile: boolean,\n lang: (key: string) => string\n) => {\n const currentTheme = isDark ? Theme.Dark : Theme.Light;\n const dataTimestamps = chartData[0].power.map((x) =>\n new Date(x.point).getTime()\n );\n const weekendsIndexes = findLastIndexesBeforeWeekend(dataTimestamps);\n const disableWeekendsIndicator =\n [\n CurrencyPowerBalanceTimeUnit.CurrentDay,\n CurrencyPowerBalanceTimeUnit.PreviousDay,\n CurrencyPowerBalanceTimeUnit.M3,\n ].includes(timeUnit) || weekendsIndexes.length === 0;\n\n const weekendsMarks = weekendsIndexes.map((item) => ({\n xAxis: item,\n label: {\n formatter: () => lang('market_closed'),\n },\n }));\n\n const seriesData = chartData.map(({ currency, power }, index) => ({\n name: currency,\n type: 'line',\n symbol: 'circle',\n showSymbol: false,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\n data: power.map(({ point, price }) => [point, price]),\n markLine:\n index === chartData.length - 1 && !disableWeekendsIndicator\n ? {\n label: {\n show: false,\n position: 'end',\n align: 'center',\n distance: -32,\n padding: [8, 8],\n fontSize: 12,\n shadowBlur: 24,\n shadowOffsetX: 0,\n shadowOffsetY: 6,\n borderWidth: 0,\n color: themeColors.textPrimary,\n shadowColor: 'rgba(0,0,0,0.1)',\n borderRadius: 4,\n backgroundColor: isDark\n ? themeColors.borderPrimary[currentTheme]\n : themeColors.bgSecondary[currentTheme],\n },\n show: false,\n emphasis: {\n label: {\n show: true,\n },\n lineStyle: {\n width: 1,\n opacity: 0,\n color: themeColors.borderPrimary[currentTheme],\n },\n },\n symbol: ['none', 'none'],\n itemStyle: {\n color: themeColors.borderPrimary[currentTheme],\n },\n data: weekendsMarks,\n }\n : undefined,\n }));\n\n const legendData = formatLegendData(chartData);\n\n const baseGridLines = getGridLines({\n isDark,\n chartWidth: CHART_WIDTH,\n chartHeight: CHART_HEIGHT,\n xLabelsSize: isMobile ? X_LABEL_SIZE_MOBILE : X_LABEL_SIZE,\n yLabelSize: isMobile ? Y_LABEL_SIZE_MOBILE : Y_LABEL_SIZE,\n bottomLeftBox: false,\n marginBottom: isMobile ? LEGEND_HEIGHT_MOBILE : LEGEND_HEIGHT,\n });\n\n return {\n animation: false,\n legend: {\n data: legendData,\n bottom: 10,\n icon: 'circle',\n },\n tooltip: {\n trigger: 'axis',\n axisPointer: {\n axis: 'x',\n z: 0,\n lineStyle: {\n color: isDark\n ? TOOLTIP_LINE_COLOR_CONFIG.DARK\n : TOOLTIP_LINE_COLOR_CONFIG.LIGHT,\n },\n },\n formatter: tooltipFormatter,\n extraCssText: 'z-index: 1',\n },\n xAxis: {\n type: 'category',\n axisTick: {\n show: false,\n },\n axisLine: { show: false },\n splitLine: {\n show: true,\n },\n axisLabel: {\n padding: [0, 0, 0, 4],\n align: 'left',\n margin: 10,\n rotate: -45,\n interval: intervalFormatter(seriesData[0].data.length),\n formatter: (label: string) => xAxisLabelFormatter(label, timeUnit),\n },\n },\n yAxis: {\n type: 'value',\n position: 'right',\n splitNumber: 5,\n axisLine: { show: false },\n axisTick: { show: false },\n boundaryGap: ['10%', '10%'],\n axisLabel: {\n showMaxLabel: false,\n showMinLabel: false,\n margin: isDesktop ? 8 : 6,\n },\n },\n series: seriesData,\n grid: [\n {\n name: 'main-grid',\n top: '0px',\n left: '0px',\n right: `${isMobile ? Y_LABEL_SIZE_MOBILE : Y_LABEL_SIZE}px`,\n bottom: `${isMobile ? X_LABEL_SIZE_MOBILE : X_LABEL_SIZE}px`,\n },\n ],\n graphic: [...baseGridLines],\n };\n};\n\nexport { getOption };\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"getOption.js","names":["_labsWidgetCommon","require","_graphql","_constants","_formatters","_utils","getOption","chartData","timeUnit","isDark","isDesktop","isMobile","lang","currentTheme","Theme","Dark","Light","dataTimestamps","power","map","x","Date","point","getTime","weekendsIndexes","findLastIndexesBeforeWeekend","disableWeekendsIndicator","CurrencyPowerBalanceTimeUnit","CurrentDay","PreviousDay","M3","includes","length","weekendsMarks","item","xAxis","label","formatter","seriesData","_ref","index","currency","name","type","symbol","showSymbol","itemStyle","color","COLOR_CONFIG","data","_ref2","price","markLine","show","position","align","distance","padding","fontSize","shadowBlur","shadowOffsetX","shadowOffsetY","borderWidth","themeColors","textPrimary","shadowColor","borderRadius","backgroundColor","borderPrimary","bgSecondary","emphasis","lineStyle","width","opacity","undefined","legendData","formatLegendData","baseGridLines","getGridLines","chartWidth","CHART_WIDTH","chartHeight","CHART_HEIGHT","xLabelsSize","X_LABEL_SIZE_MOBILE","X_LABEL_SIZE","yLabelSize","Y_LABEL_SIZE_MOBILE","Y_LABEL_SIZE","bottomLeftBox","marginBottom","LEGEND_HEIGHT_MOBILE","LEGEND_HEIGHT","animation","legend","bottom","icon","tooltip","trigger","axisPointer","axis","z","TOOLTIP_LINE_COLOR_CONFIG","DARK","LIGHT","tooltipFormatter","extraCssText","axisTick","axisLine","splitLine","axisLabel","margin","rotate","interval","intervalFormatter","xAxisLabelFormatter","yAxis","splitNumber","boundaryGap","showMaxLabel","showMinLabel","series","grid","top","left","right","graphic","exports"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/getOption.ts"],"sourcesContent":["import { getGridLines, Theme, themeColors } from '@oanda/labs-widget-common';\n\nimport type { CurrencyPowerBalance } from '../../../../gql/types/graphql';\nimport { CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';\nimport {\n CHART_HEIGHT,\n CHART_WIDTH,\n COLOR_CONFIG,\n LEGEND_HEIGHT,\n LEGEND_HEIGHT_MOBILE,\n TOOLTIP_LINE_COLOR_CONFIG,\n X_LABEL_SIZE,\n X_LABEL_SIZE_MOBILE,\n Y_LABEL_SIZE,\n Y_LABEL_SIZE_MOBILE,\n} from './constants';\nimport {\n formatLegendData,\n intervalFormatter,\n tooltipFormatter,\n xAxisLabelFormatter,\n} from './formatters';\nimport { findLastIndexesBeforeWeekend } from './utils';\n\nconst getOption = (\n chartData: CurrencyPowerBalance[],\n timeUnit: CurrencyPowerBalanceTimeUnit,\n isDark: boolean,\n isDesktop: boolean,\n isMobile: boolean,\n lang: (key: string) => string\n) => {\n const currentTheme = isDark ? Theme.Dark : Theme.Light;\n const dataTimestamps = chartData[0].power.map((x) =>\n new Date(x.point).getTime()\n );\n const weekendsIndexes = findLastIndexesBeforeWeekend(dataTimestamps);\n const disableWeekendsIndicator =\n [\n CurrencyPowerBalanceTimeUnit.CurrentDay,\n CurrencyPowerBalanceTimeUnit.PreviousDay,\n CurrencyPowerBalanceTimeUnit.M3,\n ].includes(timeUnit) || weekendsIndexes.length === 0;\n\n const weekendsMarks = weekendsIndexes.map((item) => ({\n xAxis: item,\n label: {\n formatter: () => lang('market_closed'),\n },\n }));\n\n const seriesData = chartData.map(({ currency, power }, index) => ({\n name: currency,\n type: 'line',\n symbol: 'circle',\n showSymbol: false,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\n data: power.map(({ point, price }) => [point, price]),\n markLine:\n index === chartData.length - 1 && !disableWeekendsIndicator\n ? {\n label: {\n show: false,\n position: 'end',\n align: 'center',\n distance: -32,\n padding: [8, 8],\n fontSize: 12,\n shadowBlur: 24,\n shadowOffsetX: 0,\n shadowOffsetY: 6,\n borderWidth: 0,\n color: themeColors.textPrimary,\n shadowColor: 'rgba(0,0,0,0.1)',\n borderRadius: 4,\n backgroundColor: isDark\n ? themeColors.borderPrimary[currentTheme]\n : themeColors.bgSecondary[currentTheme],\n },\n show: false,\n emphasis: {\n label: {\n show: true,\n },\n lineStyle: {\n width: 1,\n opacity: 0,\n color: themeColors.borderPrimary[currentTheme],\n },\n },\n symbol: ['none', 'none'],\n itemStyle: {\n color: themeColors.borderPrimary[currentTheme],\n },\n data: weekendsMarks,\n }\n : undefined,\n }));\n\n const legendData = formatLegendData(chartData);\n\n const baseGridLines = getGridLines({\n isDark,\n chartWidth: CHART_WIDTH,\n chartHeight: CHART_HEIGHT,\n xLabelsSize: isMobile ? X_LABEL_SIZE_MOBILE : X_LABEL_SIZE,\n yLabelSize: isMobile ? Y_LABEL_SIZE_MOBILE : Y_LABEL_SIZE,\n bottomLeftBox: false,\n marginBottom: isMobile ? LEGEND_HEIGHT_MOBILE : LEGEND_HEIGHT,\n });\n\n return {\n animation: false,\n legend: {\n data: legendData,\n bottom: 10,\n icon: 'circle',\n },\n tooltip: {\n trigger: 'axis',\n axisPointer: {\n axis: 'x',\n z: 0,\n lineStyle: {\n color: isDark\n ? TOOLTIP_LINE_COLOR_CONFIG.DARK\n : TOOLTIP_LINE_COLOR_CONFIG.LIGHT,\n },\n },\n formatter: tooltipFormatter,\n extraCssText: 'z-index: 1',\n },\n xAxis: {\n type: 'category',\n axisTick: {\n show: false,\n },\n axisLine: { show: false },\n splitLine: {\n show: true,\n },\n axisLabel: {\n padding: [0, 0, 0, 4],\n align: 'left',\n margin: 10,\n rotate: -45,\n interval: intervalFormatter(seriesData[0].data.length),\n formatter: (label: string) => xAxisLabelFormatter(label, timeUnit),\n },\n },\n yAxis: {\n type: 'value',\n position: 'right',\n splitNumber: 5,\n axisLine: { show: false },\n axisTick: { show: false },\n boundaryGap: ['10%', '10%'],\n axisLabel: {\n showMaxLabel: false,\n showMinLabel: false,\n margin: isDesktop ? 8 : 6,\n },\n },\n series: seriesData,\n grid: [\n {\n name: 'main-grid',\n top: '0px',\n left: '0px',\n right: `${isMobile ? Y_LABEL_SIZE_MOBILE : Y_LABEL_SIZE}px`,\n bottom: `${isMobile ? X_LABEL_SIZE_MOBILE : X_LABEL_SIZE}px`,\n },\n ],\n graphic: [...baseGridLines],\n };\n};\n\nexport { getOption };\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -5,7 +5,16 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
5
5
|
});
|
|
6
6
|
exports.getCurrencyPowerBalance = void 0;
|
|
7
7
|
var _client = require("@apollo/client");
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
8
|
+
const getCurrencyPowerBalance = exports.getCurrencyPowerBalance = (0, _client.gql)`
|
|
9
|
+
query GetCurrencyPowerBalance($timeUnit: CurrencyPowerBalanceTimeUnit!) {
|
|
10
|
+
currencyPowerBalance(timeUnit: $timeUnit) {
|
|
11
|
+
currency
|
|
12
|
+
power {
|
|
13
|
+
point
|
|
14
|
+
price
|
|
15
|
+
}
|
|
16
|
+
updatedAt
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
`;
|
|
11
20
|
//# sourceMappingURL=getCurrencyPowerBalance.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getCurrencyPowerBalance.js","names":["_client","require","
|
|
1
|
+
{"version":3,"file":"getCurrencyPowerBalance.js","names":["_client","require","getCurrencyPowerBalance","exports","gql"],"sources":["../../../src/gql/getCurrencyPowerBalance.ts"],"sourcesContent":["import { gql } from '@apollo/client';\n\nexport const getCurrencyPowerBalance = gql`\n query GetCurrencyPowerBalance($timeUnit: CurrencyPowerBalanceTimeUnit!) {\n currencyPowerBalance(timeUnit: $timeUnit) {\n currency\n power {\n point\n price\n }\n updatedAt\n }\n }\n`;\n"],"mappings":";;;;;;AAAA,IAAAA,OAAA,GAAAC,OAAA;AAEO,MAAMC,uBAAuB,GAAAC,OAAA,CAAAD,uBAAA,GAAG,IAAAE,WAAG;AAC1C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC","ignoreList":[]}
|
|
@@ -13,11 +13,10 @@ function makeFragmentData(data, _fragment) {
|
|
|
13
13
|
return data;
|
|
14
14
|
}
|
|
15
15
|
function isFragmentReady(queryNode, fragmentNode, data) {
|
|
16
|
-
|
|
17
|
-
const deferredFields = (_meta__ = queryNode.__meta__) === null || _meta__ === void 0 ? void 0 : _meta__.deferredFields;
|
|
16
|
+
const deferredFields = queryNode.__meta__?.deferredFields;
|
|
18
17
|
if (!deferredFields) return true;
|
|
19
18
|
const fragDef = fragmentNode.definitions[0];
|
|
20
|
-
const fragName = fragDef
|
|
19
|
+
const fragName = fragDef?.name?.value;
|
|
21
20
|
const fields = fragName && deferredFields[fragName] || [];
|
|
22
21
|
return fields.length > 0 && fields.every(field => data && field in data);
|
|
23
22
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"fragment-masking.js","names":["useFragment","_documentNode","fragmentType","makeFragmentData","data","_fragment","isFragmentReady","queryNode","fragmentNode","
|
|
1
|
+
{"version":3,"file":"fragment-masking.js","names":["useFragment","_documentNode","fragmentType","makeFragmentData","data","_fragment","isFragmentReady","queryNode","fragmentNode","deferredFields","__meta__","fragDef","definitions","fragName","name","value","fields","length","every","field"],"sources":["../../../../src/gql/types/fragment-masking.ts"],"sourcesContent":["import {\n ResultOf,\n DocumentTypeDecoration,\n TypedDocumentNode,\n} from '@graphql-typed-document-node/core';\nimport { FragmentDefinitionNode } from 'graphql';\nimport { Incremental } from './graphql';\n\nexport type FragmentType<\n TDocumentType extends DocumentTypeDecoration<any, any>,\n> =\n TDocumentType extends DocumentTypeDecoration<infer TType, any>\n ? [TType] extends [{ ' $fragmentName'?: infer TKey }]\n ? TKey extends string\n ? { ' $fragmentRefs'?: { [key in TKey]: TType } }\n : never\n : never\n : never;\n\n// return non-nullable if `fragmentType` is non-nullable\nexport function useFragment<TType>(\n _documentNode: DocumentTypeDecoration<TType, any>,\n fragmentType: FragmentType<DocumentTypeDecoration<TType, any>>\n): TType;\n// return nullable if `fragmentType` is nullable\nexport function useFragment<TType>(\n _documentNode: DocumentTypeDecoration<TType, any>,\n fragmentType:\n | FragmentType<DocumentTypeDecoration<TType, any>>\n | null\n | undefined\n): TType | null | undefined;\n// return array of non-nullable if `fragmentType` is array of non-nullable\nexport function useFragment<TType>(\n _documentNode: DocumentTypeDecoration<TType, any>,\n fragmentType: ReadonlyArray<FragmentType<DocumentTypeDecoration<TType, any>>>\n): ReadonlyArray<TType>;\n// return array of nullable if `fragmentType` is array of nullable\nexport function useFragment<TType>(\n _documentNode: DocumentTypeDecoration<TType, any>,\n fragmentType:\n | ReadonlyArray<FragmentType<DocumentTypeDecoration<TType, any>>>\n | null\n | undefined\n): ReadonlyArray<TType> | null | undefined;\nexport function useFragment<TType>(\n _documentNode: DocumentTypeDecoration<TType, any>,\n fragmentType:\n | FragmentType<DocumentTypeDecoration<TType, any>>\n | ReadonlyArray<FragmentType<DocumentTypeDecoration<TType, any>>>\n | null\n | undefined\n): TType | ReadonlyArray<TType> | null | undefined {\n return fragmentType as any;\n}\n\nexport function makeFragmentData<\n F extends DocumentTypeDecoration<any, any>,\n FT extends ResultOf<F>,\n>(data: FT, _fragment: F): FragmentType<F> {\n return data as FragmentType<F>;\n}\nexport function isFragmentReady<TQuery, TFrag>(\n queryNode: DocumentTypeDecoration<TQuery, any>,\n fragmentNode: TypedDocumentNode<TFrag>,\n data:\n | FragmentType<TypedDocumentNode<Incremental<TFrag>, any>>\n | null\n | undefined\n): data is FragmentType<typeof fragmentNode> {\n const deferredFields = (\n queryNode as {\n __meta__?: { deferredFields: Record<string, (keyof TFrag)[]> };\n }\n ).__meta__?.deferredFields;\n\n if (!deferredFields) return true;\n\n const fragDef = fragmentNode.definitions[0] as\n | FragmentDefinitionNode\n | undefined;\n const fragName = fragDef?.name?.value;\n\n const fields = (fragName && deferredFields[fragName]) || [];\n return fields.length > 0 && fields.every((field) => data && field in data);\n}\n"],"mappings":";;;;;;;;AA6CO,SAASA,WAAWA,CACzBC,aAAiD,EACjDC,YAIa,EACoC;EACjD,OAAOA,YAAY;AACrB;AAEO,SAASC,gBAAgBA,CAG9BC,IAAQ,EAAEC,SAAY,EAAmB;EACzC,OAAOD,IAAI;AACb;AACO,SAASE,eAAeA,CAC7BC,SAA8C,EAC9CC,YAAsC,EACtCJ,IAGa,EAC8B;EAC3C,MAAMK,cAAc,GAClBF,SAAS,CAGTG,QAAQ,EAAED,cAAc;EAE1B,IAAI,CAACA,cAAc,EAAE,OAAO,IAAI;EAEhC,MAAME,OAAO,GAAGH,YAAY,CAACI,WAAW,CAAC,CAAC,CAE7B;EACb,MAAMC,QAAQ,GAAGF,OAAO,EAAEG,IAAI,EAAEC,KAAK;EAErC,MAAMC,MAAM,GAAIH,QAAQ,IAAIJ,cAAc,CAACI,QAAQ,CAAC,IAAK,EAAE;EAC3D,OAAOG,MAAM,CAACC,MAAM,GAAG,CAAC,IAAID,MAAM,CAACE,KAAK,CAAEC,KAAK,IAAKf,IAAI,IAAIe,KAAK,IAAIf,IAAI,CAAC;AAC5E","ignoreList":[]}
|
|
@@ -10,7 +10,6 @@ const documents = {
|
|
|
10
10
|
'\n query GetCurrencyPowerBalance($timeUnit: CurrencyPowerBalanceTimeUnit!) {\n currencyPowerBalance(timeUnit: $timeUnit) {\n currency\n power {\n point\n price\n }\n updatedAt\n }\n }\n': types.GetCurrencyPowerBalanceDocument
|
|
11
11
|
};
|
|
12
12
|
function graphql(source) {
|
|
13
|
-
|
|
14
|
-
return (_source = documents[source]) !== null && _source !== void 0 ? _source : {};
|
|
13
|
+
return documents[source] ?? {};
|
|
15
14
|
}
|
|
16
15
|
//# sourceMappingURL=gql.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"gql.js","names":["types","_interopRequireWildcard","require","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","documents","GetCurrencyPowerBalanceDocument","graphql","source"
|
|
1
|
+
{"version":3,"file":"gql.js","names":["types","_interopRequireWildcard","require","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","documents","GetCurrencyPowerBalanceDocument","graphql","source"],"sources":["../../../../src/gql/types/gql.ts"],"sourcesContent":["/* eslint-disable */\nimport * as types from './graphql';\nimport { TypedDocumentNode as DocumentNode } from '@graphql-typed-document-node/core';\n\n/**\n * Map of all GraphQL operations in the project.\n *\n * This map has several performance disadvantages:\n * 1. It is not tree-shakeable, so it will include all operations in the project.\n * 2. It is not minifiable, so the string of a GraphQL query will be multiple times inside the bundle.\n * 3. It does not support dead code elimination, so it will add unused operations.\n *\n * Therefore it is highly recommended to use the babel or swc plugin for production.\n */\nconst documents = {\n '\\n query GetCurrencyPowerBalance($timeUnit: CurrencyPowerBalanceTimeUnit!) {\\n currencyPowerBalance(timeUnit: $timeUnit) {\\n currency\\n power {\\n point\\n price\\n }\\n updatedAt\\n }\\n }\\n':\n types.GetCurrencyPowerBalanceDocument,\n};\n\n/**\n * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.\n *\n *\n * @example\n * ```ts\n * const query = graphql(`query GetUser($id: ID!) { user(id: $id) { name } }`);\n * ```\n *\n * The query argument is unknown!\n * Please regenerate the types.\n */\nexport function graphql(source: string): unknown;\n\n/**\n * The graphql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.\n */\nexport function graphql(\n source: '\\n query GetCurrencyPowerBalance($timeUnit: CurrencyPowerBalanceTimeUnit!) {\\n currencyPowerBalance(timeUnit: $timeUnit) {\\n currency\\n power {\\n point\\n price\\n }\\n updatedAt\\n }\\n }\\n'\n): (typeof documents)['\\n query GetCurrencyPowerBalance($timeUnit: CurrencyPowerBalanceTimeUnit!) {\\n currencyPowerBalance(timeUnit: $timeUnit) {\\n currency\\n power {\\n point\\n price\\n }\\n updatedAt\\n }\\n }\\n'];\n\nexport function graphql(source: string) {\n return (documents as any)[source] ?? {};\n}\n\nexport type DocumentType<TDocumentNode extends DocumentNode<any, any>> =\n TDocumentNode extends DocumentNode<infer TType, any> ? TType : never;\n"],"mappings":";;;;;;AACA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AAAmC,SAAAD,wBAAAE,CAAA,EAAAC,CAAA,6BAAAC,OAAA,MAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAJ,uBAAA,YAAAA,CAAAE,CAAA,EAAAC,CAAA,SAAAA,CAAA,IAAAD,CAAA,IAAAA,CAAA,CAAAK,UAAA,SAAAL,CAAA,MAAAM,CAAA,EAAAC,CAAA,EAAAC,CAAA,KAAAC,SAAA,QAAAC,OAAA,EAAAV,CAAA,iBAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,SAAAQ,CAAA,MAAAF,CAAA,GAAAL,CAAA,GAAAG,CAAA,GAAAD,CAAA,QAAAG,CAAA,CAAAK,GAAA,CAAAX,CAAA,UAAAM,CAAA,CAAAM,GAAA,CAAAZ,CAAA,GAAAM,CAAA,CAAAO,GAAA,CAAAb,CAAA,EAAAQ,CAAA,gBAAAP,CAAA,IAAAD,CAAA,gBAAAC,CAAA,OAAAa,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAC,CAAA,OAAAM,CAAA,IAAAD,CAAA,GAAAU,MAAA,CAAAC,cAAA,KAAAD,MAAA,CAAAE,wBAAA,CAAAlB,CAAA,EAAAC,CAAA,OAAAM,CAAA,CAAAK,GAAA,IAAAL,CAAA,CAAAM,GAAA,IAAAP,CAAA,CAAAE,CAAA,EAAAP,CAAA,EAAAM,CAAA,IAAAC,CAAA,CAAAP,CAAA,IAAAD,CAAA,CAAAC,CAAA,WAAAO,CAAA,KAAAR,CAAA,EAAAC,CAAA;AAanC,MAAMkB,SAAS,GAAG;EAChB,qOAAqO,EACnOtB,KAAK,CAACuB;AACV,CAAC;AAuBM,SAASC,OAAOA,CAACC,MAAc,EAAE;EACtC,OAAQH,SAAS,CAASG,MAAM,CAAC,IAAI,CAAC,CAAC;AACzC","ignoreList":[]}
|
|
@@ -6,7 +6,6 @@ import { getCurrencyPowerBalance } from '../gql/getCurrencyPowerBalance';
|
|
|
6
6
|
import { Chart } from './components/Chart';
|
|
7
7
|
import { CURRENCY_POWER_BALANCE_TOOLTIP_ID } from './constants';
|
|
8
8
|
const ChartWithData = _ref => {
|
|
9
|
-
var _data$currencyPowerBa, _;
|
|
10
9
|
let {
|
|
11
10
|
timeUnit,
|
|
12
11
|
currencies
|
|
@@ -28,7 +27,7 @@ const ChartWithData = _ref => {
|
|
|
28
27
|
},
|
|
29
28
|
fetchPolicy: 'cache-and-network'
|
|
30
29
|
});
|
|
31
|
-
const showError =
|
|
30
|
+
const showError = data?.currencyPowerBalance?.length === 0 || error || currencies && (currencies.length === 0 || currencies.length === 1);
|
|
32
31
|
return React.createElement(React.Fragment, null, loading && React.createElement("div", {
|
|
33
32
|
className: "lw-mb-[50px] lw-flex lw-h-[375px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary"
|
|
34
33
|
}, React.createElement(Spinner, {
|
|
@@ -36,7 +35,7 @@ const ChartWithData = _ref => {
|
|
|
36
35
|
})), !loading && !showError && React.createElement(Chart, {
|
|
37
36
|
currencies: currencies,
|
|
38
37
|
timeUnit: timeUnit,
|
|
39
|
-
values: data
|
|
38
|
+
values: data?.currencyPowerBalance
|
|
40
39
|
}), !loading && showError && React.createElement("div", {
|
|
41
40
|
className: "lw-flex lw-h-[375px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary"
|
|
42
41
|
}, React.createElement(ChartError, null)), isDesktop && React.createElement(Tooltip, {
|
|
@@ -45,7 +44,7 @@ const ChartWithData = _ref => {
|
|
|
45
44
|
className: "lw-mt-2 lw-h-8"
|
|
46
45
|
}, !loading && !showError && React.createElement(LastUpdated, {
|
|
47
46
|
labelCallback: lang,
|
|
48
|
-
timestamp: data
|
|
47
|
+
timestamp: data?.currencyPowerBalance[0]?.updatedAt
|
|
49
48
|
})));
|
|
50
49
|
};
|
|
51
50
|
export { ChartWithData };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChartWithData.js","names":["useQuery","ChartError","LastUpdated","Size","Spinner","SpinnerSize","Tooltip","useLayoutProvider","useLocale","React","getCurrencyPowerBalance","Chart","CURRENCY_POWER_BALANCE_TOOLTIP_ID","ChartWithData","_ref","
|
|
1
|
+
{"version":3,"file":"ChartWithData.js","names":["useQuery","ChartError","LastUpdated","Size","Spinner","SpinnerSize","Tooltip","useLayoutProvider","useLocale","React","getCurrencyPowerBalance","Chart","CURRENCY_POWER_BALANCE_TOOLTIP_ID","ChartWithData","_ref","timeUnit","currencies","size","isDesktop","DESKTOP","lang","loading","data","error","variables","fetchPolicy","showError","currencyPowerBalance","length","createElement","Fragment","className","lg","values","id","labelCallback","timestamp","updatedAt"],"sources":["../../../src/CurrencyPowerBalanceWidget/ChartWithData.tsx"],"sourcesContent":["import { useQuery } from '@apollo/client';\nimport {\n ChartError,\n LastUpdated,\n Size,\n Spinner,\n SpinnerSize,\n Tooltip,\n useLayoutProvider,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport React from 'react';\n\nimport { getCurrencyPowerBalance } from '../gql/getCurrencyPowerBalance';\nimport type {\n GetCurrencyPowerBalanceQuery,\n GetCurrencyPowerBalanceQueryVariables,\n} from '../gql/types/graphql';\nimport { Chart } from './components/Chart';\nimport { CURRENCY_POWER_BALANCE_TOOLTIP_ID } from './constants';\nimport type { ChartWithDataProps } from './types';\n\nconst ChartWithData = ({ timeUnit, currencies }: ChartWithDataProps) => {\n const { size } = useLayoutProvider();\n const isDesktop = size === Size.DESKTOP;\n const { lang } = useLocale();\n const { loading, data, error } = useQuery<\n GetCurrencyPowerBalanceQuery,\n GetCurrencyPowerBalanceQueryVariables\n >(getCurrencyPowerBalance, {\n variables: {\n timeUnit,\n },\n fetchPolicy: 'cache-and-network',\n });\n\n const showError =\n data?.currencyPowerBalance?.length === 0 ||\n error ||\n (currencies && (currencies.length === 0 || currencies.length === 1));\n\n return (\n <>\n {loading && (\n <div className=\"lw-mb-[50px] lw-flex lw-h-[375px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary\">\n <Spinner size={SpinnerSize.lg} />\n </div>\n )}\n {!loading && !showError && (\n <Chart\n currencies={currencies}\n timeUnit={timeUnit}\n values={data?.currencyPowerBalance!}\n />\n )}\n {!loading && showError && (\n <div className=\"lw-flex lw-h-[375px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary\">\n <ChartError />\n </div>\n )}\n {isDesktop && <Tooltip id={CURRENCY_POWER_BALANCE_TOOLTIP_ID} />}\n <div className=\"lw-mt-2 lw-h-8\">\n {!loading && !showError && (\n <LastUpdated\n labelCallback={lang}\n timestamp={data?.currencyPowerBalance![0]?.updatedAt}\n />\n )}\n </div>\n </>\n );\n};\n\nexport { ChartWithData };\n"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,gBAAgB;AACzC,SACEC,UAAU,EACVC,WAAW,EACXC,IAAI,EACJC,OAAO,EACPC,WAAW,EACXC,OAAO,EACPC,iBAAiB,QACZ,2BAA2B;AAClC,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,OAAOC,KAAK,MAAM,OAAO;AAEzB,SAASC,uBAAuB,QAAQ,gCAAgC;AAKxE,SAASC,KAAK,QAAQ,oBAAoB;AAC1C,SAASC,iCAAiC,QAAQ,aAAa;AAG/D,MAAMC,aAAa,GAAGC,IAAA,IAAkD;EAAA,IAAjD;IAAEC,QAAQ;IAAEC;EAA+B,CAAC,GAAAF,IAAA;EACjE,MAAM;IAAEG;EAAK,CAAC,GAAGV,iBAAiB,CAAC,CAAC;EACpC,MAAMW,SAAS,GAAGD,IAAI,KAAKd,IAAI,CAACgB,OAAO;EACvC,MAAM;IAAEC;EAAK,CAAC,GAAGZ,SAAS,CAAC,CAAC;EAC5B,MAAM;IAAEa,OAAO;IAAEC,IAAI;IAAEC;EAAM,CAAC,GAAGvB,QAAQ,CAGvCU,uBAAuB,EAAE;IACzBc,SAAS,EAAE;MACTT;IACF,CAAC;IACDU,WAAW,EAAE;EACf,CAAC,CAAC;EAEF,MAAMC,SAAS,GACbJ,IAAI,EAAEK,oBAAoB,EAAEC,MAAM,KAAK,CAAC,IACxCL,KAAK,IACJP,UAAU,KAAKA,UAAU,CAACY,MAAM,KAAK,CAAC,IAAIZ,UAAU,CAACY,MAAM,KAAK,CAAC,CAAE;EAEtE,OACEnB,KAAA,CAAAoB,aAAA,CAAApB,KAAA,CAAAqB,QAAA,QACGT,OAAO,IACNZ,KAAA,CAAAoB,aAAA;IAAKE,SAAS,EAAC;EAAgH,GAC7HtB,KAAA,CAAAoB,aAAA,CAACzB,OAAO;IAACa,IAAI,EAAEZ,WAAW,CAAC2B;EAAG,CAAE,CAC7B,CACN,EACA,CAACX,OAAO,IAAI,CAACK,SAAS,IACrBjB,KAAA,CAAAoB,aAAA,CAAClB,KAAK;IACJK,UAAU,EAAEA,UAAW;IACvBD,QAAQ,EAAEA,QAAS;IACnBkB,MAAM,EAAEX,IAAI,EAAEK;EAAsB,CACrC,CACF,EACA,CAACN,OAAO,IAAIK,SAAS,IACpBjB,KAAA,CAAAoB,aAAA;IAAKE,SAAS,EAAC;EAAmG,GAChHtB,KAAA,CAAAoB,aAAA,CAAC5B,UAAU,MAAE,CACV,CACN,EACAiB,SAAS,IAAIT,KAAA,CAAAoB,aAAA,CAACvB,OAAO;IAAC4B,EAAE,EAAEtB;EAAkC,CAAE,CAAC,EAChEH,KAAA,CAAAoB,aAAA;IAAKE,SAAS,EAAC;EAAgB,GAC5B,CAACV,OAAO,IAAI,CAACK,SAAS,IACrBjB,KAAA,CAAAoB,aAAA,CAAC3B,WAAW;IACViC,aAAa,EAAEf,IAAK;IACpBgB,SAAS,EAAEd,IAAI,EAAEK,oBAAoB,CAAE,CAAC,CAAC,EAAEU;EAAU,CACtD,CAEA,CACL,CAAC;AAEP,CAAC;AAED,SAASxB,aAAa","ignoreList":[]}
|
|
@@ -34,9 +34,9 @@ const Main = _ref => {
|
|
|
34
34
|
key: label,
|
|
35
35
|
className: "lw-mb-6 lw-flex lw-justify-center lw-font-sans lw-text-lg lw-font-bold",
|
|
36
36
|
"data-testid": "time-unit-label"
|
|
37
|
-
}, tooltipLabel ? React.createElement("span", null,
|
|
37
|
+
}, tooltipLabel ? React.createElement("span", null, `${lang(tooltipLabel.translationKey, {
|
|
38
38
|
count: tooltipLabel.count
|
|
39
|
-
}))
|
|
39
|
+
})}`) : React.createElement("span", null, `${lang(label)}`));
|
|
40
40
|
})) : React.createElement(TimeUnitSwitch, {
|
|
41
41
|
callback: setSelectedTimeUnit,
|
|
42
42
|
options: timeUnitConfig,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Main.js","names":["TimeUnitSwitch","useLayoutProvider","useLocale","React","useState","CurrencyPowerBalanceTimeUnit","ChartWithData","timeUnitConfig","CURRENCY_POWER_BALANCE_TOOLTIP_ID","Main","_ref","timeUnit","currencies","size","lang","selectedTimeUnit","setSelectedTimeUnit","CurrentDay","createElement","Fragment","className","filter","_ref2","value","map","_ref3","tooltipLabel","label","key","
|
|
1
|
+
{"version":3,"file":"Main.js","names":["TimeUnitSwitch","useLayoutProvider","useLocale","React","useState","CurrencyPowerBalanceTimeUnit","ChartWithData","timeUnitConfig","CURRENCY_POWER_BALANCE_TOOLTIP_ID","Main","_ref","timeUnit","currencies","size","lang","selectedTimeUnit","setSelectedTimeUnit","CurrentDay","createElement","Fragment","className","filter","_ref2","value","map","_ref3","tooltipLabel","label","key","translationKey","count","callback","options","selected","tooltipId"],"sources":["../../../src/CurrencyPowerBalanceWidget/Main.tsx"],"sourcesContent":["import { TimeUnitSwitch, useLayoutProvider } from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport React, { useState } from 'react';\n\nimport { CurrencyPowerBalanceTimeUnit } from '../gql/types/graphql';\nimport { ChartWithData } from './ChartWithData';\nimport { timeUnitConfig } from './config';\nimport { CURRENCY_POWER_BALANCE_TOOLTIP_ID } from './constants';\nimport type { MainProps } from './types';\n\nconst Main = ({ timeUnit, currencies }: MainProps) => {\n const { size } = useLayoutProvider();\n const { lang } = useLocale();\n const [selectedTimeUnit, setSelectedTimeUnit] = useState(\n timeUnit || CurrencyPowerBalanceTimeUnit.CurrentDay\n );\n return (\n <>\n {size && (\n <div\n className=\"lw-flex lw-flex-col lw-text-sm lw-tracking-normal\"\n data-testid=\"currency-power-balance-wrapper\"\n >\n {timeUnit && currencies ? (\n <>\n {timeUnitConfig\n .filter(({ value }) => value === selectedTimeUnit)\n .map(({ tooltipLabel, label }) => (\n <div\n key={label}\n className=\"lw-mb-6 lw-flex lw-justify-center lw-font-sans lw-text-lg lw-font-bold\"\n data-testid=\"time-unit-label\"\n >\n {tooltipLabel ? (\n <span>{`${lang(tooltipLabel!.translationKey, { count: tooltipLabel!.count })}`}</span>\n ) : (\n <span>{`${lang(label)}`}</span>\n )}\n </div>\n ))}\n </>\n ) : (\n <TimeUnitSwitch<CurrencyPowerBalanceTimeUnit>\n callback={setSelectedTimeUnit}\n options={timeUnitConfig}\n selected={selectedTimeUnit}\n tooltipId={CURRENCY_POWER_BALANCE_TOOLTIP_ID}\n />\n )}\n <ChartWithData\n currencies={timeUnit && currencies}\n timeUnit={selectedTimeUnit}\n />\n </div>\n )}\n </>\n );\n};\n\nexport { Main };\n"],"mappings":"AAAA,SAASA,cAAc,EAAEC,iBAAiB,QAAQ,2BAA2B;AAC7E,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,OAAOC,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AAEvC,SAASC,4BAA4B,QAAQ,sBAAsB;AACnE,SAASC,aAAa,QAAQ,iBAAiB;AAC/C,SAASC,cAAc,QAAQ,UAAU;AACzC,SAASC,iCAAiC,QAAQ,aAAa;AAG/D,MAAMC,IAAI,GAAGC,IAAA,IAAyC;EAAA,IAAxC;IAAEC,QAAQ;IAAEC;EAAsB,CAAC,GAAAF,IAAA;EAC/C,MAAM;IAAEG;EAAK,CAAC,GAAGZ,iBAAiB,CAAC,CAAC;EACpC,MAAM;IAAEa;EAAK,CAAC,GAAGZ,SAAS,CAAC,CAAC;EAC5B,MAAM,CAACa,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGZ,QAAQ,CACtDO,QAAQ,IAAIN,4BAA4B,CAACY,UAC3C,CAAC;EACD,OACEd,KAAA,CAAAe,aAAA,CAAAf,KAAA,CAAAgB,QAAA,QACGN,IAAI,IACHV,KAAA,CAAAe,aAAA;IACEE,SAAS,EAAC,mDAAmD;IAC7D,eAAY;EAAgC,GAE3CT,QAAQ,IAAIC,UAAU,GACrBT,KAAA,CAAAe,aAAA,CAAAf,KAAA,CAAAgB,QAAA,QACGZ,cAAc,CACZc,MAAM,CAACC,KAAA;IAAA,IAAC;MAAEC;IAAM,CAAC,GAAAD,KAAA;IAAA,OAAKC,KAAK,KAAKR,gBAAgB;EAAA,EAAC,CACjDS,GAAG,CAACC,KAAA;IAAA,IAAC;MAAEC,YAAY;MAAEC;IAAM,CAAC,GAAAF,KAAA;IAAA,OAC3BtB,KAAA,CAAAe,aAAA;MACEU,GAAG,EAAED,KAAM;MACXP,SAAS,EAAC,wEAAwE;MAClF,eAAY;IAAiB,GAE5BM,YAAY,GACXvB,KAAA,CAAAe,aAAA,eAAO,GAAGJ,IAAI,CAACY,YAAY,CAAEG,cAAc,EAAE;MAAEC,KAAK,EAAEJ,YAAY,CAAEI;IAAM,CAAC,CAAC,EAAS,CAAC,GAEtF3B,KAAA,CAAAe,aAAA,eAAO,GAAGJ,IAAI,CAACa,KAAK,CAAC,EAAS,CAE7B,CAAC;EAAA,CACP,CACH,CAAC,GAEHxB,KAAA,CAAAe,aAAA,CAAClB,cAAc;IACb+B,QAAQ,EAAEf,mBAAoB;IAC9BgB,OAAO,EAAEzB,cAAe;IACxB0B,QAAQ,EAAElB,gBAAiB;IAC3BmB,SAAS,EAAE1B;EAAkC,CAC9C,CACF,EACDL,KAAA,CAAAe,aAAA,CAACZ,aAAa;IACZM,UAAU,EAAED,QAAQ,IAAIC,UAAW;IACnCD,QAAQ,EAAEI;EAAiB,CAC5B,CACE,CAEP,CAAC;AAEP,CAAC;AAED,SAASN,IAAI","ignoreList":[]}
|
|
@@ -27,9 +27,18 @@ const tooltipFormatter = values => {
|
|
|
27
27
|
seriesName,
|
|
28
28
|
value
|
|
29
29
|
} = _ref3;
|
|
30
|
-
return
|
|
30
|
+
return `<div style="display:flex;align-items:center;">
|
|
31
|
+
<div style="display:flex;align-items:center;width:50px;margin-right:10px;">
|
|
32
|
+
${marker}
|
|
33
|
+
<span>${seriesName}</span>
|
|
34
|
+
</div>
|
|
35
|
+
<span>${value[1]}</span>
|
|
36
|
+
</div>`;
|
|
31
37
|
});
|
|
32
|
-
return
|
|
38
|
+
return `<div style="display:flex; flex-direction:column;">
|
|
39
|
+
<span style="margin-bottom:5px;">${date}</span>
|
|
40
|
+
${row.join('\n')}
|
|
41
|
+
</div>`;
|
|
33
42
|
};
|
|
34
43
|
const formatLegendData = values => {
|
|
35
44
|
const dataCurrencies = values.map(_ref4 => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"formatters.js","names":["chartDateFormat","chartDateTimeFormat","getChartDateAndTime","CurrencyPowerBalanceTimeUnit","COLOR_CONFIG","CURRENCIES_ORDER","VERTICAL_LINE_COUNT","isMonthWeek","timeUnit","M3","M1","W1","xAxisLabelFormatter","label","date","time","isDateFormat","intervalFormatter","dataLength","Math","round","tooltipFormatter","values","value","row","sort","_ref","_ref2","valueA","valueB","Number","map","_ref3","marker","seriesName","
|
|
1
|
+
{"version":3,"file":"formatters.js","names":["chartDateFormat","chartDateTimeFormat","getChartDateAndTime","CurrencyPowerBalanceTimeUnit","COLOR_CONFIG","CURRENCIES_ORDER","VERTICAL_LINE_COUNT","isMonthWeek","timeUnit","M3","M1","W1","xAxisLabelFormatter","label","date","time","isDateFormat","intervalFormatter","dataLength","Math","round","tooltipFormatter","values","value","row","sort","_ref","_ref2","valueA","valueB","Number","map","_ref3","marker","seriesName","join","formatLegendData","dataCurrencies","_ref4","currency","list","length","filter","includes","name","itemStyle","color"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/formatters.ts"],"sourcesContent":["import {\n chartDateFormat,\n chartDateTimeFormat,\n getChartDateAndTime,\n} from '@oanda/labs-widget-common';\n\nimport type { CurrencyPowerBalance } from '../../../../gql/types/graphql';\nimport { CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';\nimport {\n COLOR_CONFIG,\n CURRENCIES_ORDER,\n VERTICAL_LINE_COUNT,\n} from './constants';\nimport type { TooltipFormatterParams } from './types';\n\nconst isMonthWeek = (timeUnit: CurrencyPowerBalanceTimeUnit) =>\n timeUnit === CurrencyPowerBalanceTimeUnit.M3 ||\n timeUnit === CurrencyPowerBalanceTimeUnit.M1 ||\n timeUnit === CurrencyPowerBalanceTimeUnit.W1;\n\nconst xAxisLabelFormatter = (\n label: string,\n timeUnit: CurrencyPowerBalanceTimeUnit\n) => {\n const { date, time } = getChartDateAndTime(label);\n const isDateFormat = isMonthWeek(timeUnit) || time === '00:00';\n\n return isDateFormat ? chartDateFormat(date) : time;\n};\n\nconst intervalFormatter = (dataLength: number) =>\n Math.round(dataLength / VERTICAL_LINE_COUNT);\n\nconst tooltipFormatter = (values: TooltipFormatterParams[]) => {\n const date = chartDateTimeFormat(getChartDateAndTime(values[0].value[0]));\n\n const row = values\n .sort(\n ({ value: valueA }, { value: valueB }) =>\n Number(valueB[1]) - Number(valueA[1])\n )\n .map(\n ({\n marker,\n seriesName,\n value,\n }) => `<div style=\"display:flex;align-items:center;\">\n <div style=\"display:flex;align-items:center;width:50px;margin-right:10px;\">\n ${marker}\n <span>${seriesName}</span>\n </div>\n <span>${value[1]}</span>\n </div>`\n );\n\n return `<div style=\"display:flex; flex-direction:column;\">\n <span style=\"margin-bottom:5px;\">${date}</span>\n ${row.join('\\n')}\n </div>`;\n};\n\nconst formatLegendData = (values: CurrencyPowerBalance[]) => {\n const dataCurrencies = values.map(({ currency }) => currency);\n\n const list =\n dataCurrencies.length === CURRENCIES_ORDER.length\n ? CURRENCIES_ORDER\n : CURRENCIES_ORDER.filter((currency) =>\n dataCurrencies.includes(currency)\n );\n\n return list.map((currency) => ({\n name: currency,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\n }));\n};\n\nexport {\n formatLegendData,\n intervalFormatter,\n isMonthWeek,\n tooltipFormatter,\n xAxisLabelFormatter,\n};\n"],"mappings":"AAAA,SACEA,eAAe,EACfC,mBAAmB,EACnBC,mBAAmB,QACd,2BAA2B;AAGlC,SAASC,4BAA4B,QAAQ,+BAA+B;AAC5E,SACEC,YAAY,EACZC,gBAAgB,EAChBC,mBAAmB,QACd,aAAa;AAGpB,MAAMC,WAAW,GAAIC,QAAsC,IACzDA,QAAQ,KAAKL,4BAA4B,CAACM,EAAE,IAC5CD,QAAQ,KAAKL,4BAA4B,CAACO,EAAE,IAC5CF,QAAQ,KAAKL,4BAA4B,CAACQ,EAAE;AAE9C,MAAMC,mBAAmB,GAAGA,CAC1BC,KAAa,EACbL,QAAsC,KACnC;EACH,MAAM;IAAEM,IAAI;IAAEC;EAAK,CAAC,GAAGb,mBAAmB,CAACW,KAAK,CAAC;EACjD,MAAMG,YAAY,GAAGT,WAAW,CAACC,QAAQ,CAAC,IAAIO,IAAI,KAAK,OAAO;EAE9D,OAAOC,YAAY,GAAGhB,eAAe,CAACc,IAAI,CAAC,GAAGC,IAAI;AACpD,CAAC;AAED,MAAME,iBAAiB,GAAIC,UAAkB,IAC3CC,IAAI,CAACC,KAAK,CAACF,UAAU,GAAGZ,mBAAmB,CAAC;AAE9C,MAAMe,gBAAgB,GAAIC,MAAgC,IAAK;EAC7D,MAAMR,IAAI,GAAGb,mBAAmB,CAACC,mBAAmB,CAACoB,MAAM,CAAC,CAAC,CAAC,CAACC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;EAEzE,MAAMC,GAAG,GAAGF,MAAM,CACfG,IAAI,CACH,CAAAC,IAAA,EAAAC,KAAA;IAAA,IAAC;MAAEJ,KAAK,EAAEK;IAAO,CAAC,GAAAF,IAAA;IAAA,IAAE;MAAEH,KAAK,EAAEM;IAAO,CAAC,GAAAF,KAAA;IAAA,OACnCG,MAAM,CAACD,MAAM,CAAC,CAAC,CAAC,CAAC,GAAGC,MAAM,CAACF,MAAM,CAAC,CAAC,CAAC,CAAC;EAAA,CACzC,CAAC,CACAG,GAAG,CACFC,KAAA;IAAA,IAAC;MACCC,MAAM;MACNC,UAAU;MACVX;IACF,CAAC,GAAAS,KAAA;IAAA,OAAK;AACZ;AACA,UAAUC,MAAM;AAChB,gBAAgBC,UAAU;AAC1B;AACA,cAAcX,KAAK,CAAC,CAAC,CAAC;AACtB,WAAW;EAAA,CACP,CAAC;EAEH,OAAO;AACT,uCAAuCT,IAAI;AAC3C,MAAMU,GAAG,CAACW,IAAI,CAAC,IAAI,CAAC;AACpB,SAAS;AACT,CAAC;AAED,MAAMC,gBAAgB,GAAId,MAA8B,IAAK;EAC3D,MAAMe,cAAc,GAAGf,MAAM,CAACS,GAAG,CAACO,KAAA;IAAA,IAAC;MAAEC;IAAS,CAAC,GAAAD,KAAA;IAAA,OAAKC,QAAQ;EAAA,EAAC;EAE7D,MAAMC,IAAI,GACRH,cAAc,CAACI,MAAM,KAAKpC,gBAAgB,CAACoC,MAAM,GAC7CpC,gBAAgB,GAChBA,gBAAgB,CAACqC,MAAM,CAAEH,QAAQ,IAC/BF,cAAc,CAACM,QAAQ,CAACJ,QAAQ,CAClC,CAAC;EAEP,OAAOC,IAAI,CAACT,GAAG,CAAEQ,QAAQ,KAAM;IAC7BK,IAAI,EAAEL,QAAQ;IACdM,SAAS,EAAE;MACTC,KAAK,EAAE1C,YAAY,CAACmC,QAAQ;IAC9B;EACF,CAAC,CAAC,CAAC;AACL,CAAC;AAED,SACEH,gBAAgB,EAChBnB,iBAAiB,EACjBV,WAAW,EACXc,gBAAgB,EAChBT,mBAAmB","ignoreList":[]}
|
|
@@ -141,8 +141,8 @@ const getOption = (chartData, timeUnit, isDark, isDesktop, isMobile, lang) => {
|
|
|
141
141
|
name: 'main-grid',
|
|
142
142
|
top: '0px',
|
|
143
143
|
left: '0px',
|
|
144
|
-
right:
|
|
145
|
-
bottom:
|
|
144
|
+
right: `${isMobile ? Y_LABEL_SIZE_MOBILE : Y_LABEL_SIZE}px`,
|
|
145
|
+
bottom: `${isMobile ? X_LABEL_SIZE_MOBILE : X_LABEL_SIZE}px`
|
|
146
146
|
}],
|
|
147
147
|
graphic: [...baseGridLines]
|
|
148
148
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"getOption.js","names":["getGridLines","Theme","themeColors","CurrencyPowerBalanceTimeUnit","CHART_HEIGHT","CHART_WIDTH","COLOR_CONFIG","LEGEND_HEIGHT","LEGEND_HEIGHT_MOBILE","TOOLTIP_LINE_COLOR_CONFIG","X_LABEL_SIZE","X_LABEL_SIZE_MOBILE","Y_LABEL_SIZE","Y_LABEL_SIZE_MOBILE","formatLegendData","intervalFormatter","tooltipFormatter","xAxisLabelFormatter","findLastIndexesBeforeWeekend","getOption","chartData","timeUnit","isDark","isDesktop","isMobile","lang","currentTheme","Dark","Light","dataTimestamps","power","map","x","Date","point","getTime","weekendsIndexes","disableWeekendsIndicator","CurrentDay","PreviousDay","M3","includes","length","weekendsMarks","item","xAxis","label","formatter","seriesData","_ref","index","currency","name","type","symbol","showSymbol","itemStyle","color","data","_ref2","price","markLine","show","position","align","distance","padding","fontSize","shadowBlur","shadowOffsetX","shadowOffsetY","borderWidth","textPrimary","shadowColor","borderRadius","backgroundColor","borderPrimary","bgSecondary","emphasis","lineStyle","width","opacity","undefined","legendData","baseGridLines","chartWidth","chartHeight","xLabelsSize","yLabelSize","bottomLeftBox","marginBottom","animation","legend","bottom","icon","tooltip","trigger","axisPointer","axis","z","DARK","LIGHT","extraCssText","axisTick","axisLine","splitLine","axisLabel","margin","rotate","interval","yAxis","splitNumber","boundaryGap","showMaxLabel","showMinLabel","series","grid","top","left","right","concat","graphic"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/getOption.ts"],"sourcesContent":["import { getGridLines, Theme, themeColors } from '@oanda/labs-widget-common';\n\nimport type { CurrencyPowerBalance } from '../../../../gql/types/graphql';\nimport { CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';\nimport {\n CHART_HEIGHT,\n CHART_WIDTH,\n COLOR_CONFIG,\n LEGEND_HEIGHT,\n LEGEND_HEIGHT_MOBILE,\n TOOLTIP_LINE_COLOR_CONFIG,\n X_LABEL_SIZE,\n X_LABEL_SIZE_MOBILE,\n Y_LABEL_SIZE,\n Y_LABEL_SIZE_MOBILE,\n} from './constants';\nimport {\n formatLegendData,\n intervalFormatter,\n tooltipFormatter,\n xAxisLabelFormatter,\n} from './formatters';\nimport { findLastIndexesBeforeWeekend } from './utils';\n\nconst getOption = (\n chartData: CurrencyPowerBalance[],\n timeUnit: CurrencyPowerBalanceTimeUnit,\n isDark: boolean,\n isDesktop: boolean,\n isMobile: boolean,\n lang: (key: string) => string\n) => {\n const currentTheme = isDark ? Theme.Dark : Theme.Light;\n const dataTimestamps = chartData[0].power.map((x) =>\n new Date(x.point).getTime()\n );\n const weekendsIndexes = findLastIndexesBeforeWeekend(dataTimestamps);\n const disableWeekendsIndicator =\n [\n CurrencyPowerBalanceTimeUnit.CurrentDay,\n CurrencyPowerBalanceTimeUnit.PreviousDay,\n CurrencyPowerBalanceTimeUnit.M3,\n ].includes(timeUnit) || weekendsIndexes.length === 0;\n\n const weekendsMarks = weekendsIndexes.map((item) => ({\n xAxis: item,\n label: {\n formatter: () => lang('market_closed'),\n },\n }));\n\n const seriesData = chartData.map(({ currency, power }, index) => ({\n name: currency,\n type: 'line',\n symbol: 'circle',\n showSymbol: false,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\n data: power.map(({ point, price }) => [point, price]),\n markLine:\n index === chartData.length - 1 && !disableWeekendsIndicator\n ? {\n label: {\n show: false,\n position: 'end',\n align: 'center',\n distance: -32,\n padding: [8, 8],\n fontSize: 12,\n shadowBlur: 24,\n shadowOffsetX: 0,\n shadowOffsetY: 6,\n borderWidth: 0,\n color: themeColors.textPrimary,\n shadowColor: 'rgba(0,0,0,0.1)',\n borderRadius: 4,\n backgroundColor: isDark\n ? themeColors.borderPrimary[currentTheme]\n : themeColors.bgSecondary[currentTheme],\n },\n show: false,\n emphasis: {\n label: {\n show: true,\n },\n lineStyle: {\n width: 1,\n opacity: 0,\n color: themeColors.borderPrimary[currentTheme],\n },\n },\n symbol: ['none', 'none'],\n itemStyle: {\n color: themeColors.borderPrimary[currentTheme],\n },\n data: weekendsMarks,\n }\n : undefined,\n }));\n\n const legendData = formatLegendData(chartData);\n\n const baseGridLines = getGridLines({\n isDark,\n chartWidth: CHART_WIDTH,\n chartHeight: CHART_HEIGHT,\n xLabelsSize: isMobile ? X_LABEL_SIZE_MOBILE : X_LABEL_SIZE,\n yLabelSize: isMobile ? Y_LABEL_SIZE_MOBILE : Y_LABEL_SIZE,\n bottomLeftBox: false,\n marginBottom: isMobile ? LEGEND_HEIGHT_MOBILE : LEGEND_HEIGHT,\n });\n\n return {\n animation: false,\n legend: {\n data: legendData,\n bottom: 10,\n icon: 'circle',\n },\n tooltip: {\n trigger: 'axis',\n axisPointer: {\n axis: 'x',\n z: 0,\n lineStyle: {\n color: isDark\n ? TOOLTIP_LINE_COLOR_CONFIG.DARK\n : TOOLTIP_LINE_COLOR_CONFIG.LIGHT,\n },\n },\n formatter: tooltipFormatter,\n extraCssText: 'z-index: 1',\n },\n xAxis: {\n type: 'category',\n axisTick: {\n show: false,\n },\n axisLine: { show: false },\n splitLine: {\n show: true,\n },\n axisLabel: {\n padding: [0, 0, 0, 4],\n align: 'left',\n margin: 10,\n rotate: -45,\n interval: intervalFormatter(seriesData[0].data.length),\n formatter: (label: string) => xAxisLabelFormatter(label, timeUnit),\n },\n },\n yAxis: {\n type: 'value',\n position: 'right',\n splitNumber: 5,\n axisLine: { show: false },\n axisTick: { show: false },\n boundaryGap: ['10%', '10%'],\n axisLabel: {\n showMaxLabel: false,\n showMinLabel: false,\n margin: isDesktop ? 8 : 6,\n },\n },\n series: seriesData,\n grid: [\n {\n name: 'main-grid',\n top: '0px',\n left: '0px',\n right: `${isMobile ? Y_LABEL_SIZE_MOBILE : Y_LABEL_SIZE}px`,\n bottom: `${isMobile ? X_LABEL_SIZE_MOBILE : X_LABEL_SIZE}px`,\n },\n ],\n graphic: [...baseGridLines],\n };\n};\n\nexport { getOption };\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"getOption.js","names":["getGridLines","Theme","themeColors","CurrencyPowerBalanceTimeUnit","CHART_HEIGHT","CHART_WIDTH","COLOR_CONFIG","LEGEND_HEIGHT","LEGEND_HEIGHT_MOBILE","TOOLTIP_LINE_COLOR_CONFIG","X_LABEL_SIZE","X_LABEL_SIZE_MOBILE","Y_LABEL_SIZE","Y_LABEL_SIZE_MOBILE","formatLegendData","intervalFormatter","tooltipFormatter","xAxisLabelFormatter","findLastIndexesBeforeWeekend","getOption","chartData","timeUnit","isDark","isDesktop","isMobile","lang","currentTheme","Dark","Light","dataTimestamps","power","map","x","Date","point","getTime","weekendsIndexes","disableWeekendsIndicator","CurrentDay","PreviousDay","M3","includes","length","weekendsMarks","item","xAxis","label","formatter","seriesData","_ref","index","currency","name","type","symbol","showSymbol","itemStyle","color","data","_ref2","price","markLine","show","position","align","distance","padding","fontSize","shadowBlur","shadowOffsetX","shadowOffsetY","borderWidth","textPrimary","shadowColor","borderRadius","backgroundColor","borderPrimary","bgSecondary","emphasis","lineStyle","width","opacity","undefined","legendData","baseGridLines","chartWidth","chartHeight","xLabelsSize","yLabelSize","bottomLeftBox","marginBottom","animation","legend","bottom","icon","tooltip","trigger","axisPointer","axis","z","DARK","LIGHT","extraCssText","axisTick","axisLine","splitLine","axisLabel","margin","rotate","interval","yAxis","splitNumber","boundaryGap","showMaxLabel","showMinLabel","series","grid","top","left","right","graphic"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/getOption.ts"],"sourcesContent":["import { getGridLines, Theme, themeColors } from '@oanda/labs-widget-common';\n\nimport type { CurrencyPowerBalance } from '../../../../gql/types/graphql';\nimport { CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';\nimport {\n CHART_HEIGHT,\n CHART_WIDTH,\n COLOR_CONFIG,\n LEGEND_HEIGHT,\n LEGEND_HEIGHT_MOBILE,\n TOOLTIP_LINE_COLOR_CONFIG,\n X_LABEL_SIZE,\n X_LABEL_SIZE_MOBILE,\n Y_LABEL_SIZE,\n Y_LABEL_SIZE_MOBILE,\n} from './constants';\nimport {\n formatLegendData,\n intervalFormatter,\n tooltipFormatter,\n xAxisLabelFormatter,\n} from './formatters';\nimport { findLastIndexesBeforeWeekend } from './utils';\n\nconst getOption = (\n chartData: CurrencyPowerBalance[],\n timeUnit: CurrencyPowerBalanceTimeUnit,\n isDark: boolean,\n isDesktop: boolean,\n isMobile: boolean,\n lang: (key: string) => string\n) => {\n const currentTheme = isDark ? Theme.Dark : Theme.Light;\n const dataTimestamps = chartData[0].power.map((x) =>\n new Date(x.point).getTime()\n );\n const weekendsIndexes = findLastIndexesBeforeWeekend(dataTimestamps);\n const disableWeekendsIndicator =\n [\n CurrencyPowerBalanceTimeUnit.CurrentDay,\n CurrencyPowerBalanceTimeUnit.PreviousDay,\n CurrencyPowerBalanceTimeUnit.M3,\n ].includes(timeUnit) || weekendsIndexes.length === 0;\n\n const weekendsMarks = weekendsIndexes.map((item) => ({\n xAxis: item,\n label: {\n formatter: () => lang('market_closed'),\n },\n }));\n\n const seriesData = chartData.map(({ currency, power }, index) => ({\n name: currency,\n type: 'line',\n symbol: 'circle',\n showSymbol: false,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\n data: power.map(({ point, price }) => [point, price]),\n markLine:\n index === chartData.length - 1 && !disableWeekendsIndicator\n ? {\n label: {\n show: false,\n position: 'end',\n align: 'center',\n distance: -32,\n padding: [8, 8],\n fontSize: 12,\n shadowBlur: 24,\n shadowOffsetX: 0,\n shadowOffsetY: 6,\n borderWidth: 0,\n color: themeColors.textPrimary,\n shadowColor: 'rgba(0,0,0,0.1)',\n borderRadius: 4,\n backgroundColor: isDark\n ? themeColors.borderPrimary[currentTheme]\n : themeColors.bgSecondary[currentTheme],\n },\n show: false,\n emphasis: {\n label: {\n show: true,\n },\n lineStyle: {\n width: 1,\n opacity: 0,\n color: themeColors.borderPrimary[currentTheme],\n },\n },\n symbol: ['none', 'none'],\n itemStyle: {\n color: themeColors.borderPrimary[currentTheme],\n },\n data: weekendsMarks,\n }\n : undefined,\n }));\n\n const legendData = formatLegendData(chartData);\n\n const baseGridLines = getGridLines({\n isDark,\n chartWidth: CHART_WIDTH,\n chartHeight: CHART_HEIGHT,\n xLabelsSize: isMobile ? X_LABEL_SIZE_MOBILE : X_LABEL_SIZE,\n yLabelSize: isMobile ? Y_LABEL_SIZE_MOBILE : Y_LABEL_SIZE,\n bottomLeftBox: false,\n marginBottom: isMobile ? LEGEND_HEIGHT_MOBILE : LEGEND_HEIGHT,\n });\n\n return {\n animation: false,\n legend: {\n data: legendData,\n bottom: 10,\n icon: 'circle',\n },\n tooltip: {\n trigger: 'axis',\n axisPointer: {\n axis: 'x',\n z: 0,\n lineStyle: {\n color: isDark\n ? TOOLTIP_LINE_COLOR_CONFIG.DARK\n : TOOLTIP_LINE_COLOR_CONFIG.LIGHT,\n },\n },\n formatter: tooltipFormatter,\n extraCssText: 'z-index: 1',\n },\n xAxis: {\n type: 'category',\n axisTick: {\n show: false,\n },\n axisLine: { show: false },\n splitLine: {\n show: true,\n },\n axisLabel: {\n padding: [0, 0, 0, 4],\n align: 'left',\n margin: 10,\n rotate: -45,\n interval: intervalFormatter(seriesData[0].data.length),\n formatter: (label: string) => xAxisLabelFormatter(label, timeUnit),\n },\n },\n yAxis: {\n type: 'value',\n position: 'right',\n splitNumber: 5,\n axisLine: { show: false },\n axisTick: { show: false },\n boundaryGap: ['10%', '10%'],\n axisLabel: {\n showMaxLabel: false,\n showMinLabel: false,\n margin: isDesktop ? 8 : 6,\n },\n },\n series: seriesData,\n grid: [\n {\n name: 'main-grid',\n top: '0px',\n left: '0px',\n right: `${isMobile ? Y_LABEL_SIZE_MOBILE : Y_LABEL_SIZE}px`,\n bottom: `${isMobile ? X_LABEL_SIZE_MOBILE : X_LABEL_SIZE}px`,\n },\n ],\n graphic: [...baseGridLines],\n };\n};\n\nexport { getOption };\n"],"mappings":"AAAA,SAASA,YAAY,EAAEC,KAAK,EAAEC,WAAW,QAAQ,2BAA2B;AAG5E,SAASC,4BAA4B,QAAQ,+BAA+B;AAC5E,SACEC,YAAY,EACZC,WAAW,EACXC,YAAY,EACZC,aAAa,EACbC,oBAAoB,EACpBC,yBAAyB,EACzBC,YAAY,EACZC,mBAAmB,EACnBC,YAAY,EACZC,mBAAmB,QACd,aAAa;AACpB,SACEC,gBAAgB,EAChBC,iBAAiB,EACjBC,gBAAgB,EAChBC,mBAAmB,QACd,cAAc;AACrB,SAASC,4BAA4B,QAAQ,SAAS;AAEtD,MAAMC,SAAS,GAAGA,CAChBC,SAAiC,EACjCC,QAAsC,EACtCC,MAAe,EACfC,SAAkB,EAClBC,QAAiB,EACjBC,IAA6B,KAC1B;EACH,MAAMC,YAAY,GAAGJ,MAAM,GAAGrB,KAAK,CAAC0B,IAAI,GAAG1B,KAAK,CAAC2B,KAAK;EACtD,MAAMC,cAAc,GAAGT,SAAS,CAAC,CAAC,CAAC,CAACU,KAAK,CAACC,GAAG,CAAEC,CAAC,IAC9C,IAAIC,IAAI,CAACD,CAAC,CAACE,KAAK,CAAC,CAACC,OAAO,CAAC,CAC5B,CAAC;EACD,MAAMC,eAAe,GAAGlB,4BAA4B,CAACW,cAAc,CAAC;EACpE,MAAMQ,wBAAwB,GAC5B,CACElC,4BAA4B,CAACmC,UAAU,EACvCnC,4BAA4B,CAACoC,WAAW,EACxCpC,4BAA4B,CAACqC,EAAE,CAChC,CAACC,QAAQ,CAACpB,QAAQ,CAAC,IAAIe,eAAe,CAACM,MAAM,KAAK,CAAC;EAEtD,MAAMC,aAAa,GAAGP,eAAe,CAACL,GAAG,CAAEa,IAAI,KAAM;IACnDC,KAAK,EAAED,IAAI;IACXE,KAAK,EAAE;MACLC,SAAS,EAAEA,CAAA,KAAMtB,IAAI,CAAC,eAAe;IACvC;EACF,CAAC,CAAC,CAAC;EAEH,MAAMuB,UAAU,GAAG5B,SAAS,CAACW,GAAG,CAAC,CAAAkB,IAAA,EAAsBC,KAAK;IAAA,IAA1B;MAAEC,QAAQ;MAAErB;IAAM,CAAC,GAAAmB,IAAA;IAAA,OAAa;MAChEG,IAAI,EAAED,QAAQ;MACdE,IAAI,EAAE,MAAM;MACZC,MAAM,EAAE,QAAQ;MAChBC,UAAU,EAAE,KAAK;MACjBC,SAAS,EAAE;QACTC,KAAK,EAAEnD,YAAY,CAAC6C,QAAQ;MAC9B,CAAC;MACDO,IAAI,EAAE5B,KAAK,CAACC,GAAG,CAAC4B,KAAA;QAAA,IAAC;UAAEzB,KAAK;UAAE0B;QAAM,CAAC,GAAAD,KAAA;QAAA,OAAK,CAACzB,KAAK,EAAE0B,KAAK,CAAC;MAAA,EAAC;MACrDC,QAAQ,EACNX,KAAK,KAAK9B,SAAS,CAACsB,MAAM,GAAG,CAAC,IAAI,CAACL,wBAAwB,GACvD;QACES,KAAK,EAAE;UACLgB,IAAI,EAAE,KAAK;UACXC,QAAQ,EAAE,KAAK;UACfC,KAAK,EAAE,QAAQ;UACfC,QAAQ,EAAE,CAAC,EAAE;UACbC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC;UACfC,QAAQ,EAAE,EAAE;UACZC,UAAU,EAAE,EAAE;UACdC,aAAa,EAAE,CAAC;UAChBC,aAAa,EAAE,CAAC;UAChBC,WAAW,EAAE,CAAC;UACdd,KAAK,EAAEvD,WAAW,CAACsE,WAAW;UAC9BC,WAAW,EAAE,iBAAiB;UAC9BC,YAAY,EAAE,CAAC;UACfC,eAAe,EAAErD,MAAM,GACnBpB,WAAW,CAAC0E,aAAa,CAAClD,YAAY,CAAC,GACvCxB,WAAW,CAAC2E,WAAW,CAACnD,YAAY;QAC1C,CAAC;QACDoC,IAAI,EAAE,KAAK;QACXgB,QAAQ,EAAE;UACRhC,KAAK,EAAE;YACLgB,IAAI,EAAE;UACR,CAAC;UACDiB,SAAS,EAAE;YACTC,KAAK,EAAE,CAAC;YACRC,OAAO,EAAE,CAAC;YACVxB,KAAK,EAAEvD,WAAW,CAAC0E,aAAa,CAAClD,YAAY;UAC/C;QACF,CAAC;QACD4B,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;QACxBE,SAAS,EAAE;UACTC,KAAK,EAAEvD,WAAW,CAAC0E,aAAa,CAAClD,YAAY;QAC/C,CAAC;QACDgC,IAAI,EAAEf;MACR,CAAC,GACDuC;IACR,CAAC;EAAA,CAAC,CAAC;EAEH,MAAMC,UAAU,GAAGrE,gBAAgB,CAACM,SAAS,CAAC;EAE9C,MAAMgE,aAAa,GAAGpF,YAAY,CAAC;IACjCsB,MAAM;IACN+D,UAAU,EAAEhF,WAAW;IACvBiF,WAAW,EAAElF,YAAY;IACzBmF,WAAW,EAAE/D,QAAQ,GAAGb,mBAAmB,GAAGD,YAAY;IAC1D8E,UAAU,EAAEhE,QAAQ,GAAGX,mBAAmB,GAAGD,YAAY;IACzD6E,aAAa,EAAE,KAAK;IACpBC,YAAY,EAAElE,QAAQ,GAAGhB,oBAAoB,GAAGD;EAClD,CAAC,CAAC;EAEF,OAAO;IACLoF,SAAS,EAAE,KAAK;IAChBC,MAAM,EAAE;MACNlC,IAAI,EAAEyB,UAAU;MAChBU,MAAM,EAAE,EAAE;MACVC,IAAI,EAAE;IACR,CAAC;IACDC,OAAO,EAAE;MACPC,OAAO,EAAE,MAAM;MACfC,WAAW,EAAE;QACXC,IAAI,EAAE,GAAG;QACTC,CAAC,EAAE,CAAC;QACJpB,SAAS,EAAE;UACTtB,KAAK,EAAEnC,MAAM,GACTb,yBAAyB,CAAC2F,IAAI,GAC9B3F,yBAAyB,CAAC4F;QAChC;MACF,CAAC;MACDtD,SAAS,EAAE/B,gBAAgB;MAC3BsF,YAAY,EAAE;IAChB,CAAC;IACDzD,KAAK,EAAE;MACLQ,IAAI,EAAE,UAAU;MAChBkD,QAAQ,EAAE;QACRzC,IAAI,EAAE;MACR,CAAC;MACD0C,QAAQ,EAAE;QAAE1C,IAAI,EAAE;MAAM,CAAC;MACzB2C,SAAS,EAAE;QACT3C,IAAI,EAAE;MACR,CAAC;MACD4C,SAAS,EAAE;QACTxC,OAAO,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC;QACrBF,KAAK,EAAE,MAAM;QACb2C,MAAM,EAAE,EAAE;QACVC,MAAM,EAAE,CAAC,EAAE;QACXC,QAAQ,EAAE9F,iBAAiB,CAACiC,UAAU,CAAC,CAAC,CAAC,CAACU,IAAI,CAAChB,MAAM,CAAC;QACtDK,SAAS,EAAGD,KAAa,IAAK7B,mBAAmB,CAAC6B,KAAK,EAAEzB,QAAQ;MACnE;IACF,CAAC;IACDyF,KAAK,EAAE;MACLzD,IAAI,EAAE,OAAO;MACbU,QAAQ,EAAE,OAAO;MACjBgD,WAAW,EAAE,CAAC;MACdP,QAAQ,EAAE;QAAE1C,IAAI,EAAE;MAAM,CAAC;MACzByC,QAAQ,EAAE;QAAEzC,IAAI,EAAE;MAAM,CAAC;MACzBkD,WAAW,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC;MAC3BN,SAAS,EAAE;QACTO,YAAY,EAAE,KAAK;QACnBC,YAAY,EAAE,KAAK;QACnBP,MAAM,EAAEpF,SAAS,GAAG,CAAC,GAAG;MAC1B;IACF,CAAC;IACD4F,MAAM,EAAEnE,UAAU;IAClBoE,IAAI,EAAE,CACJ;MACEhE,IAAI,EAAE,WAAW;MACjBiE,GAAG,EAAE,KAAK;MACVC,IAAI,EAAE,KAAK;MACXC,KAAK,EAAE,GAAG/F,QAAQ,GAAGX,mBAAmB,GAAGD,YAAY,IAAI;MAC3DiF,MAAM,EAAE,GAAGrE,QAAQ,GAAGb,mBAAmB,GAAGD,YAAY;IAC1D,CAAC,CACF;IACD8G,OAAO,EAAE,CAAC,GAAGpC,aAAa;EAC5B,CAAC;AACH,CAAC;AAED,SAASjE,SAAS","ignoreList":[]}
|