@oanda/labs-currency-power-balance-widget 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +8 -0
- package/codegen.ts +15 -0
- package/dist/main/CurrencyPowerBalanceWidget/ChartWithData.js +46 -0
- package/dist/main/CurrencyPowerBalanceWidget/ChartWithData.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/CurrencyPowerBalance.js +28 -0
- package/dist/main/CurrencyPowerBalanceWidget/CurrencyPowerBalance.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/Main.js +12 -0
- package/dist/main/CurrencyPowerBalanceWidget/Main.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/Tool.js +28 -0
- package/dist/main/CurrencyPowerBalanceWidget/Tool.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/Chart.js +45 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/Chart.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/index.js +17 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/index.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/constants.js +31 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/constants.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/formatters.js +59 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/formatters.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/getOption.js +103 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/getOption.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/getResponsiveOption.js +36 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/getResponsiveOption.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/index.js +28 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/index.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/types.js +6 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/options/types.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/types.js +6 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/Chart/types.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSelect.js +53 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSelect.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.js +46 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/index.js +17 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/index.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/types.js +6 -0
- package/dist/main/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/types.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/config.js +39 -0
- package/dist/main/CurrencyPowerBalanceWidget/config.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/constants.js +8 -0
- package/dist/main/CurrencyPowerBalanceWidget/constants.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/index.js +17 -0
- package/dist/main/CurrencyPowerBalanceWidget/index.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/render.js +28 -0
- package/dist/main/CurrencyPowerBalanceWidget/render.js.map +1 -0
- package/dist/main/CurrencyPowerBalanceWidget/types.js +6 -0
- package/dist/main/CurrencyPowerBalanceWidget/types.js.map +1 -0
- package/dist/main/gql/getCurrencyPowerBalance.js +11 -0
- package/dist/main/gql/getCurrencyPowerBalance.js.map +1 -0
- package/dist/main/gql/types/fragment-masking.js +24 -0
- package/dist/main/gql/types/fragment-masking.js.map +1 -0
- package/dist/main/gql/types/gql.js +17 -0
- package/dist/main/gql/types/gql.js.map +1 -0
- package/dist/main/gql/types/graphql.js +171 -0
- package/dist/main/gql/types/graphql.js.map +1 -0
- package/dist/main/gql/types/index.js +28 -0
- package/dist/main/gql/types/index.js.map +1 -0
- package/dist/main/index.js +17 -0
- package/dist/main/index.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/ChartWithData.js +39 -0
- package/dist/module/CurrencyPowerBalanceWidget/ChartWithData.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/CurrencyPowerBalance.js +21 -0
- package/dist/module/CurrencyPowerBalanceWidget/CurrencyPowerBalance.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/Main.js +5 -0
- package/dist/module/CurrencyPowerBalanceWidget/Main.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/Tool.js +20 -0
- package/dist/module/CurrencyPowerBalanceWidget/Tool.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/Chart.js +36 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/Chart.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/index.js +2 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/index.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/constants.js +26 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/constants.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/formatters.js +52 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/formatters.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/getOption.js +97 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/getOption.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/getResponsiveOption.js +30 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/getResponsiveOption.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/index.js +3 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/index.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/types.js +2 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/types.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/types.js +2 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/Chart/types.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSelect.js +46 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSelect.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.js +39 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/index.js +2 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/index.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/types.js +2 -0
- package/dist/module/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/types.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/config.js +34 -0
- package/dist/module/CurrencyPowerBalanceWidget/config.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/constants.js +2 -0
- package/dist/module/CurrencyPowerBalanceWidget/constants.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/index.js +2 -0
- package/dist/module/CurrencyPowerBalanceWidget/index.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/render.js +25 -0
- package/dist/module/CurrencyPowerBalanceWidget/render.js.map +1 -0
- package/dist/module/CurrencyPowerBalanceWidget/types.js +2 -0
- package/dist/module/CurrencyPowerBalanceWidget/types.js.map +1 -0
- package/dist/module/gql/getCurrencyPowerBalance.js +5 -0
- package/dist/module/gql/getCurrencyPowerBalance.js.map +1 -0
- package/dist/module/gql/types/fragment-masking.js +16 -0
- package/dist/module/gql/types/fragment-masking.js.map +1 -0
- package/dist/module/gql/types/gql.js +9 -0
- package/dist/module/gql/types/gql.js.map +1 -0
- package/dist/module/gql/types/graphql.js +165 -0
- package/dist/module/gql/types/graphql.js.map +1 -0
- package/dist/module/gql/types/index.js +3 -0
- package/dist/module/gql/types/index.js.map +1 -0
- package/dist/module/index.js +2 -0
- package/dist/module/index.js.map +1 -0
- package/dist/types/CurrencyPowerBalanceWidget/ChartWithData.d.ts +4 -0
- package/dist/types/CurrencyPowerBalanceWidget/CurrencyPowerBalance.d.ts +4 -0
- package/dist/types/CurrencyPowerBalanceWidget/Main.d.ts +3 -0
- package/dist/types/CurrencyPowerBalanceWidget/Tool.d.ts +3 -0
- package/dist/types/CurrencyPowerBalanceWidget/components/Chart/Chart.d.ts +4 -0
- package/dist/types/CurrencyPowerBalanceWidget/components/Chart/index.d.ts +1 -0
- package/dist/types/CurrencyPowerBalanceWidget/components/Chart/options/constants.d.ts +24 -0
- package/dist/types/CurrencyPowerBalanceWidget/components/Chart/options/formatters.d.ts +5 -0
- package/dist/types/CurrencyPowerBalanceWidget/components/Chart/options/getOption.d.ts +74 -0
- package/dist/types/CurrencyPowerBalanceWidget/components/Chart/options/getResponsiveOption.d.ts +110 -0
- package/dist/types/CurrencyPowerBalanceWidget/components/Chart/options/index.d.ts +2 -0
- package/dist/types/CurrencyPowerBalanceWidget/components/Chart/options/types.d.ts +5 -0
- package/dist/types/CurrencyPowerBalanceWidget/components/Chart/types.d.ts +5 -0
- package/dist/types/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSelect.d.ts +4 -0
- package/dist/types/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.d.ts +4 -0
- package/dist/types/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/index.d.ts +1 -0
- package/dist/types/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/types.d.ts +12 -0
- package/dist/types/CurrencyPowerBalanceWidget/config.d.ts +11 -0
- package/dist/types/CurrencyPowerBalanceWidget/constants.d.ts +1 -0
- package/dist/types/CurrencyPowerBalanceWidget/index.d.ts +1 -0
- package/dist/types/CurrencyPowerBalanceWidget/render.d.ts +1 -0
- package/dist/types/CurrencyPowerBalanceWidget/types.d.ts +12 -0
- package/dist/types/gql/getCurrencyPowerBalance.d.ts +1 -0
- package/dist/types/gql/types/fragment-masking.d.ts +15 -0
- package/dist/types/gql/types/gql.d.ts +36 -0
- package/dist/types/gql/types/graphql.d.ts +274 -0
- package/dist/types/gql/types/index.d.ts +2 -0
- package/dist/types/index.d.ts +1 -0
- package/index.ts +1 -0
- package/package.json +27 -0
- package/src/CurrencyPowerBalanceWidget/ChartWithData.tsx +48 -0
- package/src/CurrencyPowerBalanceWidget/CurrencyPowerBalance.tsx +24 -0
- package/src/CurrencyPowerBalanceWidget/Main.tsx +10 -0
- package/src/CurrencyPowerBalanceWidget/Tool.tsx +27 -0
- package/src/CurrencyPowerBalanceWidget/components/Chart/Chart.tsx +45 -0
- package/src/CurrencyPowerBalanceWidget/components/Chart/index.ts +1 -0
- package/src/CurrencyPowerBalanceWidget/components/Chart/options/constants.tsx +41 -0
- package/src/CurrencyPowerBalanceWidget/components/Chart/options/formatters.ts +46 -0
- package/src/CurrencyPowerBalanceWidget/components/Chart/options/getOption.ts +82 -0
- package/src/CurrencyPowerBalanceWidget/components/Chart/options/getResponsiveOption.ts +45 -0
- package/src/CurrencyPowerBalanceWidget/components/Chart/options/index.ts +2 -0
- package/src/CurrencyPowerBalanceWidget/components/Chart/options/types.ts +5 -0
- package/src/CurrencyPowerBalanceWidget/components/Chart/types.ts +6 -0
- package/src/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSelect.tsx +24 -0
- package/src/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.tsx +58 -0
- package/src/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/index.ts +1 -0
- package/src/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/types.ts +14 -0
- package/src/CurrencyPowerBalanceWidget/config.ts +30 -0
- package/src/CurrencyPowerBalanceWidget/constants.ts +1 -0
- package/src/CurrencyPowerBalanceWidget/index.ts +1 -0
- package/src/CurrencyPowerBalanceWidget/render.tsx +36 -0
- package/src/CurrencyPowerBalanceWidget/types.ts +15 -0
- package/src/gql/getCurrencyPowerBalance.ts +13 -0
- package/src/gql/types/fragment-masking.ts +66 -0
- package/src/gql/types/gql.ts +42 -0
- package/src/gql/types/graphql.ts +283 -0
- package/src/gql/types/index.ts +2 -0
- package/src/index.ts +1 -0
- package/test/Main.test.tsx +29 -0
- package/test/chartFormatters.test.ts +59 -0
- package/test/responsesMocks.ts +223 -0
- package/tsconfig.types.json +12 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":["_CurrencyPowerBalanceWidget","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["../../src/index.ts"],"sourcesContent":["export * from './CurrencyPowerBalanceWidget';\n"],"mappings":";;;;;AAAA,IAAAA,2BAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,2BAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,2BAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,2BAAA,CAAAK,GAAA;IAAA;EAAA;AAAA"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { useQuery } from '@apollo/client';
|
|
3
|
+
import { ChartError, Spinner, SpinnerSize, Tooltip } from '@oanda/labs-widget-common';
|
|
4
|
+
import { useMediaQuery } from 'usehooks-ts';
|
|
5
|
+
import { Chart } from './components/Chart';
|
|
6
|
+
import { CURRENCY_POWER_BALANCE_TOOLTIP_ID } from './constants';
|
|
7
|
+
import { getCurrencyPowerBalance } from '../gql/getCurrencyPowerBalance';
|
|
8
|
+
const ChartWithData = _ref => {
|
|
9
|
+
var _data$currencyPowerBa, _data$currencyPowerBa2;
|
|
10
|
+
let {
|
|
11
|
+
timeUnit
|
|
12
|
+
} = _ref;
|
|
13
|
+
const isDesktop = useMediaQuery('(min-width: 768px)');
|
|
14
|
+
const {
|
|
15
|
+
loading,
|
|
16
|
+
data,
|
|
17
|
+
error
|
|
18
|
+
} = useQuery(getCurrencyPowerBalance, {
|
|
19
|
+
variables: {
|
|
20
|
+
timeUnit
|
|
21
|
+
}
|
|
22
|
+
});
|
|
23
|
+
const showChart = (data === null || data === void 0 ? void 0 : data.currencyPowerBalance) && (data === null || data === void 0 || (_data$currencyPowerBa = data.currencyPowerBalance) === null || _data$currencyPowerBa === void 0 ? void 0 : _data$currencyPowerBa.length) > 0;
|
|
24
|
+
const showError = (data === null || data === void 0 || (_data$currencyPowerBa2 = data.currencyPowerBalance) === null || _data$currencyPowerBa2 === void 0 ? void 0 : _data$currencyPowerBa2.length) === 0 || error;
|
|
25
|
+
return React.createElement(React.Fragment, null, loading && React.createElement("div", {
|
|
26
|
+
className: "lw-flex lw-h-[425px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary"
|
|
27
|
+
}, React.createElement(Spinner, {
|
|
28
|
+
size: SpinnerSize.lg
|
|
29
|
+
})), !loading && showChart && React.createElement(Chart, {
|
|
30
|
+
values: data === null || data === void 0 ? void 0 : data.currencyPowerBalance,
|
|
31
|
+
timeUnit: timeUnit
|
|
32
|
+
}), !loading && showError && React.createElement("div", {
|
|
33
|
+
className: "lw-flex lw-h-[425px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary"
|
|
34
|
+
}, React.createElement(ChartError, null)), isDesktop && React.createElement(Tooltip, {
|
|
35
|
+
id: CURRENCY_POWER_BALANCE_TOOLTIP_ID
|
|
36
|
+
}));
|
|
37
|
+
};
|
|
38
|
+
export { ChartWithData };
|
|
39
|
+
//# sourceMappingURL=ChartWithData.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ChartWithData.js","names":["React","useQuery","ChartError","Spinner","SpinnerSize","Tooltip","useMediaQuery","Chart","CURRENCY_POWER_BALANCE_TOOLTIP_ID","getCurrencyPowerBalance","ChartWithData","_ref","_data$currencyPowerBa","_data$currencyPowerBa2","timeUnit","isDesktop","loading","data","error","variables","showChart","currencyPowerBalance","length","showError","createElement","Fragment","className","size","lg","values","id"],"sources":["../../../src/CurrencyPowerBalanceWidget/ChartWithData.tsx"],"sourcesContent":["import React from 'react';\nimport { useQuery } from '@apollo/client';\nimport {\n ChartError, Spinner, SpinnerSize, Tooltip,\n} from '@oanda/labs-widget-common';\nimport { useMediaQuery } from 'usehooks-ts';\nimport { Chart } from './components/Chart';\nimport { CURRENCY_POWER_BALANCE_TOOLTIP_ID } from './constants';\nimport { getCurrencyPowerBalance } from '../gql/getCurrencyPowerBalance';\nimport { ChartWithDataProps } from './types';\nimport { GetCurrencyPowerBalanceQuery, GetCurrencyPowerBalanceQueryVariables } from '../gql/types/graphql';\n\nconst ChartWithData = ({ timeUnit }: ChartWithDataProps) => {\n const isDesktop = useMediaQuery('(min-width: 768px)');\n const { loading, data, error } = useQuery<\n GetCurrencyPowerBalanceQuery,\n GetCurrencyPowerBalanceQueryVariables\n >(getCurrencyPowerBalance, {\n variables: {\n timeUnit,\n },\n });\n\n const showChart = data?.currencyPowerBalance && data?.currencyPowerBalance?.length > 0;\n const showError = data?.currencyPowerBalance?.length === 0 || error;\n\n return (\n <>\n {loading\n && (\n <div className=\"lw-flex lw-h-[425px] 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 && showChart && (\n <Chart values={data?.currencyPowerBalance!} timeUnit={timeUnit} />\n )}\n {!loading && showError && (\n <div className=\"lw-flex lw-h-[425px] 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 </>\n );\n};\n\nexport { ChartWithData };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,QAAQ,gBAAgB;AACzC,SACEC,UAAU,EAAEC,OAAO,EAAEC,WAAW,EAAEC,OAAO,QACpC,2BAA2B;AAClC,SAASC,aAAa,QAAQ,aAAa;AAC3C,SAASC,KAAK,QAAQ,oBAAoB;AAC1C,SAASC,iCAAiC,QAAQ,aAAa;AAC/D,SAASC,uBAAuB,QAAQ,gCAAgC;AAIxE,MAAMC,aAAa,GAAGC,IAAA,IAAsC;EAAA,IAAAC,qBAAA,EAAAC,sBAAA;EAAA,IAArC;IAAEC;EAA6B,CAAC,GAAAH,IAAA;EACrD,MAAMI,SAAS,GAAGT,aAAa,CAAC,oBAAoB,CAAC;EACrD,MAAM;IAAEU,OAAO;IAAEC,IAAI;IAAEC;EAAM,CAAC,GAAGjB,QAAQ,CAGvCQ,uBAAuB,EAAE;IACzBU,SAAS,EAAE;MACTL;IACF;EACF,CAAC,CAAC;EAEF,MAAMM,SAAS,GAAG,CAAAH,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEI,oBAAoB,KAAI,CAAAJ,IAAI,aAAJA,IAAI,gBAAAL,qBAAA,GAAJK,IAAI,CAAEI,oBAAoB,cAAAT,qBAAA,uBAA1BA,qBAAA,CAA4BU,MAAM,IAAG,CAAC;EACtF,MAAMC,SAAS,GAAG,CAAAN,IAAI,aAAJA,IAAI,gBAAAJ,sBAAA,GAAJI,IAAI,CAAEI,oBAAoB,cAAAR,sBAAA,uBAA1BA,sBAAA,CAA4BS,MAAM,MAAK,CAAC,IAAIJ,KAAK;EAEnE,OACElB,KAAA,CAAAwB,aAAA,CAAAxB,KAAA,CAAAyB,QAAA,QACGT,OAAO,IAERhB,KAAA,CAAAwB,aAAA;IAAKE,SAAS,EAAC;EAAmG,GAChH1B,KAAA,CAAAwB,aAAA,CAACrB,OAAO;IAACwB,IAAI,EAAEvB,WAAW,CAACwB;EAAG,CAAE,CAC7B,CACJ,EACA,CAACZ,OAAO,IAAII,SAAS,IACpBpB,KAAA,CAAAwB,aAAA,CAACjB,KAAK;IAACsB,MAAM,EAAEZ,IAAI,aAAJA,IAAI,uBAAJA,IAAI,CAAEI,oBAAsB;IAACP,QAAQ,EAAEA;EAAS,CAAE,CAClE,EACA,CAACE,OAAO,IAAIO,SAAS,IACpBvB,KAAA,CAAAwB,aAAA;IAAKE,SAAS,EAAC;EAAmG,GAChH1B,KAAA,CAAAwB,aAAA,CAACtB,UAAU,MAAE,CACV,CACN,EACAa,SAAS,IAAIf,KAAA,CAAAwB,aAAA,CAACnB,OAAO;IAACyB,EAAE,EAAEtB;EAAkC,CAAE,CAC/D,CAAC;AAEP,CAAC;AAED,SAASE,aAAa"}
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { ApolloClient, InMemoryCache, ApolloProvider } from '@apollo/client';
|
|
3
|
+
import { ThemeProvider } from '@oanda/labs-widget-common';
|
|
4
|
+
import { Main } from './Main';
|
|
5
|
+
const CurrencyPowerBalance = _ref => {
|
|
6
|
+
let {
|
|
7
|
+
graphqlUrl,
|
|
8
|
+
theme
|
|
9
|
+
} = _ref;
|
|
10
|
+
const client = new ApolloClient({
|
|
11
|
+
uri: graphqlUrl,
|
|
12
|
+
cache: new InMemoryCache()
|
|
13
|
+
});
|
|
14
|
+
return React.createElement(ThemeProvider, {
|
|
15
|
+
theme: theme
|
|
16
|
+
}, React.createElement(ApolloProvider, {
|
|
17
|
+
client: client
|
|
18
|
+
}, React.createElement(Main, null)));
|
|
19
|
+
};
|
|
20
|
+
export { CurrencyPowerBalance };
|
|
21
|
+
//# sourceMappingURL=CurrencyPowerBalance.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CurrencyPowerBalance.js","names":["React","ApolloClient","InMemoryCache","ApolloProvider","ThemeProvider","Main","CurrencyPowerBalance","_ref","graphqlUrl","theme","client","uri","cache","createElement"],"sources":["../../../src/CurrencyPowerBalanceWidget/CurrencyPowerBalance.tsx"],"sourcesContent":["import React from 'react';\nimport { ApolloClient, InMemoryCache, ApolloProvider } from '@apollo/client';\nimport { ThemeProvider } from '@oanda/labs-widget-common';\nimport { Main } from './Main';\nimport { CurrencyPowerBalanceConfig } from './types';\n\nconst CurrencyPowerBalance = ({\n graphqlUrl, theme,\n}: CurrencyPowerBalanceConfig) => {\n const client = new ApolloClient({\n uri: graphqlUrl,\n cache: new InMemoryCache(),\n });\n\n return (\n <ThemeProvider theme={theme}>\n <ApolloProvider client={client}>\n <Main />\n </ApolloProvider>\n </ThemeProvider>\n );\n};\n\nexport { CurrencyPowerBalance };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,YAAY,EAAEC,aAAa,EAAEC,cAAc,QAAQ,gBAAgB;AAC5E,SAASC,aAAa,QAAQ,2BAA2B;AACzD,SAASC,IAAI,QAAQ,QAAQ;AAG7B,MAAMC,oBAAoB,GAAGC,IAAA,IAEK;EAAA,IAFJ;IAC5BC,UAAU;IAAEC;EACc,CAAC,GAAAF,IAAA;EAC3B,MAAMG,MAAM,GAAG,IAAIT,YAAY,CAAC;IAC9BU,GAAG,EAAEH,UAAU;IACfI,KAAK,EAAE,IAAIV,aAAa,CAAC;EAC3B,CAAC,CAAC;EAEF,OACEF,KAAA,CAAAa,aAAA,CAACT,aAAa;IAACK,KAAK,EAAEA;EAAM,GAC1BT,KAAA,CAAAa,aAAA,CAACV,cAAc;IAACO,MAAM,EAAEA;EAAO,GAC7BV,KAAA,CAAAa,aAAA,CAACR,IAAI,MAAE,CACO,CACH,CAAC;AAEpB,CAAC;AAED,SAASC,oBAAoB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Main.js","names":["React","Tool","Main","createElement","Fragment"],"sources":["../../../src/CurrencyPowerBalanceWidget/Main.tsx"],"sourcesContent":["import React from 'react';\nimport { Tool } from './Tool';\n\nconst Main = () => (\n <>\n <Tool />\n </>\n);\n\nexport { Main };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,IAAI,QAAQ,QAAQ;AAE7B,MAAMC,IAAI,GAAGA,CAAA,KACXF,KAAA,CAAAG,aAAA,CAAAH,KAAA,CAAAI,QAAA,QACEJ,KAAA,CAAAG,aAAA,CAACF,IAAI,MAAE,CACP,CACH;AAED,SAASC,IAAI"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
import React, { useState } from 'react';
|
|
2
|
+
import { timeUnitConfig } from './config';
|
|
3
|
+
import { TimeUnitSwitch } from './components/TimeUnitSwitch';
|
|
4
|
+
import { ChartWithData } from './ChartWithData';
|
|
5
|
+
import { CurrencyPowerBalanceTimeUnit } from '../gql/types/graphql';
|
|
6
|
+
const Tool = () => {
|
|
7
|
+
const [selectedTimeUnit, setSelectedTimeUnit] = useState(CurrencyPowerBalanceTimeUnit.CurrentDay);
|
|
8
|
+
return React.createElement("div", {
|
|
9
|
+
"data-testid": "currency-power-balance-wrapper",
|
|
10
|
+
className: "lw-flex lw-flex-col lw-overflow-hidden lw-text-sm lw-tracking-normal"
|
|
11
|
+
}, React.createElement(TimeUnitSwitch, {
|
|
12
|
+
selected: selectedTimeUnit,
|
|
13
|
+
callback: setSelectedTimeUnit,
|
|
14
|
+
options: timeUnitConfig
|
|
15
|
+
}), React.createElement(ChartWithData, {
|
|
16
|
+
timeUnit: selectedTimeUnit
|
|
17
|
+
}));
|
|
18
|
+
};
|
|
19
|
+
export { Tool };
|
|
20
|
+
//# sourceMappingURL=Tool.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Tool.js","names":["React","useState","timeUnitConfig","TimeUnitSwitch","ChartWithData","CurrencyPowerBalanceTimeUnit","Tool","selectedTimeUnit","setSelectedTimeUnit","CurrentDay","createElement","className","selected","callback","options","timeUnit"],"sources":["../../../src/CurrencyPowerBalanceWidget/Tool.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { timeUnitConfig } from './config';\nimport { TimeUnitSwitch } from './components/TimeUnitSwitch';\nimport { ChartWithData } from './ChartWithData';\nimport { CurrencyPowerBalanceTimeUnit } from '../gql/types/graphql';\n\nconst Tool = () => {\n const [selectedTimeUnit, setSelectedTimeUnit] = useState(CurrencyPowerBalanceTimeUnit.CurrentDay);\n\n return (\n <div\n data-testid=\"currency-power-balance-wrapper\"\n className=\"lw-flex lw-flex-col lw-overflow-hidden lw-text-sm lw-tracking-normal\"\n >\n <TimeUnitSwitch\n selected={selectedTimeUnit}\n callback={setSelectedTimeUnit}\n options={timeUnitConfig}\n />\n <ChartWithData\n timeUnit={selectedTimeUnit}\n />\n </div>\n );\n};\n\nexport { Tool };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,SAASC,cAAc,QAAQ,UAAU;AACzC,SAASC,cAAc,QAAQ,6BAA6B;AAC5D,SAASC,aAAa,QAAQ,iBAAiB;AAC/C,SAASC,4BAA4B,QAAQ,sBAAsB;AAEnE,MAAMC,IAAI,GAAGA,CAAA,KAAM;EACjB,MAAM,CAACC,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGP,QAAQ,CAACI,4BAA4B,CAACI,UAAU,CAAC;EAEjG,OACET,KAAA,CAAAU,aAAA;IACE,eAAY,gCAAgC;IAC5CC,SAAS,EAAC;EAAsE,GAEhFX,KAAA,CAAAU,aAAA,CAACP,cAAc;IACbS,QAAQ,EAAEL,gBAAiB;IAC3BM,QAAQ,EAAEL,mBAAoB;IAC9BM,OAAO,EAAEZ;EAAe,CACzB,CAAC,EACFF,KAAA,CAAAU,aAAA,CAACN,aAAa;IACZW,QAAQ,EAAER;EAAiB,CAC5B,CACE,CAAC;AAEV,CAAC;AAED,SAASD,IAAI"}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import React, { useRef, useEffect, useContext } from 'react';
|
|
2
|
+
import ReactECharts from 'echarts-for-react';
|
|
3
|
+
import { registerTheme } from 'echarts';
|
|
4
|
+
import { useMediaQuery } from 'usehooks-ts';
|
|
5
|
+
import { Theme, ThemeContext, getChartTheme } from '@oanda/labs-widget-common';
|
|
6
|
+
import { CHART_HEIGHT } from './options/constants';
|
|
7
|
+
import { getResponsiveOption, getOption } from './options';
|
|
8
|
+
registerTheme('dark_theme', getChartTheme(Theme.Dark));
|
|
9
|
+
registerTheme('light_theme', getChartTheme(Theme.Light));
|
|
10
|
+
const Chart = _ref => {
|
|
11
|
+
let {
|
|
12
|
+
values,
|
|
13
|
+
timeUnit
|
|
14
|
+
} = _ref;
|
|
15
|
+
const isDark = useContext(ThemeContext) === Theme.Dark;
|
|
16
|
+
const echartRef = useRef(null);
|
|
17
|
+
const isDesktop = useMediaQuery('(min-width: 768px)');
|
|
18
|
+
const isMobile = useMediaQuery('(max-width: 479px');
|
|
19
|
+
useEffect(() => {
|
|
20
|
+
if (echartRef.current) {
|
|
21
|
+
const echartInstance = echartRef.current.getEchartsInstance();
|
|
22
|
+
echartInstance.setOption(getResponsiveOption(isDesktop, isMobile, isDark));
|
|
23
|
+
}
|
|
24
|
+
}, [echartRef, isDesktop, isMobile, isDark]);
|
|
25
|
+
return React.createElement(ReactECharts, {
|
|
26
|
+
ref: echartRef,
|
|
27
|
+
theme: isDark ? 'dark_theme' : 'light_theme',
|
|
28
|
+
style: {
|
|
29
|
+
height: "".concat(CHART_HEIGHT, "px"),
|
|
30
|
+
width: '100%'
|
|
31
|
+
},
|
|
32
|
+
option: getOption(values, timeUnit, isDark)
|
|
33
|
+
});
|
|
34
|
+
};
|
|
35
|
+
export { Chart };
|
|
36
|
+
//# sourceMappingURL=Chart.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Chart.js","names":["React","useRef","useEffect","useContext","ReactECharts","registerTheme","useMediaQuery","Theme","ThemeContext","getChartTheme","CHART_HEIGHT","getResponsiveOption","getOption","Dark","Light","Chart","_ref","values","timeUnit","isDark","echartRef","isDesktop","isMobile","current","echartInstance","getEchartsInstance","setOption","createElement","ref","theme","style","height","concat","width","option"],"sources":["../../../../../src/CurrencyPowerBalanceWidget/components/Chart/Chart.tsx"],"sourcesContent":["import React, { useRef, useEffect, useContext } from 'react';\nimport ReactECharts from 'echarts-for-react';\nimport { registerTheme, EChartsType } from 'echarts';\nimport { useMediaQuery } from 'usehooks-ts';\nimport { Theme, ThemeContext, getChartTheme } from '@oanda/labs-widget-common';\nimport {\n CHART_HEIGHT,\n} from './options/constants';\nimport { getResponsiveOption, getOption } from './options';\nimport { ChartProps } from './types';\n\nregisterTheme('dark_theme', getChartTheme(Theme.Dark));\nregisterTheme('light_theme', getChartTheme(Theme.Light));\n\nconst Chart = ({ values, timeUnit }: ChartProps) => {\n const isDark = useContext(ThemeContext) === Theme.Dark;\n const echartRef = useRef(null);\n const isDesktop = useMediaQuery('(min-width: 768px)');\n const isMobile = useMediaQuery('(max-width: 479px');\n\n useEffect(() => {\n if (echartRef.current) {\n // @ts-ignore\n const echartInstance = echartRef.current.getEchartsInstance() as EChartsType;\n\n echartInstance.setOption(\n getResponsiveOption(isDesktop, isMobile, isDark),\n );\n }\n }, [echartRef, isDesktop, isMobile, isDark]);\n\n return (\n <ReactECharts\n ref={echartRef}\n theme={isDark ? 'dark_theme' : 'light_theme'}\n style={{\n height: `${CHART_HEIGHT}px`,\n width: '100%',\n }}\n option={getOption(values, timeUnit, isDark)}\n />\n );\n};\n\nexport { Chart };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,MAAM,EAAEC,SAAS,EAAEC,UAAU,QAAQ,OAAO;AAC5D,OAAOC,YAAY,MAAM,mBAAmB;AAC5C,SAASC,aAAa,QAAqB,SAAS;AACpD,SAASC,aAAa,QAAQ,aAAa;AAC3C,SAASC,KAAK,EAAEC,YAAY,EAAEC,aAAa,QAAQ,2BAA2B;AAC9E,SACEC,YAAY,QACP,qBAAqB;AAC5B,SAASC,mBAAmB,EAAEC,SAAS,QAAQ,WAAW;AAG1DP,aAAa,CAAC,YAAY,EAAEI,aAAa,CAACF,KAAK,CAACM,IAAI,CAAC,CAAC;AACtDR,aAAa,CAAC,aAAa,EAAEI,aAAa,CAACF,KAAK,CAACO,KAAK,CAAC,CAAC;AAExD,MAAMC,KAAK,GAAGC,IAAA,IAAsC;EAAA,IAArC;IAAEC,MAAM;IAAEC;EAAqB,CAAC,GAAAF,IAAA;EAC7C,MAAMG,MAAM,GAAGhB,UAAU,CAACK,YAAY,CAAC,KAAKD,KAAK,CAACM,IAAI;EACtD,MAAMO,SAAS,GAAGnB,MAAM,CAAC,IAAI,CAAC;EAC9B,MAAMoB,SAAS,GAAGf,aAAa,CAAC,oBAAoB,CAAC;EACrD,MAAMgB,QAAQ,GAAGhB,aAAa,CAAC,mBAAmB,CAAC;EAEnDJ,SAAS,CAAC,MAAM;IACd,IAAIkB,SAAS,CAACG,OAAO,EAAE;MAErB,MAAMC,cAAc,GAAGJ,SAAS,CAACG,OAAO,CAACE,kBAAkB,CAAC,CAAgB;MAE5ED,cAAc,CAACE,SAAS,CACtBf,mBAAmB,CAACU,SAAS,EAAEC,QAAQ,EAAEH,MAAM,CACjD,CAAC;IACH;EACF,CAAC,EAAE,CAACC,SAAS,EAAEC,SAAS,EAAEC,QAAQ,EAAEH,MAAM,CAAC,CAAC;EAE5C,OACEnB,KAAA,CAAA2B,aAAA,CAACvB,YAAY;IACXwB,GAAG,EAAER,SAAU;IACfS,KAAK,EAAEV,MAAM,GAAG,YAAY,GAAG,aAAc;IAC7CW,KAAK,EAAE;MACLC,MAAM,KAAAC,MAAA,CAAKtB,YAAY,OAAI;MAC3BuB,KAAK,EAAE;IACT,CAAE;IACFC,MAAM,EAAEtB,SAAS,CAACK,MAAM,EAAEC,QAAQ,EAAEC,MAAM;EAAE,CAC7C,CAAC;AAEN,CAAC;AAED,SAASJ,KAAK"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/CurrencyPowerBalanceWidget/components/Chart/index.ts"],"sourcesContent":["export * from './Chart';\n"],"mappings":"AAAA,cAAc,SAAS"}
|
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
import { colorPalette } from '@oanda/labs-widget-common';
|
|
2
|
+
const X_LABEL_SIZE = 90;
|
|
3
|
+
const X_LABEL_SIZE_MOBILE = 110;
|
|
4
|
+
const Y_LABEL_SIZE_MOBILE = 35;
|
|
5
|
+
const Y_LABEL_SIZE = 45;
|
|
6
|
+
const CHART_WIDTH = 9999;
|
|
7
|
+
const CHART_HEIGHT = 425;
|
|
8
|
+
const LEGEND_HEIGHT = 50;
|
|
9
|
+
const LEGEND_HEIGHT_MOBILE = 70;
|
|
10
|
+
const VERTICAL_LINE_COUNT = 10;
|
|
11
|
+
const COLOR_CONFIG = {
|
|
12
|
+
AUD: colorPalette.orange,
|
|
13
|
+
JPY: colorPalette.raspberryLight,
|
|
14
|
+
USD: colorPalette.greenLight,
|
|
15
|
+
EUR: colorPalette.turquoiseLight,
|
|
16
|
+
GBP: colorPalette.violetLight,
|
|
17
|
+
CHF: colorPalette.bottleGreen75Lighter,
|
|
18
|
+
CAD: colorPalette.midnight75Lighter,
|
|
19
|
+
NZD: colorPalette.gold
|
|
20
|
+
};
|
|
21
|
+
const TOOLTIP_LINE_COLOR_CONFIG = {
|
|
22
|
+
DARK: colorPalette.orange,
|
|
23
|
+
LIGHT: colorPalette.bottleGreenDark
|
|
24
|
+
};
|
|
25
|
+
export { X_LABEL_SIZE, X_LABEL_SIZE_MOBILE, Y_LABEL_SIZE_MOBILE, Y_LABEL_SIZE, CHART_WIDTH, CHART_HEIGHT, LEGEND_HEIGHT, LEGEND_HEIGHT_MOBILE, VERTICAL_LINE_COUNT, COLOR_CONFIG, TOOLTIP_LINE_COLOR_CONFIG };
|
|
26
|
+
//# sourceMappingURL=constants.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"constants.js","names":["colorPalette","X_LABEL_SIZE","X_LABEL_SIZE_MOBILE","Y_LABEL_SIZE_MOBILE","Y_LABEL_SIZE","CHART_WIDTH","CHART_HEIGHT","LEGEND_HEIGHT","LEGEND_HEIGHT_MOBILE","VERTICAL_LINE_COUNT","COLOR_CONFIG","AUD","orange","JPY","raspberryLight","USD","greenLight","EUR","turquoiseLight","GBP","violetLight","CHF","bottleGreen75Lighter","CAD","midnight75Lighter","NZD","gold","TOOLTIP_LINE_COLOR_CONFIG","DARK","LIGHT","bottleGreenDark"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/constants.tsx"],"sourcesContent":["import { colorPalette } from '@oanda/labs-widget-common';\n\nconst X_LABEL_SIZE = 90;\nconst X_LABEL_SIZE_MOBILE = 110;\nconst Y_LABEL_SIZE_MOBILE = 35;\nconst Y_LABEL_SIZE = 45;\nconst CHART_WIDTH = 9999;\nconst CHART_HEIGHT = 425;\nconst LEGEND_HEIGHT = 50;\nconst LEGEND_HEIGHT_MOBILE = 70;\nconst VERTICAL_LINE_COUNT = 10;\n\nconst COLOR_CONFIG = {\n AUD: colorPalette.orange,\n JPY: colorPalette.raspberryLight,\n USD: colorPalette.greenLight,\n EUR: colorPalette.turquoiseLight,\n GBP: colorPalette.violetLight,\n CHF: colorPalette.bottleGreen75Lighter,\n CAD: colorPalette.midnight75Lighter,\n NZD: colorPalette.gold,\n};\n\nconst TOOLTIP_LINE_COLOR_CONFIG = {\n DARK: colorPalette.orange,\n LIGHT: colorPalette.bottleGreenDark,\n};\n\nexport {\n X_LABEL_SIZE,\n X_LABEL_SIZE_MOBILE,\n Y_LABEL_SIZE_MOBILE,\n Y_LABEL_SIZE,\n CHART_WIDTH,\n CHART_HEIGHT,\n LEGEND_HEIGHT,\n LEGEND_HEIGHT_MOBILE,\n VERTICAL_LINE_COUNT,\n COLOR_CONFIG,\n TOOLTIP_LINE_COLOR_CONFIG,\n};\n"],"mappings":"AAAA,SAASA,YAAY,QAAQ,2BAA2B;AAExD,MAAMC,YAAY,GAAG,EAAE;AACvB,MAAMC,mBAAmB,GAAG,GAAG;AAC/B,MAAMC,mBAAmB,GAAG,EAAE;AAC9B,MAAMC,YAAY,GAAG,EAAE;AACvB,MAAMC,WAAW,GAAG,IAAI;AACxB,MAAMC,YAAY,GAAG,GAAG;AACxB,MAAMC,aAAa,GAAG,EAAE;AACxB,MAAMC,oBAAoB,GAAG,EAAE;AAC/B,MAAMC,mBAAmB,GAAG,EAAE;AAE9B,MAAMC,YAAY,GAAG;EACnBC,GAAG,EAAEX,YAAY,CAACY,MAAM;EACxBC,GAAG,EAAEb,YAAY,CAACc,cAAc;EAChCC,GAAG,EAAEf,YAAY,CAACgB,UAAU;EAC5BC,GAAG,EAAEjB,YAAY,CAACkB,cAAc;EAChCC,GAAG,EAAEnB,YAAY,CAACoB,WAAW;EAC7BC,GAAG,EAAErB,YAAY,CAACsB,oBAAoB;EACtCC,GAAG,EAAEvB,YAAY,CAACwB,iBAAiB;EACnCC,GAAG,EAAEzB,YAAY,CAAC0B;AACpB,CAAC;AAED,MAAMC,yBAAyB,GAAG;EAChCC,IAAI,EAAE5B,YAAY,CAACY,MAAM;EACzBiB,KAAK,EAAE7B,YAAY,CAAC8B;AACtB,CAAC;AAED,SACE7B,YAAY,EACZC,mBAAmB,EACnBC,mBAAmB,EACnBC,YAAY,EACZC,WAAW,EACXC,YAAY,EACZC,aAAa,EACbC,oBAAoB,EACpBC,mBAAmB,EACnBC,YAAY,EACZiB,yBAAyB"}
|
|
@@ -0,0 +1,52 @@
|
|
|
1
|
+
const getDateAndTime = param => {
|
|
2
|
+
const dateAndTime = param.split('T');
|
|
3
|
+
return {
|
|
4
|
+
date: dateAndTime[0],
|
|
5
|
+
time: dateAndTime[1].substring(0, 5)
|
|
6
|
+
};
|
|
7
|
+
};
|
|
8
|
+
const dateFormat = date => "".concat(new Date(date).toLocaleDateString(undefined, {
|
|
9
|
+
month: 'numeric',
|
|
10
|
+
day: 'numeric'
|
|
11
|
+
}));
|
|
12
|
+
const dateTimeFormat = _ref => {
|
|
13
|
+
let {
|
|
14
|
+
date,
|
|
15
|
+
time
|
|
16
|
+
} = _ref;
|
|
17
|
+
return "".concat(new Date(date).toLocaleDateString(undefined, {
|
|
18
|
+
year: 'numeric',
|
|
19
|
+
month: 'numeric',
|
|
20
|
+
day: 'numeric'
|
|
21
|
+
}), ", ").concat(time, " UTC");
|
|
22
|
+
};
|
|
23
|
+
const xAxisLabelFormatter = (label, timeUnit) => {
|
|
24
|
+
const {
|
|
25
|
+
date,
|
|
26
|
+
time
|
|
27
|
+
} = getDateAndTime(label);
|
|
28
|
+
const isDateFormat = timeUnit.startsWith('M') || timeUnit.startsWith('W') || time === '00:00';
|
|
29
|
+
return isDateFormat ? dateFormat(date) : time;
|
|
30
|
+
};
|
|
31
|
+
const tooltipFormatter = values => {
|
|
32
|
+
const date = dateTimeFormat(getDateAndTime(values[0].value[0]));
|
|
33
|
+
const row = values.sort((_ref2, _ref3) => {
|
|
34
|
+
let {
|
|
35
|
+
value: valueA
|
|
36
|
+
} = _ref2;
|
|
37
|
+
let {
|
|
38
|
+
value: valueB
|
|
39
|
+
} = _ref3;
|
|
40
|
+
return Number(valueB[1]) - Number(valueA[1]);
|
|
41
|
+
}).map(_ref4 => {
|
|
42
|
+
let {
|
|
43
|
+
marker,
|
|
44
|
+
seriesName,
|
|
45
|
+
value
|
|
46
|
+
} = _ref4;
|
|
47
|
+
return "<div style=\"display:flex;align-items:center;\">\n <div style=\"display:flex;align-items:center;width:50px;margin-right:10px;\">\n ".concat(marker, "\n <span>").concat(seriesName, "</span>\n </div>\n <span>").concat(value[1], "</span>\n </div>");
|
|
48
|
+
});
|
|
49
|
+
return "<div style=\"display:flex; flex-direction:column;\">\n <p style=\"margin-bottom:5px;\">".concat(date, "</p>\n ").concat(row.join('\n'), "\n </div>");
|
|
50
|
+
};
|
|
51
|
+
export { tooltipFormatter, xAxisLabelFormatter };
|
|
52
|
+
//# sourceMappingURL=formatters.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"formatters.js","names":["getDateAndTime","param","dateAndTime","split","date","time","substring","dateFormat","concat","Date","toLocaleDateString","undefined","month","day","dateTimeFormat","_ref","year","xAxisLabelFormatter","label","timeUnit","isDateFormat","startsWith","tooltipFormatter","values","value","row","sort","_ref2","_ref3","valueA","valueB","Number","map","_ref4","marker","seriesName","join"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/formatters.ts"],"sourcesContent":["import { CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';\nimport { TooltipFormatterParams } from './types';\n\nconst getDateAndTime = (param: string) => {\n const dateAndTime = param.split('T');\n\n return {\n date: dateAndTime[0],\n time: dateAndTime[1].substring(0, 5),\n };\n};\n\nconst dateFormat = (date: string) => `${new Date(date).toLocaleDateString(undefined, { month: 'numeric', day: 'numeric' })}`;\n\nconst dateTimeFormat = ({ date, time }: { date: string, time: string }) => `${new Date(date).toLocaleDateString(undefined, { year: 'numeric', month: 'numeric', day: 'numeric' })}, ${time} UTC`;\n\nconst xAxisLabelFormatter = (label: string, timeUnit: CurrencyPowerBalanceTimeUnit) => {\n const { date, time } = getDateAndTime(label);\n const isDateFormat = timeUnit.startsWith('M') || timeUnit.startsWith('W') || time === '00:00';\n\n return isDateFormat ? dateFormat(date) : time;\n};\n\nconst tooltipFormatter = (values: TooltipFormatterParams[]) => {\n const date = dateTimeFormat(getDateAndTime(values[0].value[0]));\n\n const row = values\n .sort(({ value: valueA }, { value: valueB }) => Number(valueB[1]) - Number(valueA[1]))\n .map(({ marker, seriesName, value }) => `<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 return `<div style=\"display:flex; flex-direction:column;\">\n <p style=\"margin-bottom:5px;\">${date}</p>\n ${row.join('\\n')}\n </div>`;\n};\n\nexport {\n tooltipFormatter,\n xAxisLabelFormatter,\n};\n"],"mappings":"AAGA,MAAMA,cAAc,GAAIC,KAAa,IAAK;EACxC,MAAMC,WAAW,GAAGD,KAAK,CAACE,KAAK,CAAC,GAAG,CAAC;EAEpC,OAAO;IACLC,IAAI,EAAEF,WAAW,CAAC,CAAC,CAAC;IACpBG,IAAI,EAAEH,WAAW,CAAC,CAAC,CAAC,CAACI,SAAS,CAAC,CAAC,EAAE,CAAC;EACrC,CAAC;AACH,CAAC;AAED,MAAMC,UAAU,GAAIH,IAAY,OAAAI,MAAA,CAAQ,IAAIC,IAAI,CAACL,IAAI,CAAC,CAACM,kBAAkB,CAACC,SAAS,EAAE;EAAEC,KAAK,EAAE,SAAS;EAAEC,GAAG,EAAE;AAAU,CAAC,CAAC,CAAE;AAE5H,MAAMC,cAAc,GAAGC,IAAA;EAAA,IAAC;IAAEX,IAAI;IAAEC;EAAqC,CAAC,GAAAU,IAAA;EAAA,UAAAP,MAAA,CAAQ,IAAIC,IAAI,CAACL,IAAI,CAAC,CAACM,kBAAkB,CAACC,SAAS,EAAE;IAAEK,IAAI,EAAE,SAAS;IAAEJ,KAAK,EAAE,SAAS;IAAEC,GAAG,EAAE;EAAU,CAAC,CAAC,QAAAL,MAAA,CAAKH,IAAI;AAAA,CAAM;AAEhM,MAAMY,mBAAmB,GAAGA,CAACC,KAAa,EAAEC,QAAsC,KAAK;EACrF,MAAM;IAAEf,IAAI;IAAEC;EAAK,CAAC,GAAGL,cAAc,CAACkB,KAAK,CAAC;EAC5C,MAAME,YAAY,GAAGD,QAAQ,CAACE,UAAU,CAAC,GAAG,CAAC,IAAIF,QAAQ,CAACE,UAAU,CAAC,GAAG,CAAC,IAAIhB,IAAI,KAAK,OAAO;EAE7F,OAAOe,YAAY,GAAGb,UAAU,CAACH,IAAI,CAAC,GAAGC,IAAI;AAC/C,CAAC;AAED,MAAMiB,gBAAgB,GAAIC,MAAgC,IAAK;EAC7D,MAAMnB,IAAI,GAAGU,cAAc,CAACd,cAAc,CAACuB,MAAM,CAAC,CAAC,CAAC,CAACC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC;EAE/D,MAAMC,GAAG,GAAGF,MAAM,CACfG,IAAI,CAAC,CAAAC,KAAA,EAAAC,KAAA;IAAA,IAAC;MAAEJ,KAAK,EAAEK;IAAO,CAAC,GAAAF,KAAA;IAAA,IAAE;MAAEH,KAAK,EAAEM;IAAO,CAAC,GAAAF,KAAA;IAAA,OAAKG,MAAM,CAACD,MAAM,CAAC,CAAC,CAAC,CAAC,GAAGC,MAAM,CAACF,MAAM,CAAC,CAAC,CAAC,CAAC;EAAA,EAAC,CACrFG,GAAG,CAACC,KAAA;IAAA,IAAC;MAAEC,MAAM;MAAEC,UAAU;MAAEX;IAAM,CAAC,GAAAS,KAAA;IAAA,yJAAAzB,MAAA,CAE7B0B,MAAM,sBAAA1B,MAAA,CACA2B,UAAU,yCAAA3B,MAAA,CAEZgB,KAAK,CAAC,CAAC,CAAC;EAAA,CACX,CAAC;EAEV,oGAAAhB,MAAA,CACkCJ,IAAI,gBAAAI,MAAA,CAClCiB,GAAG,CAACW,IAAI,CAAC,IAAI,CAAC;AAEpB,CAAC;AAED,SACEd,gBAAgB,EAChBL,mBAAmB"}
|
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
import { COLOR_CONFIG, TOOLTIP_LINE_COLOR_CONFIG, VERTICAL_LINE_COUNT } from './constants';
|
|
2
|
+
import { tooltipFormatter, xAxisLabelFormatter } from './formatters';
|
|
3
|
+
const getOption = (values, timeUnit, isDark) => {
|
|
4
|
+
const seriesData = values.map(_ref => {
|
|
5
|
+
let {
|
|
6
|
+
currency,
|
|
7
|
+
power
|
|
8
|
+
} = _ref;
|
|
9
|
+
return {
|
|
10
|
+
name: currency,
|
|
11
|
+
type: 'line',
|
|
12
|
+
symbol: 'circle',
|
|
13
|
+
showSymbol: false,
|
|
14
|
+
itemStyle: {
|
|
15
|
+
color: COLOR_CONFIG[currency]
|
|
16
|
+
},
|
|
17
|
+
lineStyle: {
|
|
18
|
+
color: COLOR_CONFIG[currency]
|
|
19
|
+
},
|
|
20
|
+
data: power.map(_ref2 => {
|
|
21
|
+
let {
|
|
22
|
+
point,
|
|
23
|
+
price
|
|
24
|
+
} = _ref2;
|
|
25
|
+
return [point, price];
|
|
26
|
+
})
|
|
27
|
+
};
|
|
28
|
+
});
|
|
29
|
+
const legendData = values.map(_ref3 => {
|
|
30
|
+
let {
|
|
31
|
+
currency
|
|
32
|
+
} = _ref3;
|
|
33
|
+
return {
|
|
34
|
+
name: currency,
|
|
35
|
+
itemStyle: {
|
|
36
|
+
color: COLOR_CONFIG[currency]
|
|
37
|
+
}
|
|
38
|
+
};
|
|
39
|
+
});
|
|
40
|
+
return {
|
|
41
|
+
animation: false,
|
|
42
|
+
legend: {
|
|
43
|
+
data: legendData,
|
|
44
|
+
bottom: 10,
|
|
45
|
+
icon: 'circle'
|
|
46
|
+
},
|
|
47
|
+
tooltip: {
|
|
48
|
+
trigger: 'axis',
|
|
49
|
+
axisPointer: {
|
|
50
|
+
axis: 'x',
|
|
51
|
+
z: 0,
|
|
52
|
+
lineStyle: {
|
|
53
|
+
color: isDark ? TOOLTIP_LINE_COLOR_CONFIG.DARK : TOOLTIP_LINE_COLOR_CONFIG.LIGHT
|
|
54
|
+
}
|
|
55
|
+
},
|
|
56
|
+
formatter: tooltipFormatter
|
|
57
|
+
},
|
|
58
|
+
xAxis: {
|
|
59
|
+
type: 'category',
|
|
60
|
+
axisTick: {
|
|
61
|
+
show: false
|
|
62
|
+
},
|
|
63
|
+
axisLine: {
|
|
64
|
+
show: false
|
|
65
|
+
},
|
|
66
|
+
splitLine: {
|
|
67
|
+
show: true
|
|
68
|
+
},
|
|
69
|
+
axisLabel: {
|
|
70
|
+
margin: 10,
|
|
71
|
+
showMinLabel: false,
|
|
72
|
+
rotate: -45,
|
|
73
|
+
interval: Math.round(seriesData[0].data.length / VERTICAL_LINE_COUNT),
|
|
74
|
+
formatter: label => xAxisLabelFormatter(label, timeUnit)
|
|
75
|
+
}
|
|
76
|
+
},
|
|
77
|
+
yAxis: {
|
|
78
|
+
type: 'value',
|
|
79
|
+
position: 'right',
|
|
80
|
+
splitNumber: 5,
|
|
81
|
+
axisLine: {
|
|
82
|
+
show: false
|
|
83
|
+
},
|
|
84
|
+
axisTick: {
|
|
85
|
+
show: false
|
|
86
|
+
},
|
|
87
|
+
boundaryGap: ['10%', '10%'],
|
|
88
|
+
axisLabel: {
|
|
89
|
+
showMaxLabel: false,
|
|
90
|
+
showMinLabel: false
|
|
91
|
+
}
|
|
92
|
+
},
|
|
93
|
+
series: seriesData
|
|
94
|
+
};
|
|
95
|
+
};
|
|
96
|
+
export { getOption };
|
|
97
|
+
//# sourceMappingURL=getOption.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"getOption.js","names":["COLOR_CONFIG","TOOLTIP_LINE_COLOR_CONFIG","VERTICAL_LINE_COUNT","tooltipFormatter","xAxisLabelFormatter","getOption","values","timeUnit","isDark","seriesData","map","_ref","currency","power","name","type","symbol","showSymbol","itemStyle","color","lineStyle","data","_ref2","point","price","legendData","_ref3","animation","legend","bottom","icon","tooltip","trigger","axisPointer","axis","z","DARK","LIGHT","formatter","xAxis","axisTick","show","axisLine","splitLine","axisLabel","margin","showMinLabel","rotate","interval","Math","round","length","label","yAxis","position","splitNumber","boundaryGap","showMaxLabel","series"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/getOption.ts"],"sourcesContent":["import { COLOR_CONFIG, TOOLTIP_LINE_COLOR_CONFIG, VERTICAL_LINE_COUNT } from './constants';\nimport { tooltipFormatter, xAxisLabelFormatter } from './formatters';\nimport { CurrencyPowerBalance, CurrencyPowerBalanceTimeUnit } from '../../../../gql/types/graphql';\n\nconst getOption = (\n values: CurrencyPowerBalance[],\n timeUnit: CurrencyPowerBalanceTimeUnit,\n isDark: boolean,\n) => {\n const seriesData = values.map(({ currency, power }) => ({\n name: currency,\n type: 'line',\n symbol: 'circle',\n showSymbol: false,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\n lineStyle: {\n color: COLOR_CONFIG[currency],\n },\n data: power.map(({ point, price }) => [point, price]),\n }));\n\n const legendData = values.map(({ currency }) => ({\n name: currency,\n itemStyle: {\n color: COLOR_CONFIG[currency],\n },\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 ? TOOLTIP_LINE_COLOR_CONFIG.DARK : TOOLTIP_LINE_COLOR_CONFIG.LIGHT,\n },\n },\n formatter: tooltipFormatter,\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 margin: 10,\n showMinLabel: false,\n rotate: -45,\n interval: Math.round(seriesData[0].data.length / VERTICAL_LINE_COUNT),\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 },\n },\n series: seriesData,\n };\n};\n\nexport { getOption };\n"],"mappings":"AAAA,SAASA,YAAY,EAAEC,yBAAyB,EAAEC,mBAAmB,QAAQ,aAAa;AAC1F,SAASC,gBAAgB,EAAEC,mBAAmB,QAAQ,cAAc;AAGpE,MAAMC,SAAS,GAAGA,CAChBC,MAA8B,EAC9BC,QAAsC,EACtCC,MAAe,KACZ;EACH,MAAMC,UAAU,GAAGH,MAAM,CAACI,GAAG,CAACC,IAAA;IAAA,IAAC;MAAEC,QAAQ;MAAEC;IAAM,CAAC,GAAAF,IAAA;IAAA,OAAM;MACtDG,IAAI,EAAEF,QAAQ;MACdG,IAAI,EAAE,MAAM;MACZC,MAAM,EAAE,QAAQ;MAChBC,UAAU,EAAE,KAAK;MACjBC,SAAS,EAAE;QACTC,KAAK,EAAEnB,YAAY,CAACY,QAAQ;MAC9B,CAAC;MACDQ,SAAS,EAAE;QACTD,KAAK,EAAEnB,YAAY,CAACY,QAAQ;MAC9B,CAAC;MACDS,IAAI,EAAER,KAAK,CAACH,GAAG,CAACY,KAAA;QAAA,IAAC;UAAEC,KAAK;UAAEC;QAAM,CAAC,GAAAF,KAAA;QAAA,OAAK,CAACC,KAAK,EAAEC,KAAK,CAAC;MAAA;IACtD,CAAC;EAAA,CAAC,CAAC;EAEH,MAAMC,UAAU,GAAGnB,MAAM,CAACI,GAAG,CAACgB,KAAA;IAAA,IAAC;MAAEd;IAAS,CAAC,GAAAc,KAAA;IAAA,OAAM;MAC/CZ,IAAI,EAAEF,QAAQ;MACdM,SAAS,EAAE;QACTC,KAAK,EAAEnB,YAAY,CAACY,QAAQ;MAC9B;IACF,CAAC;EAAA,CAAC,CAAC;EAEH,OAAO;IACLe,SAAS,EAAE,KAAK;IAChBC,MAAM,EAAE;MACNP,IAAI,EAAEI,UAAU;MAChBI,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;QACJf,SAAS,EAAE;UACTD,KAAK,EAAEX,MAAM,GAAGP,yBAAyB,CAACmC,IAAI,GAAGnC,yBAAyB,CAACoC;QAC7E;MACF,CAAC;MACDC,SAAS,EAAEnC;IACb,CAAC;IACDoC,KAAK,EAAE;MACLxB,IAAI,EAAE,UAAU;MAChByB,QAAQ,EAAE;QACRC,IAAI,EAAE;MACR,CAAC;MACDC,QAAQ,EAAE;QAAED,IAAI,EAAE;MAAM,CAAC;MACzBE,SAAS,EAAE;QACTF,IAAI,EAAE;MACR,CAAC;MACDG,SAAS,EAAE;QACTC,MAAM,EAAE,EAAE;QACVC,YAAY,EAAE,KAAK;QACnBC,MAAM,EAAE,CAAC,EAAE;QACXC,QAAQ,EAAEC,IAAI,CAACC,KAAK,CAACzC,UAAU,CAAC,CAAC,CAAC,CAACY,IAAI,CAAC8B,MAAM,GAAGjD,mBAAmB,CAAC;QACrEoC,SAAS,EAAGc,KAAa,IAAKhD,mBAAmB,CAACgD,KAAK,EAAE7C,QAAQ;MACnE;IACF,CAAC;IACD8C,KAAK,EAAE;MACLtC,IAAI,EAAE,OAAO;MACbuC,QAAQ,EAAE,OAAO;MACjBC,WAAW,EAAE,CAAC;MACdb,QAAQ,EAAE;QAAED,IAAI,EAAE;MAAM,CAAC;MACzBD,QAAQ,EAAE;QAAEC,IAAI,EAAE;MAAM,CAAC;MACzBe,WAAW,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC;MAC3BZ,SAAS,EAAE;QACTa,YAAY,EAAE,KAAK;QACnBX,YAAY,EAAE;MAChB;IACF,CAAC;IACDY,MAAM,EAAEjD;EACV,CAAC;AACH,CAAC;AAED,SAASJ,SAAS"}
|
package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/getResponsiveOption.js
ADDED
|
@@ -0,0 +1,30 @@
|
|
|
1
|
+
import { getGridLines } from '@oanda/labs-widget-common';
|
|
2
|
+
import { CHART_HEIGHT, CHART_WIDTH, LEGEND_HEIGHT, LEGEND_HEIGHT_MOBILE, X_LABEL_SIZE, X_LABEL_SIZE_MOBILE, Y_LABEL_SIZE, Y_LABEL_SIZE_MOBILE } from './constants';
|
|
3
|
+
const getResponsiveOption = (isDesktop, isMobile, isDark) => {
|
|
4
|
+
const baseGridLines = getGridLines({
|
|
5
|
+
isDark,
|
|
6
|
+
chartWidth: CHART_WIDTH,
|
|
7
|
+
chartHeight: CHART_HEIGHT,
|
|
8
|
+
xLabelsSize: isMobile ? X_LABEL_SIZE_MOBILE : X_LABEL_SIZE,
|
|
9
|
+
yLabelSize: isMobile ? Y_LABEL_SIZE_MOBILE : Y_LABEL_SIZE,
|
|
10
|
+
bottomLeftBox: isDesktop,
|
|
11
|
+
marginBottom: isMobile ? LEGEND_HEIGHT_MOBILE : LEGEND_HEIGHT
|
|
12
|
+
});
|
|
13
|
+
return {
|
|
14
|
+
yAxis: {
|
|
15
|
+
axisLabel: {
|
|
16
|
+
margin: isDesktop ? 8 : 6
|
|
17
|
+
}
|
|
18
|
+
},
|
|
19
|
+
grid: [{
|
|
20
|
+
name: 'main-grid',
|
|
21
|
+
top: '0px',
|
|
22
|
+
left: '0px',
|
|
23
|
+
right: "".concat(isMobile ? Y_LABEL_SIZE_MOBILE : Y_LABEL_SIZE, "px"),
|
|
24
|
+
bottom: "".concat(isMobile ? X_LABEL_SIZE_MOBILE : X_LABEL_SIZE, "px")
|
|
25
|
+
}],
|
|
26
|
+
graphic: [...baseGridLines]
|
|
27
|
+
};
|
|
28
|
+
};
|
|
29
|
+
export { getResponsiveOption };
|
|
30
|
+
//# sourceMappingURL=getResponsiveOption.js.map
|
package/dist/module/CurrencyPowerBalanceWidget/components/Chart/options/getResponsiveOption.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"getResponsiveOption.js","names":["getGridLines","CHART_HEIGHT","CHART_WIDTH","LEGEND_HEIGHT","LEGEND_HEIGHT_MOBILE","X_LABEL_SIZE","X_LABEL_SIZE_MOBILE","Y_LABEL_SIZE","Y_LABEL_SIZE_MOBILE","getResponsiveOption","isDesktop","isMobile","isDark","baseGridLines","chartWidth","chartHeight","xLabelsSize","yLabelSize","bottomLeftBox","marginBottom","yAxis","axisLabel","margin","grid","name","top","left","right","concat","bottom","graphic"],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/getResponsiveOption.ts"],"sourcesContent":["import { getGridLines } from '@oanda/labs-widget-common';\nimport {\n CHART_HEIGHT,\n CHART_WIDTH,\n LEGEND_HEIGHT,\n LEGEND_HEIGHT_MOBILE,\n X_LABEL_SIZE,\n X_LABEL_SIZE_MOBILE,\n Y_LABEL_SIZE,\n Y_LABEL_SIZE_MOBILE,\n} from './constants';\n\nconst getResponsiveOption = (isDesktop: boolean, isMobile: boolean, isDark: boolean) => {\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: isDesktop,\n marginBottom: isMobile ? LEGEND_HEIGHT_MOBILE : LEGEND_HEIGHT,\n });\n\n return {\n yAxis: {\n axisLabel: {\n margin: isDesktop ? 8 : 6,\n },\n },\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: [\n ...baseGridLines,\n ],\n };\n};\n\nexport { getResponsiveOption };\n"],"mappings":"AAAA,SAASA,YAAY,QAAQ,2BAA2B;AACxD,SACEC,YAAY,EACZC,WAAW,EACXC,aAAa,EACbC,oBAAoB,EACpBC,YAAY,EACZC,mBAAmB,EACnBC,YAAY,EACZC,mBAAmB,QACd,aAAa;AAEpB,MAAMC,mBAAmB,GAAGA,CAACC,SAAkB,EAAEC,QAAiB,EAAEC,MAAe,KAAK;EACtF,MAAMC,aAAa,GAAGb,YAAY,CAAC;IACjCY,MAAM;IACNE,UAAU,EAAEZ,WAAW;IACvBa,WAAW,EAAEd,YAAY;IACzBe,WAAW,EAAEL,QAAQ,GAAGL,mBAAmB,GAAGD,YAAY;IAC1DY,UAAU,EAAEN,QAAQ,GAAGH,mBAAmB,GAAGD,YAAY;IACzDW,aAAa,EAAER,SAAS;IACxBS,YAAY,EAAER,QAAQ,GAAGP,oBAAoB,GAAGD;EAClD,CAAC,CAAC;EAEF,OAAO;IACLiB,KAAK,EAAE;MACLC,SAAS,EAAE;QACTC,MAAM,EAAEZ,SAAS,GAAG,CAAC,GAAG;MAC1B;IACF,CAAC;IACDa,IAAI,EAAE,CACJ;MACEC,IAAI,EAAE,WAAW;MACjBC,GAAG,EAAE,KAAK;MACVC,IAAI,EAAE,KAAK;MACXC,KAAK,KAAAC,MAAA,CAAKjB,QAAQ,GAAGH,mBAAmB,GAAGD,YAAY,OAAI;MAC3DsB,MAAM,KAAAD,MAAA,CAAKjB,QAAQ,GAAGL,mBAAmB,GAAGD,YAAY;IAC1D,CAAC,CACF;IACDyB,OAAO,EAAE,CACP,GAAGjB,aAAa;EAEpB,CAAC;AACH,CAAC;AAED,SAASJ,mBAAmB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/index.ts"],"sourcesContent":["export * from './getOption';\nexport * from './getResponsiveOption';\n"],"mappings":"AAAA,cAAc,aAAa;AAC3B,cAAc,uBAAuB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.js","names":[],"sources":["../../../../../../src/CurrencyPowerBalanceWidget/components/Chart/options/types.ts"],"sourcesContent":["export interface TooltipFormatterParams {\n marker: string;\n seriesName: string;\n value: string[]\n}\n"],"mappings":""}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.js","names":[],"sources":["../../../../../src/CurrencyPowerBalanceWidget/components/Chart/types.ts"],"sourcesContent":["import { CurrencyPowerBalance, CurrencyPowerBalanceTimeUnit } from '../../../gql/types/graphql';\n\nexport interface ChartProps {\n values: CurrencyPowerBalance[];\n timeUnit: CurrencyPowerBalanceTimeUnit;\n}\n"],"mappings":""}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { Select } from '@oanda/labs-widget-common';
|
|
3
|
+
const TimeUnitSelect = _ref => {
|
|
4
|
+
let {
|
|
5
|
+
selected,
|
|
6
|
+
options,
|
|
7
|
+
callback
|
|
8
|
+
} = _ref;
|
|
9
|
+
const selectOptions = options.map(_ref2 => {
|
|
10
|
+
let {
|
|
11
|
+
value: id,
|
|
12
|
+
label,
|
|
13
|
+
tooltip
|
|
14
|
+
} = _ref2;
|
|
15
|
+
return {
|
|
16
|
+
id,
|
|
17
|
+
label: tooltip || label
|
|
18
|
+
};
|
|
19
|
+
});
|
|
20
|
+
const [{
|
|
21
|
+
label: selectedLabel
|
|
22
|
+
}] = selectOptions.filter(_ref3 => {
|
|
23
|
+
let {
|
|
24
|
+
id
|
|
25
|
+
} = _ref3;
|
|
26
|
+
return id === selected;
|
|
27
|
+
});
|
|
28
|
+
return React.createElement("div", {
|
|
29
|
+
"data-testid": "time-unit-select",
|
|
30
|
+
className: "lw-mb-6 lw-w-full"
|
|
31
|
+
}, React.createElement(Select, {
|
|
32
|
+
options: selectOptions,
|
|
33
|
+
selectedOption: {
|
|
34
|
+
id: selected,
|
|
35
|
+
label: selectedLabel
|
|
36
|
+
},
|
|
37
|
+
setSelectedOption: _ref4 => {
|
|
38
|
+
let {
|
|
39
|
+
id
|
|
40
|
+
} = _ref4;
|
|
41
|
+
return callback(id);
|
|
42
|
+
}
|
|
43
|
+
}));
|
|
44
|
+
};
|
|
45
|
+
export { TimeUnitSelect };
|
|
46
|
+
//# sourceMappingURL=TimeUnitSelect.js.map
|
package/dist/module/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSelect.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TimeUnitSelect.js","names":["React","Select","TimeUnitSelect","_ref","selected","options","callback","selectOptions","map","_ref2","value","id","label","tooltip","selectedLabel","filter","_ref3","createElement","className","selectedOption","setSelectedOption","_ref4"],"sources":["../../../../../src/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSelect.tsx"],"sourcesContent":["import React from 'react';\nimport { Select } from '@oanda/labs-widget-common';\nimport { TimeUnitSwitchProps } from './types';\nimport { CurrencyPowerBalanceTimeUnit } from '../../../gql/types/graphql';\n\nconst TimeUnitSelect = ({\n selected, options, callback,\n}: TimeUnitSwitchProps) => {\n const selectOptions = options\n .map(({ value: id, label, tooltip }) => ({ id, label: tooltip || label }));\n const [{ label: selectedLabel }] = selectOptions.filter(({ id }) => id === selected);\n\n return (\n <div data-testid=\"time-unit-select\" className=\"lw-mb-6 lw-w-full\">\n <Select\n options={selectOptions}\n selectedOption={{ id: selected, label: selectedLabel }}\n setSelectedOption={({ id }) => callback(id as CurrencyPowerBalanceTimeUnit)}\n />\n </div>\n );\n};\n\nexport { TimeUnitSelect };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,MAAM,QAAQ,2BAA2B;AAIlD,MAAMC,cAAc,GAAGC,IAAA,IAEI;EAAA,IAFH;IACtBC,QAAQ;IAAEC,OAAO;IAAEC;EACA,CAAC,GAAAH,IAAA;EACpB,MAAMI,aAAa,GAAGF,OAAO,CAC1BG,GAAG,CAACC,KAAA;IAAA,IAAC;MAAEC,KAAK,EAAEC,EAAE;MAAEC,KAAK;MAAEC;IAAQ,CAAC,GAAAJ,KAAA;IAAA,OAAM;MAAEE,EAAE;MAAEC,KAAK,EAAEC,OAAO,IAAID;IAAM,CAAC;EAAA,CAAC,CAAC;EAC5E,MAAM,CAAC;IAAEA,KAAK,EAAEE;EAAc,CAAC,CAAC,GAAGP,aAAa,CAACQ,MAAM,CAACC,KAAA;IAAA,IAAC;MAAEL;IAAG,CAAC,GAAAK,KAAA;IAAA,OAAKL,EAAE,KAAKP,QAAQ;EAAA,EAAC;EAEpF,OACEJ,KAAA,CAAAiB,aAAA;IAAK,eAAY,kBAAkB;IAACC,SAAS,EAAC;EAAmB,GAC/DlB,KAAA,CAAAiB,aAAA,CAAChB,MAAM;IACLI,OAAO,EAAEE,aAAc;IACvBY,cAAc,EAAE;MAAER,EAAE,EAAEP,QAAQ;MAAEQ,KAAK,EAAEE;IAAc,CAAE;IACvDM,iBAAiB,EAAEC,KAAA;MAAA,IAAC;QAAEV;MAAG,CAAC,GAAAU,KAAA;MAAA,OAAKf,QAAQ,CAACK,EAAkC,CAAC;IAAA;EAAC,CAC7E,CACE,CAAC;AAEV,CAAC;AAED,SAAST,cAAc"}
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { Button, ButtonSize, ButtonVariant } from '@oanda/labs-widget-common';
|
|
3
|
+
import { useMediaQuery } from 'usehooks-ts';
|
|
4
|
+
import { CURRENCY_POWER_BALANCE_TOOLTIP_ID } from '../../constants';
|
|
5
|
+
import { TimeUnitSelect } from './TimeUnitSelect';
|
|
6
|
+
const TimeUnitSwitch = _ref => {
|
|
7
|
+
let {
|
|
8
|
+
selected,
|
|
9
|
+
options,
|
|
10
|
+
callback,
|
|
11
|
+
labelCallback
|
|
12
|
+
} = _ref;
|
|
13
|
+
const isDesktop = useMediaQuery('(min-width: 768px)');
|
|
14
|
+
const handleButtonClick = e => {
|
|
15
|
+
callback(e.currentTarget.value);
|
|
16
|
+
};
|
|
17
|
+
return React.createElement(React.Fragment, null, isDesktop ? React.createElement("div", {
|
|
18
|
+
"data-testid": "time-unit-switch",
|
|
19
|
+
className: "lw-mb-6 lw-flex lw-gap-1 lw-self-end"
|
|
20
|
+
}, options.map(item => {
|
|
21
|
+
const tooltip = labelCallback && item.tooltip ? labelCallback(item.tooltip) : item.tooltip;
|
|
22
|
+
const label = labelCallback ? labelCallback(item.label) : item.label;
|
|
23
|
+
return React.createElement(Button, {
|
|
24
|
+
key: item.value,
|
|
25
|
+
size: ButtonSize.full,
|
|
26
|
+
variant: selected === item.value ? ButtonVariant.primary : ButtonVariant.secondary,
|
|
27
|
+
onClick: handleButtonClick,
|
|
28
|
+
value: item.value,
|
|
29
|
+
"data-tooltip-id": CURRENCY_POWER_BALANCE_TOOLTIP_ID,
|
|
30
|
+
"data-tooltip-content": tooltip
|
|
31
|
+
}, label);
|
|
32
|
+
})) : React.createElement(TimeUnitSelect, {
|
|
33
|
+
selected: selected,
|
|
34
|
+
callback: callback,
|
|
35
|
+
options: options
|
|
36
|
+
}));
|
|
37
|
+
};
|
|
38
|
+
export { TimeUnitSwitch };
|
|
39
|
+
//# sourceMappingURL=TimeUnitSwitch.js.map
|
package/dist/module/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"TimeUnitSwitch.js","names":["React","Button","ButtonSize","ButtonVariant","useMediaQuery","CURRENCY_POWER_BALANCE_TOOLTIP_ID","TimeUnitSelect","TimeUnitSwitch","_ref","selected","options","callback","labelCallback","isDesktop","handleButtonClick","e","currentTarget","value","createElement","Fragment","className","map","item","tooltip","label","key","size","full","variant","primary","secondary","onClick"],"sources":["../../../../../src/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.tsx"],"sourcesContent":["import React from 'react';\nimport { Button, ButtonSize, ButtonVariant } from '@oanda/labs-widget-common';\nimport { useMediaQuery } from 'usehooks-ts';\nimport { TimeUnitSwitchProps } from './types';\nimport { CurrencyPowerBalanceTimeUnit } from '../../../gql/types/graphql';\nimport { CURRENCY_POWER_BALANCE_TOOLTIP_ID } from '../../constants';\nimport { TimeUnitSelect } from './TimeUnitSelect';\n\nconst TimeUnitSwitch = ({\n selected, options, callback, labelCallback,\n}: TimeUnitSwitchProps) => {\n const isDesktop = useMediaQuery('(min-width: 768px)');\n\n const handleButtonClick = (e: React.SyntheticEvent<HTMLButtonElement>) => {\n callback(e.currentTarget.value as CurrencyPowerBalanceTimeUnit);\n };\n\n return (\n <>\n {isDesktop\n ? (\n <div data-testid=\"time-unit-switch\" className=\"lw-mb-6 lw-flex lw-gap-1 lw-self-end\">\n {options.map((item) => {\n const tooltip = labelCallback && item.tooltip\n ? labelCallback(item.tooltip)\n : item.tooltip;\n const label = labelCallback ? labelCallback(item.label) : item.label;\n\n return (\n <Button\n key={item.value}\n size={ButtonSize.full}\n variant={selected === item.value\n ? ButtonVariant.primary\n : ButtonVariant.secondary}\n onClick={handleButtonClick}\n value={item.value}\n data-tooltip-id={CURRENCY_POWER_BALANCE_TOOLTIP_ID}\n data-tooltip-content={tooltip}\n >\n {label}\n </Button>\n );\n })}\n </div>\n )\n : (\n <TimeUnitSelect\n selected={selected}\n callback={callback}\n options={options}\n />\n )}\n </>\n );\n};\n\nexport { TimeUnitSwitch };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,MAAM,EAAEC,UAAU,EAAEC,aAAa,QAAQ,2BAA2B;AAC7E,SAASC,aAAa,QAAQ,aAAa;AAG3C,SAASC,iCAAiC,QAAQ,iBAAiB;AACnE,SAASC,cAAc,QAAQ,kBAAkB;AAEjD,MAAMC,cAAc,GAAGC,IAAA,IAEI;EAAA,IAFH;IACtBC,QAAQ;IAAEC,OAAO;IAAEC,QAAQ;IAAEC;EACV,CAAC,GAAAJ,IAAA;EACpB,MAAMK,SAAS,GAAGT,aAAa,CAAC,oBAAoB,CAAC;EAErD,MAAMU,iBAAiB,GAAIC,CAA0C,IAAK;IACxEJ,QAAQ,CAACI,CAAC,CAACC,aAAa,CAACC,KAAqC,CAAC;EACjE,CAAC;EAED,OACEjB,KAAA,CAAAkB,aAAA,CAAAlB,KAAA,CAAAmB,QAAA,QACGN,SAAS,GAENb,KAAA,CAAAkB,aAAA;IAAK,eAAY,kBAAkB;IAACE,SAAS,EAAC;EAAsC,GACjFV,OAAO,CAACW,GAAG,CAAEC,IAAI,IAAK;IACrB,MAAMC,OAAO,GAAGX,aAAa,IAAIU,IAAI,CAACC,OAAO,GACzCX,aAAa,CAACU,IAAI,CAACC,OAAO,CAAC,GAC3BD,IAAI,CAACC,OAAO;IAChB,MAAMC,KAAK,GAAGZ,aAAa,GAAGA,aAAa,CAACU,IAAI,CAACE,KAAK,CAAC,GAAGF,IAAI,CAACE,KAAK;IAEpE,OACExB,KAAA,CAAAkB,aAAA,CAACjB,MAAM;MACLwB,GAAG,EAAEH,IAAI,CAACL,KAAM;MAChBS,IAAI,EAAExB,UAAU,CAACyB,IAAK;MACtBC,OAAO,EAAEnB,QAAQ,KAAKa,IAAI,CAACL,KAAK,GAC5Bd,aAAa,CAAC0B,OAAO,GACrB1B,aAAa,CAAC2B,SAAU;MAC5BC,OAAO,EAAEjB,iBAAkB;MAC3BG,KAAK,EAAEK,IAAI,CAACL,KAAM;MAClB,mBAAiBZ,iCAAkC;MACnD,wBAAsBkB;IAAQ,GAE7BC,KACK,CAAC;EAEb,CAAC,CACE,CAAC,GAGNxB,KAAA,CAAAkB,aAAA,CAACZ,cAAc;IACbG,QAAQ,EAAEA,QAAS;IACnBE,QAAQ,EAAEA,QAAS;IACnBD,OAAO,EAAEA;EAAQ,CAClB,CAEL,CAAC;AAEP,CAAC;AAED,SAASH,cAAc"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/index.ts"],"sourcesContent":["export * from './TimeUnitSwitch';\n"],"mappings":"AAAA,cAAc,kBAAkB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"types.js","names":[],"sources":["../../../../../src/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/types.ts"],"sourcesContent":["import { CurrencyPowerBalanceTimeUnit } from '../../../gql/types/graphql';\n\nexport interface TimeUnitOption {\n value: CurrencyPowerBalanceTimeUnit;\n label: string;\n tooltip?: string;\n}\n\nexport interface TimeUnitSwitchProps {\n selected: CurrencyPowerBalanceTimeUnit;\n options: TimeUnitOption[];\n callback: (value: CurrencyPowerBalanceTimeUnit) => void;\n labelCallback?: (value: string) => string;\n}\n"],"mappings":""}
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import { CurrencyPowerBalanceTimeUnit } from '../gql/types/graphql';
|
|
2
|
+
const timeUnitConfig = [{
|
|
3
|
+
value: CurrencyPowerBalanceTimeUnit.M3,
|
|
4
|
+
label: '3m',
|
|
5
|
+
tooltip: '3_months'
|
|
6
|
+
}, {
|
|
7
|
+
value: CurrencyPowerBalanceTimeUnit.M1,
|
|
8
|
+
label: '1m',
|
|
9
|
+
tooltip: '1_month'
|
|
10
|
+
}, {
|
|
11
|
+
value: CurrencyPowerBalanceTimeUnit.W1,
|
|
12
|
+
label: '1w',
|
|
13
|
+
tooltip: '1_week'
|
|
14
|
+
}, {
|
|
15
|
+
value: CurrencyPowerBalanceTimeUnit.H24,
|
|
16
|
+
label: '24h',
|
|
17
|
+
tooltip: '24_months'
|
|
18
|
+
}, {
|
|
19
|
+
value: CurrencyPowerBalanceTimeUnit.H8,
|
|
20
|
+
label: '8h',
|
|
21
|
+
tooltip: '8_hours'
|
|
22
|
+
}, {
|
|
23
|
+
value: CurrencyPowerBalanceTimeUnit.H4,
|
|
24
|
+
label: '4h',
|
|
25
|
+
tooltip: '4_hours'
|
|
26
|
+
}, {
|
|
27
|
+
value: CurrencyPowerBalanceTimeUnit.PreviousDay,
|
|
28
|
+
label: 'Previous Business Day'
|
|
29
|
+
}, {
|
|
30
|
+
value: CurrencyPowerBalanceTimeUnit.CurrentDay,
|
|
31
|
+
label: 'Current Business Day'
|
|
32
|
+
}];
|
|
33
|
+
export { timeUnitConfig };
|
|
34
|
+
//# sourceMappingURL=config.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"config.js","names":["CurrencyPowerBalanceTimeUnit","timeUnitConfig","value","M3","label","tooltip","M1","W1","H24","H8","H4","PreviousDay","CurrentDay"],"sources":["../../../src/CurrencyPowerBalanceWidget/config.ts"],"sourcesContent":["import { CurrencyPowerBalanceTimeUnit } from '../gql/types/graphql';\n\nconst timeUnitConfig = [\n {\n value: CurrencyPowerBalanceTimeUnit.M3,\n label: '3m',\n tooltip: '3_months',\n },\n {\n value: CurrencyPowerBalanceTimeUnit.M1,\n label: '1m',\n tooltip: '1_month',\n },\n {\n value: CurrencyPowerBalanceTimeUnit.W1,\n label: '1w',\n tooltip: '1_week',\n },\n {\n value: CurrencyPowerBalanceTimeUnit.H24,\n label: '24h',\n tooltip: '24_months',\n },\n { value: CurrencyPowerBalanceTimeUnit.H8, label: '8h', tooltip: '8_hours' },\n { value: CurrencyPowerBalanceTimeUnit.H4, label: '4h', tooltip: '4_hours' },\n { value: CurrencyPowerBalanceTimeUnit.PreviousDay, label: 'Previous Business Day' },\n { value: CurrencyPowerBalanceTimeUnit.CurrentDay, label: 'Current Business Day' },\n];\n\nexport { timeUnitConfig };\n"],"mappings":"AAAA,SAASA,4BAA4B,QAAQ,sBAAsB;AAEnE,MAAMC,cAAc,GAAG,CACrB;EACEC,KAAK,EAAEF,4BAA4B,CAACG,EAAE;EACtCC,KAAK,EAAE,IAAI;EACXC,OAAO,EAAE;AACX,CAAC,EACD;EACEH,KAAK,EAAEF,4BAA4B,CAACM,EAAE;EACtCF,KAAK,EAAE,IAAI;EACXC,OAAO,EAAE;AACX,CAAC,EACD;EACEH,KAAK,EAAEF,4BAA4B,CAACO,EAAE;EACtCH,KAAK,EAAE,IAAI;EACXC,OAAO,EAAE;AACX,CAAC,EACD;EACEH,KAAK,EAAEF,4BAA4B,CAACQ,GAAG;EACvCJ,KAAK,EAAE,KAAK;EACZC,OAAO,EAAE;AACX,CAAC,EACD;EAAEH,KAAK,EAAEF,4BAA4B,CAACS,EAAE;EAAEL,KAAK,EAAE,IAAI;EAAEC,OAAO,EAAE;AAAU,CAAC,EAC3E;EAAEH,KAAK,EAAEF,4BAA4B,CAACU,EAAE;EAAEN,KAAK,EAAE,IAAI;EAAEC,OAAO,EAAE;AAAU,CAAC,EAC3E;EAAEH,KAAK,EAAEF,4BAA4B,CAACW,WAAW;EAAEP,KAAK,EAAE;AAAwB,CAAC,EACnF;EAAEF,KAAK,EAAEF,4BAA4B,CAACY,UAAU;EAAER,KAAK,EAAE;AAAuB,CAAC,CAClF;AAED,SAASH,cAAc"}
|