@oanda/labs-currency-power-balance-widget 1.0.111 → 1.0.112

package/CHANGELOG.md

@@ -3,6 +3,458 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 1.0.112 (2024-12-11)
+
+
+
+## 1.0.172 (2024-11-29)
+
+
+
+## 1.0.171 (2024-11-28)
+
+
+
+## 1.0.170 (2024-11-28)
+
+
+
+## 1.0.169 (2024-11-20)
+
+
+
+## 1.0.168 (2024-11-19)
+
+
+
+## 1.0.167 (2024-10-14)
+
+
+
+## 1.0.166 (2024-10-07)
+
+
+
+## 1.0.165 (2024-10-03)
+
+
+
+## 1.0.164 (2024-09-26)
+
+
+
+## 1.0.163 (2024-09-18)
+
+
+
+## 1.0.162 (2024-09-12)
+
+
+
+## 1.0.161 (2024-09-11)
+
+
+
+## 1.0.160 (2024-09-10)
+
+
+
+## 1.0.159 (2024-09-09)
+
+
+
+## 1.0.158 (2024-09-04)
+
+
+
+## 1.0.157 (2024-09-04)
+
+
+
+## 1.0.156 (2024-09-02)
+
+
+
+## 1.0.155 (2024-08-29)
+
+
+
+## 1.0.154 (2024-08-29)
+
+
+
+## 1.0.153 (2024-08-23)
+
+
+
+## 1.0.152 (2024-08-23)
+
+
+
+## 1.0.151 (2024-08-20)
+
+
+
+## 1.0.150 (2024-08-19)
+
+
+
+## 1.0.149 (2024-08-07)
+
+
+
+## 1.0.148 (2024-08-01)
+
+
+
+## 1.0.147 (2024-08-01)
+
+
+
+## 1.0.146 (2024-07-26)
+
+
+
+## 1.0.145 (2024-07-25)
+
+
+
+## 1.0.144 (2024-07-22)
+
+
+
+## 1.0.143 (2024-07-19)
+
+
+
+## 1.0.142 (2024-07-16)
+
+
+
+## 1.0.141 (2024-07-16)
+
+
+
+## 1.0.140 (2024-07-12)
+
+
+
+## 1.0.139 (2024-07-12)
+
+
+
+## 1.0.138 (2024-07-10)
+
+
+
+## 1.0.137 (2024-07-05)
+
+
+
+## 1.0.136 (2024-07-03)
+
+
+
+## 1.0.135 (2024-07-03)
+
+
+
+## 1.0.134 (2024-07-03)
+
+
+
+## 1.0.133 (2024-06-28)
+
+
+
+## 1.0.132 (2024-06-27)
+
+
+
+## 1.0.131 (2024-06-27)
+
+
+
+## 1.0.130 (2024-06-26)
+
+
+
+## 1.0.129 (2024-06-17)
+
+
+
+## 1.0.128 (2024-06-17)
+
+
+
+## 1.0.127 (2024-06-10)
+
+
+
+## 1.0.126 (2024-05-29)
+
+
+
+## 1.0.125 (2024-05-29)
+
+
+
+## 1.0.124 (2024-05-29)
+
+
+
+## 1.0.123 (2024-05-28)
+
+
+
+## 1.0.122 (2024-05-27)
+
+
+
+## 1.0.121 (2024-05-27)
+
+
+
+## 1.0.120 (2024-05-24)
+
+
+
+## 1.0.119 (2024-05-17)
+
+
+
+## 1.0.118 (2024-05-09)
+
+
+
+## 1.0.117 (2024-05-07)
+
+
+
+## 1.0.116 (2024-04-23)
+
+
+
+## 1.0.115 (2024-04-22)
+
+
+
+## 1.0.114 (2024-04-19)
+
+
+
+## 1.0.113 (2024-04-19)
+
+
+
+## 1.0.112 (2024-04-15)
+
+
+
+## 1.0.111 (2024-04-11)
+
+
+
+## 1.0.110 (2024-04-05)
+
+
+
+## 1.0.109 (2024-04-05)
+
+
+
+## 1.0.108 (2024-04-04)
+
+
+
+## 1.0.107 (2024-04-03)
+
+
+
+## 1.0.106 (2024-03-29)
+
+
+
+## 1.0.105 (2024-03-28)
+
+
+
+## 1.0.104 (2024-03-21)
+
+
+
+## 1.0.103 (2024-03-20)
+
+
+
+## 1.0.102 (2024-03-20)
+
+
+
+## 1.0.101 (2024-03-13)
+
+
+
+## 1.0.100 (2024-03-12)
+
+
+
+## 1.0.99 (2024-03-11)
+
+
+
+## 1.0.98 (2024-03-07)
+
+
+
+## 1.0.97 (2024-03-06)
+
+
+
+## 1.0.96 (2024-03-06)
+
+
+
+## 1.0.95 (2024-03-04)
+
+
+
+## 1.0.94 (2024-02-29)
+
+
+
+## 1.0.93 (2024-02-28)
+
+
+
+## 1.0.92 (2024-02-28)
+
+
+
+## 1.0.91 (2024-02-23)
+
+
+
+## 1.0.90 (2024-02-23)
+
+
+
+## 1.0.89 (2024-02-21)
+
+
+
+## 1.0.88 (2024-02-21)
+
+
+
+## 1.0.87 (2024-02-20)
+
+
+
+## 1.0.86 (2024-02-20)
+
+
+
+## 1.0.85 (2024-02-13)
+
+
+
+## 1.0.84 (2024-02-13)
+
+
+
+## 1.0.83 (2024-02-09)
+
+
+
+## 1.0.82 (2024-02-05)
+
+
+
+## 1.0.81 (2024-02-05)
+
+
+
+## 1.0.80 (2024-02-05)
+
+
+
+## 1.0.79 (2024-02-05)
+
+
+
+## 1.0.78 (2024-01-30)
+
+
+
+## 1.0.77 (2024-01-25)
+
+
+
+## 1.0.76 (2024-01-25)
+
+
+
+## 1.0.75 (2024-01-22)
+
+
+
+## 1.0.74 (2024-01-22)
+
+
+
+## 1.0.73 (2024-01-22)
+
+
+
+## 1.0.72 (2024-01-19)
+
+
+
+## 1.0.71 (2024-01-18)
+
+
+
+## 1.0.70 (2024-01-17)
+
+
+
+## 1.0.69 (2024-01-17)
+
+
+
+## 1.0.68 (2024-01-15)
+
+
+
+## 1.0.67 (2024-01-15)
+
+
+
+## 1.0.66 (2024-01-12)
+
+
+
+## 1.0.65 (2024-01-11)
+
+
+
+## 1.0.64 (2024-01-11)
+
+
+
+## 1.0.63 (2024-01-11)
+
+
+
+## 1.0.62 (2024-01-10)
+
+**Note:** Version bump only for package @oanda/labs-currency-power-balance-widget
+
+
+
+
+
 ## 1.0.111 (2024-11-29)
 
 

package/dist/main/CurrencyPowerBalanceWidget/ChartWithData.js

@@ -4,15 +4,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.ChartWithData = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _client = require("@apollo/client");
 var _monoI18n = require("@oanda/mono-i18n");
 var _labsWidgetCommon = require("@oanda/labs-widget-common");
 var _Chart = require("./components/Chart");
 var _constants = require("./constants");
 var _getCurrencyPowerBalance = require("../gql/getCurrencyPowerBalance");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const ChartWithData = _ref => {
   let {
     timeUnit,
@@ -20,7 +19,7 @@ const ChartWithData = _ref => {
   } = _ref;
   const {
     size
-  } = (0, _react.useContext)(_labsWidgetCommon.ThemeContext);
+  } = (0, _labsWidgetCommon.useLayoutProvider)();
   const isDesktop = size === _labsWidgetCommon.Size.DESKTOP;
   const {
     lang

package/dist/main/CurrencyPowerBalanceWidget/ChartWithData.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChartWithData.js","names":["_react","_interopRequireWildcard","require","_client","_monoI18n","_labsWidgetCommon","_Chart","_constants","_getCurrencyPowerBalance","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ChartWithData","_ref","timeUnit","currencies","size","useContext","ThemeContext","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","timestamp","updatedAt","labelCallback","exports"],"sources":["../../../src/CurrencyPowerBalanceWidget/ChartWithData.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport { useQuery } from '@apollo/client';\nimport { useLocale } from '@oanda/mono-i18n';\nimport {\n  ChartError, Spinner, SpinnerSize, ThemeContext, Tooltip, Size,\n  LastUpdated,\n} from '@oanda/labs-widget-common';\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, currencies }: ChartWithDataProps) => {\n  const { size } = useContext(ThemeContext);\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 = data?.currencyPowerBalance?.length === 0 || error\n    || (currencies && (currencies.length === 0 || currencies.length === 1));\n\n  return (\n    <>\n      {loading\n      && (\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 values={data?.currencyPowerBalance!} timeUnit={timeUnit} currencies={currencies} />\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            timestamp={data?.currencyPowerBalance![0]?.updatedAt}\n            labelCallback={lang}\n          />\n        )}\n      </div>\n    </>\n  );\n};\n\nexport { ChartWithData };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ChartWithData.js","names":["_react","_interopRequireDefault","require","_client","_monoI18n","_labsWidgetCommon","_Chart","_constants","_getCurrencyPowerBalance","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","timestamp","updatedAt","labelCallback","exports"],"sources":["../../../src/CurrencyPowerBalanceWidget/ChartWithData.tsx"],"sourcesContent":["import React from 'react';\nimport { useQuery } from '@apollo/client';\nimport { useLocale } from '@oanda/mono-i18n';\nimport {\n  ChartError, Spinner, SpinnerSize, useLayoutProvider, Tooltip, Size,\n  LastUpdated,\n} from '@oanda/labs-widget-common';\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, 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 = data?.currencyPowerBalance?.length === 0 || error\n    || (currencies && (currencies.length === 0 || currencies.length === 1));\n\n  return (\n    <>\n      {loading\n      && (\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 values={data?.currencyPowerBalance!} timeUnit={timeUnit} currencies={currencies} />\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            timestamp={data?.currencyPowerBalance![0]?.updatedAt}\n            labelCallback={lang}\n          />\n        )}\n      </div>\n    </>\n  );\n};\n\nexport { ChartWithData };\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,SAAA,GAAAF,OAAA;AACA,IAAAG,iBAAA,GAAAH,OAAA;AAIA,IAAAI,MAAA,GAAAJ,OAAA;AACA,IAAAK,UAAA,GAAAL,OAAA;AACA,IAAAM,wBAAA,GAAAN,OAAA;AAAyE,SAAAD,uBAAAQ,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAIzE,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,GAAGN,IAAI,EAAEO,oBAAoB,EAAEC,MAAM,KAAK,CAAC,IAAIP,KAAK,IAC7DV,UAAU,KAAKA,UAAU,CAACiB,MAAM,KAAK,CAAC,IAAIjB,UAAU,CAACiB,MAAM,KAAK,CAAC,CAAE;EAEzE,OACEhC,MAAA,CAAAW,OAAA,CAAAsB,aAAA,CAAAjC,MAAA,CAAAW,OAAA,CAAAuB,QAAA,QACGX,OAAO,IAERvB,MAAA,CAAAW,OAAA,CAAAsB,aAAA;IAAKE,SAAS,EAAC;EAAgH,GAC7HnC,MAAA,CAAAW,OAAA,CAAAsB,aAAA,CAAC5B,iBAAA,CAAA+B,OAAO;IAACpB,IAAI,EAAEqB,6BAAW,CAACC;EAAG,CAAE,CAC7B,CACJ,EACA,CAACf,OAAO,IAAI,CAACO,SAAS,IACrB9B,MAAA,CAAAW,OAAA,CAAAsB,aAAA,CAAC3B,MAAA,CAAAiC,KAAK;IAACC,MAAM,EAAEhB,IAAI,EAAEO,oBAAsB;IAACjB,QAAQ,EAAEA,QAAS;IAACC,UAAU,EAAEA;EAAW,CAAE,CAC1F,EACA,CAACQ,OAAO,IAAIO,SAAS,IACpB9B,MAAA,CAAAW,OAAA,CAAAsB,aAAA;IAAKE,SAAS,EAAC;EAAmG,GAChHnC,MAAA,CAAAW,OAAA,CAAAsB,aAAA,CAAC5B,iBAAA,CAAAoC,UAAU,MAAE,CACV,CACN,EACAvB,SAAS,IAAIlB,MAAA,CAAAW,OAAA,CAAAsB,aAAA,CAAC5B,iBAAA,CAAAqC,OAAO;IAACC,EAAE,EAAEC;EAAkC,CAAE,CAAC,EAChE5C,MAAA,CAAAW,OAAA,CAAAsB,aAAA;IAAKE,SAAS,EAAC;EAAgB,GAC5B,CAACZ,OAAO,IAAI,CAACO,SAAS,IACrB9B,MAAA,CAAAW,OAAA,CAAAsB,aAAA,CAAC5B,iBAAA,CAAAwC,WAAW;IACVC,SAAS,EAAEtB,IAAI,EAAEO,oBAAoB,CAAE,CAAC,CAAC,EAAEgB,SAAU;IACrDC,aAAa,EAAE3B;EAAK,CACrB,CAEA,CACL,CAAC;AAEP,CAAC;AAAC4B,OAAA,CAAArC,aAAA,GAAAA,aAAA","ignoreList":[]}

package/dist/main/CurrencyPowerBalanceWidget/CurrencyPowerBalance.js

@@ -7,7 +7,6 @@ exports.CurrencyPowerBalance = void 0;
 var _react = _interopRequireDefault(require("react"));
 var _client = require("@apollo/client");
 var _labsWidgetCommon = require("@oanda/labs-widget-common");
-var _monoI18n = require("@oanda/mono-i18n");
 var _Main = require("./Main");
 var _translations = require("../translations");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -25,23 +24,19 @@ const CurrencyPowerBalance = _ref => {
     uri: graphqlUrl,
     cache: new _client.InMemoryCache()
   });
-  return _react.default.createElement(_labsWidgetCommon.ThemeProvider, {
+  return _react.default.createElement(_labsWidgetCommon.WidgetProvider, {
+    locale: locale,
+    translations: _translations.translations,
+    client: client,
     theme: theme
-  }, _react.default.createElement(_monoI18n.LocaleProvider, {
-    locale: (0, _labsWidgetCommon.getLocale)(locale),
-    translations: _translations.translations
-  }, _react.default.createElement(_client.ApolloProvider, {
-    client: client
-  }, isParamError ? _react.default.createElement("div", {
-    className: "lw-flex lw-h-[425px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary"
-  }, _react.default.createElement(_labsWidgetCommon.ChartError, null)) : (0, _labsWidgetCommon.renderComponent)({
-    Component: _react.default.createElement(_Main.Main, {
-      timeUnit: timeUnit,
-      currencies: currencies
-    }),
-    logoLink,
-    linkArea: 'logo'
-  }))));
+  }, _react.default.createElement(_labsWidgetCommon.WidgetWrapper, {
+    logoLink: logoLink,
+    linkArea: "logo",
+    isParamError: isParamError
+  }, _react.default.createElement(_Main.Main, {
+    timeUnit: timeUnit,
+    currencies: currencies
+  })));
 };
 exports.CurrencyPowerBalance = CurrencyPowerBalance;
 //# sourceMappingURL=CurrencyPowerBalance.js.map

package/dist/main/CurrencyPowerBalanceWidget/CurrencyPowerBalance.js.map

@@ -1 +1 @@
-{"version":3,"file":"CurrencyPowerBalance.js","names":["_react","_interopRequireDefault","require","_client","_labsWidgetCommon","_monoI18n","_Main","_translations","e","__esModule","default","CurrencyPowerBalance","_ref","graphqlUrl","theme","locale","timeUnit","currencies","isParamError","logoLink","client","ApolloClient","uri","cache","InMemoryCache","createElement","ThemeProvider","LocaleProvider","getLocale","translations","ApolloProvider","className","ChartError","renderComponent","Component","Main","linkArea","exports"],"sources":["../../../src/CurrencyPowerBalanceWidget/CurrencyPowerBalance.tsx"],"sourcesContent":["import React from 'react';\nimport { ApolloClient, InMemoryCache, ApolloProvider } from '@apollo/client';\nimport {\n  ChartError, ThemeProvider, getLocale, renderComponent,\n} from '@oanda/labs-widget-common';\nimport { LocaleProvider } from '@oanda/mono-i18n';\nimport { Main } from './Main';\nimport { CurrencyPowerBalanceConfig } from './types';\nimport { translations } from '../translations';\n\nconst CurrencyPowerBalance = ({\n  graphqlUrl, theme, locale, timeUnit, currencies, isParamError, logoLink,\n}: CurrencyPowerBalanceConfig) => {\n  const client = new ApolloClient({\n    uri: graphqlUrl,\n    cache: new InMemoryCache(),\n  });\n\n  return (\n    <ThemeProvider theme={theme}>\n      <LocaleProvider locale={getLocale(locale)} translations={translations}>\n        <ApolloProvider client={client}>\n          {isParamError ? (\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          ) : renderComponent({\n            Component: <Main timeUnit={timeUnit} currencies={currencies} />,\n            logoLink,\n            linkArea: 'logo',\n          })}\n        </ApolloProvider>\n      </LocaleProvider>\n    </ThemeProvider>\n  );\n};\n\nexport { CurrencyPowerBalance };\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAF,OAAA;AAGA,IAAAG,SAAA,GAAAH,OAAA;AACA,IAAAI,KAAA,GAAAJ,OAAA;AAEA,IAAAK,aAAA,GAAAL,OAAA;AAA+C,SAAAD,uBAAAO,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAE/C,MAAMG,oBAAoB,GAAGC,IAAA,IAEK;EAAA,IAFJ;IAC5BC,UAAU;IAAEC,KAAK;IAAEC,MAAM;IAAEC,QAAQ;IAAEC,UAAU;IAAEC,YAAY;IAAEC;EACrC,CAAC,GAAAP,IAAA;EAC3B,MAAMQ,MAAM,GAAG,IAAIC,oBAAY,CAAC;IAC9BC,GAAG,EAAET,UAAU;IACfU,KAAK,EAAE,IAAIC,qBAAa,CAAC;EAC3B,CAAC,CAAC;EAEF,OACExB,MAAA,CAAAU,OAAA,CAAAe,aAAA,CAACrB,iBAAA,CAAAsB,aAAa;IAACZ,KAAK,EAAEA;EAAM,GAC1Bd,MAAA,CAAAU,OAAA,CAAAe,aAAA,CAACpB,SAAA,CAAAsB,cAAc;IAACZ,MAAM,EAAE,IAAAa,2BAAS,EAACb,MAAM,CAAE;IAACc,YAAY,EAAEA;EAAa,GACpE7B,MAAA,CAAAU,OAAA,CAAAe,aAAA,CAACtB,OAAA,CAAA2B,cAAc;IAACV,MAAM,EAAEA;EAAO,GAC5BF,YAAY,GACXlB,MAAA,CAAAU,OAAA,CAAAe,aAAA;IAAKM,SAAS,EAAC;EAAmG,GAChH/B,MAAA,CAAAU,OAAA,CAAAe,aAAA,CAACrB,iBAAA,CAAA4B,UAAU,MAAE,CACV,CAAC,GACJ,IAAAC,iCAAe,EAAC;IAClBC,SAAS,EAAElC,MAAA,CAAAU,OAAA,CAAAe,aAAA,CAACnB,KAAA,CAAA6B,IAAI;MAACnB,QAAQ,EAAEA,QAAS;MAACC,UAAU,EAAEA;IAAW,CAAE,CAAC;IAC/DE,QAAQ;IACRiB,QAAQ,EAAE;EACZ,CAAC,CACa,CACF,CACH,CAAC;AAEpB,CAAC;AAACC,OAAA,CAAA1B,oBAAA,GAAAA,oBAAA","ignoreList":[]}
+{"version":3,"file":"CurrencyPowerBalance.js","names":["_react","_interopRequireDefault","require","_client","_labsWidgetCommon","_Main","_translations","e","__esModule","default","CurrencyPowerBalance","_ref","graphqlUrl","theme","locale","timeUnit","currencies","isParamError","logoLink","client","ApolloClient","uri","cache","InMemoryCache","createElement","WidgetProvider","translations","WidgetWrapper","linkArea","Main","exports"],"sources":["../../../src/CurrencyPowerBalanceWidget/CurrencyPowerBalance.tsx"],"sourcesContent":["import React from 'react';\nimport { ApolloClient, InMemoryCache } from '@apollo/client';\nimport { WidgetProvider, WidgetWrapper } from '@oanda/labs-widget-common';\nimport { Main } from './Main';\nimport { CurrencyPowerBalanceConfig } from './types';\nimport { translations } from '../translations';\n\nconst CurrencyPowerBalance = ({\n  graphqlUrl, theme, locale, timeUnit, currencies, isParamError, logoLink,\n}: CurrencyPowerBalanceConfig) => {\n  const client = new ApolloClient({\n    uri: graphqlUrl,\n    cache: new InMemoryCache(),\n  });\n\n  return (\n    <WidgetProvider\n      locale={locale}\n      translations={translations}\n      client={client}\n      theme={theme}\n    >\n      <WidgetWrapper\n        logoLink={logoLink}\n        linkArea=\"logo\"\n        isParamError={isParamError}\n      >\n        <Main timeUnit={timeUnit} currencies={currencies} />\n      </WidgetWrapper>\n    </WidgetProvider>\n  );\n};\n\nexport { CurrencyPowerBalance };\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAF,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AAEA,IAAAI,aAAA,GAAAJ,OAAA;AAA+C,SAAAD,uBAAAM,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAE/C,MAAMG,oBAAoB,GAAGC,IAAA,IAEK;EAAA,IAFJ;IAC5BC,UAAU;IAAEC,KAAK;IAAEC,MAAM;IAAEC,QAAQ;IAAEC,UAAU;IAAEC,YAAY;IAAEC;EACrC,CAAC,GAAAP,IAAA;EAC3B,MAAMQ,MAAM,GAAG,IAAIC,oBAAY,CAAC;IAC9BC,GAAG,EAAET,UAAU;IACfU,KAAK,EAAE,IAAIC,qBAAa,CAAC;EAC3B,CAAC,CAAC;EAEF,OACEvB,MAAA,CAAAS,OAAA,CAAAe,aAAA,CAACpB,iBAAA,CAAAqB,cAAc;IACbX,MAAM,EAAEA,MAAO;IACfY,YAAY,EAAEA,0BAAa;IAC3BP,MAAM,EAAEA,MAAO;IACfN,KAAK,EAAEA;EAAM,GAEbb,MAAA,CAAAS,OAAA,CAAAe,aAAA,CAACpB,iBAAA,CAAAuB,aAAa;IACZT,QAAQ,EAAEA,QAAS;IACnBU,QAAQ,EAAC,MAAM;IACfX,YAAY,EAAEA;EAAa,GAE3BjB,MAAA,CAAAS,OAAA,CAAAe,aAAA,CAACnB,KAAA,CAAAwB,IAAI;IAACd,QAAQ,EAAEA,QAAS;IAACC,UAAU,EAAEA;EAAW,CAAE,CACtC,CACD,CAAC;AAErB,CAAC;AAACc,OAAA,CAAApB,oBAAA,GAAAA,oBAAA","ignoreList":[]}

package/dist/main/CurrencyPowerBalanceWidget/Main.js

@@ -20,7 +20,7 @@ const Main = _ref => {
   } = _ref;
   const {
     size
-  } = (0, _react.useContext)(_labsWidgetCommon.ThemeContext);
+  } = (0, _labsWidgetCommon.useLayoutProvider)();
   const {
     lang
   } = (0, _monoI18n.useLocale)();

package/dist/main/CurrencyPowerBalanceWidget/Main.js.map

@@ -1 +1 @@
-{"version":3,"file":"Main.js","names":["_react","_interopRequireWildcard","require","_labsWidgetCommon","_monoI18n","_graphql","_TimeUnitSwitch","_config","_ChartWithData","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Main","_ref","timeUnit","currencies","size","useContext","ThemeContext","lang","useLocale","selectedTimeUnit","setSelectedTimeUnit","useState","CurrencyPowerBalanceTimeUnit","CurrentDay","createElement","Fragment","className","timeUnitConfig","filter","_ref2","value","map","_ref3","tooltipLabel","label","key","translationKey","count","TimeUnitSwitch","selected","callback","options","ChartWithData","exports"],"sources":["../../../src/CurrencyPowerBalanceWidget/Main.tsx"],"sourcesContent":["import React, { useContext, useState } from 'react';\nimport { ThemeContext } from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport { CurrencyPowerBalanceTimeUnit } from '../gql/types/graphql';\nimport { TimeUnitSwitch } from './components/TimeUnitSwitch';\nimport { timeUnitConfig } from './config';\nimport { ChartWithData } from './ChartWithData';\nimport { MainProps } from './types';\n\nconst Main = ({ timeUnit, currencies }: MainProps) => {\n  const { size } = useContext(ThemeContext);\n  const { lang } = useLocale();\n  const [selectedTimeUnit, setSelectedTimeUnit] = useState(\n    timeUnit || CurrencyPowerBalanceTimeUnit.CurrentDay,\n  );\n  return (\n    <>\n      {size && (\n        <div\n          data-testid=\"currency-power-balance-wrapper\"\n          className=\"lw-flex lw-flex-col lw-text-sm lw-tracking-normal\"\n        >\n          {timeUnit && currencies ? (\n            <>\n              {timeUnitConfig\n                .filter(({ value }) => value === selectedTimeUnit)\n                .map(({ tooltipLabel, label }) => (\n                  <div data-testid=\"time-unit-label\" key={label} className=\"lw-mb-6 lw-flex lw-justify-center lw-font-sans lw-text-lg lw-font-bold\">\n                    {tooltipLabel ? <span>{`${lang(tooltipLabel!.translationKey, { count: tooltipLabel!.count })}`}</span> : <span>{`${lang(label)}`}</span>}\n                  </div>\n                ))}\n            </>\n          ) : (\n            <TimeUnitSwitch\n              selected={selectedTimeUnit}\n              callback={setSelectedTimeUnit}\n              options={timeUnitConfig}\n            />\n          )}\n          <ChartWithData\n            timeUnit={selectedTimeUnit}\n            currencies={timeUnit && currencies}\n          />\n        </div>\n      )}\n    </>\n  );\n};\n\nexport { Main };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Main.js","names":["_react","_interopRequireWildcard","require","_labsWidgetCommon","_monoI18n","_graphql","_TimeUnitSwitch","_config","_ChartWithData","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","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","selected","callback","options","ChartWithData","exports"],"sources":["../../../src/CurrencyPowerBalanceWidget/Main.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { useLayoutProvider } from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport { CurrencyPowerBalanceTimeUnit } from '../gql/types/graphql';\nimport { TimeUnitSwitch } from './components/TimeUnitSwitch';\nimport { timeUnitConfig } from './config';\nimport { ChartWithData } from './ChartWithData';\nimport { 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          data-testid=\"currency-power-balance-wrapper\"\n          className=\"lw-flex lw-flex-col lw-text-sm lw-tracking-normal\"\n        >\n          {timeUnit && currencies ? (\n            <>\n              {timeUnitConfig\n                .filter(({ value }) => value === selectedTimeUnit)\n                .map(({ tooltipLabel, label }) => (\n                  <div data-testid=\"time-unit-label\" key={label} className=\"lw-mb-6 lw-flex lw-justify-center lw-font-sans lw-text-lg lw-font-bold\">\n                    {tooltipLabel ? <span>{`${lang(tooltipLabel!.translationKey, { count: tooltipLabel!.count })}`}</span> : <span>{`${lang(label)}`}</span>}\n                  </div>\n                ))}\n            </>\n          ) : (\n            <TimeUnitSwitch\n              selected={selectedTimeUnit}\n              callback={setSelectedTimeUnit}\n              options={timeUnitConfig}\n            />\n          )}\n          <ChartWithData\n            timeUnit={selectedTimeUnit}\n            currencies={timeUnit && currencies}\n          />\n        </div>\n      )}\n    </>\n  );\n};\n\nexport { Main };\n"],"mappings":"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","ignoreList":[]}

package/dist/main/CurrencyPowerBalanceWidget/components/Chart/Chart.js

@@ -32,7 +32,7 @@ const Chart = _ref => {
   const {
     isDark,
     size
-  } = (0, _react.useContext)(_labsWidgetCommon.ThemeContext);
+  } = (0, _labsWidgetCommon.useLayoutProvider)();
   const isDesktop = size === _labsWidgetCommon.Size.DESKTOP;
   const isMobile = size === _labsWidgetCommon.Size.MOBILE;
   const echartRef = (0, _react.useRef)(null);

package/dist/main/CurrencyPowerBalanceWidget/components/Chart/Chart.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chart.js","names":["_react","_interopRequireWildcard","require","_core","_interopRequireDefault","echarts","_charts","_renderers","_components","_labsWidgetCommon","_monoI18n","_constants","_options","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","use","GridSimpleComponent","GraphicComponent","TooltipComponent","LegendPlainComponent","LineChart","CanvasRenderer","MarkLineComponent","registerTheme","getChartTheme","Theme","Dark","Light","Chart","_ref","values","timeUnit","currencies","lang","useLocale","isDark","size","useContext","ThemeContext","isDesktop","Size","DESKTOP","isMobile","MOBILE","echartRef","useRef","chartData","filter","_ref2","currency","includes","useEffect","current","echartInstance","getEchartsInstance","setOption","getResponsiveOption","createElement","ref","theme","style","height","CHART_HEIGHT","width","option","getOption","exports"],"sources":["../../../../../src/CurrencyPowerBalanceWidget/components/Chart/Chart.tsx"],"sourcesContent":["import React, { useRef, useEffect, useContext } from 'react';\nimport ReactEChartsCore from 'echarts-for-react/lib/core';\nimport * as echarts from 'echarts/core';\nimport { LineChart } from 'echarts/charts';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport {\n  GridSimpleComponent, GraphicComponent, TooltipComponent, LegendPlainComponent, MarkLineComponent,\n} from 'echarts/components';\nimport {\n  Theme, ThemeContext, getChartTheme, Size,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport {\n  CHART_HEIGHT,\n} from './options/constants';\nimport { getResponsiveOption, getOption } from './options';\nimport { ChartProps } from './types';\n\necharts.use([\n  GridSimpleComponent,\n  GraphicComponent,\n  TooltipComponent,\n  LegendPlainComponent,\n  LineChart,\n  CanvasRenderer,\n  MarkLineComponent,\n]);\n\necharts.registerTheme('dark_theme', getChartTheme(Theme.Dark));\necharts.registerTheme('light_theme', getChartTheme(Theme.Light));\n\nconst Chart = ({ values, timeUnit, currencies }: ChartProps) => {\n  const { lang } = useLocale();\n  const { isDark, size } = useContext(ThemeContext);\n  const isDesktop = size === Size.DESKTOP;\n  const isMobile = size === Size.MOBILE;\n\n  const echartRef = useRef(null);\n\n  const chartData = currencies\n    ? values.filter(({ currency }) => currencies.includes(currency))\n    : values;\n\n  useEffect(() => {\n    if (echartRef.current) {\n      // @ts-ignore\n      const echartInstance = echartRef.current.getEchartsInstance() as echarts.EChartsType;\n\n      echartInstance.setOption(\n        getResponsiveOption(isDesktop, isMobile, isDark),\n      );\n    }\n  }, [echartRef, isDesktop, isMobile, isDark]);\n\n  return (\n    <ReactEChartsCore\n      echarts={echarts}\n      ref={echartRef}\n      theme={isDark ? 'dark_theme' : 'light_theme'}\n      style={{\n        height: `${CHART_HEIGHT}px`,\n        width: '100%',\n      }}\n      option={getOption(chartData, timeUnit, isDark, lang)}\n    />\n  );\n};\n\nexport { Chart };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Chart.js","names":["_react","_interopRequireWildcard","require","_core","_interopRequireDefault","echarts","_charts","_renderers","_components","_labsWidgetCommon","_monoI18n","_constants","_options","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","use","GridSimpleComponent","GraphicComponent","TooltipComponent","LegendPlainComponent","LineChart","CanvasRenderer","MarkLineComponent","registerTheme","getChartTheme","Theme","Dark","Light","Chart","_ref","values","timeUnit","currencies","lang","useLocale","isDark","size","useLayoutProvider","isDesktop","Size","DESKTOP","isMobile","MOBILE","echartRef","useRef","chartData","filter","_ref2","currency","includes","useEffect","current","echartInstance","getEchartsInstance","setOption","getResponsiveOption","createElement","ref","theme","style","height","CHART_HEIGHT","width","option","getOption","exports"],"sources":["../../../../../src/CurrencyPowerBalanceWidget/components/Chart/Chart.tsx"],"sourcesContent":["import React, { useRef, useEffect } from 'react';\nimport ReactEChartsCore from 'echarts-for-react/lib/core';\nimport * as echarts from 'echarts/core';\nimport { LineChart } from 'echarts/charts';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport {\n  GridSimpleComponent, GraphicComponent, TooltipComponent, LegendPlainComponent, MarkLineComponent,\n} from 'echarts/components';\nimport {\n  Theme, useLayoutProvider, getChartTheme, Size,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport {\n  CHART_HEIGHT,\n} from './options/constants';\nimport { getResponsiveOption, getOption } from './options';\nimport { ChartProps } from './types';\n\necharts.use([\n  GridSimpleComponent,\n  GraphicComponent,\n  TooltipComponent,\n  LegendPlainComponent,\n  LineChart,\n  CanvasRenderer,\n  MarkLineComponent,\n]);\n\necharts.registerTheme('dark_theme', getChartTheme(Theme.Dark));\necharts.registerTheme('light_theme', getChartTheme(Theme.Light));\n\nconst Chart = ({ values, timeUnit, currencies }: ChartProps) => {\n  const { lang } = useLocale();\n  const { isDark, size } = useLayoutProvider();\n  const isDesktop = size === Size.DESKTOP;\n  const isMobile = size === Size.MOBILE;\n\n  const echartRef = useRef(null);\n\n  const chartData = currencies\n    ? values.filter(({ currency }) => currencies.includes(currency))\n    : values;\n\n  useEffect(() => {\n    if (echartRef.current) {\n      // @ts-ignore\n      const echartInstance = echartRef.current.getEchartsInstance() as echarts.EChartsType;\n\n      echartInstance.setOption(\n        getResponsiveOption(isDesktop, isMobile, isDark),\n      );\n    }\n  }, [echartRef, isDesktop, isMobile, isDark]);\n\n  return (\n    <ReactEChartsCore\n      echarts={echarts}\n      ref={echartRef}\n      theme={isDark ? 'dark_theme' : 'light_theme'}\n      style={{\n        height: `${CHART_HEIGHT}px`,\n        width: '100%',\n      }}\n      option={getOption(chartData, timeUnit, isDark, lang)}\n    />\n  );\n};\n\nexport { Chart };\n"],"mappings":"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","ignoreList":[]}

package/dist/main/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.js

@@ -4,13 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.TimeUnitSwitch = void 0;
-var _react = _interopRequireWildcard(require("react"));
+var _react = _interopRequireDefault(require("react"));
 var _labsWidgetCommon = require("@oanda/labs-widget-common");
 var _monoI18n = require("@oanda/mono-i18n");
 var _constants = require("../../constants");
 var _TimeUnitSelect = require("./TimeUnitSelect");
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const TimeUnitSwitch = _ref => {
   let {
     selected,
@@ -22,7 +21,7 @@ const TimeUnitSwitch = _ref => {
   } = (0, _monoI18n.useLocale)();
   const {
     size
-  } = (0, _react.useContext)(_labsWidgetCommon.ThemeContext);
+  } = (0, _labsWidgetCommon.useLayoutProvider)();
   const isDesktop = size === _labsWidgetCommon.Size.DESKTOP;
   const handleButtonClick = e => {
     callback(e.currentTarget.value);

package/dist/main/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimeUnitSwitch.js","names":["_react","_interopRequireWildcard","require","_labsWidgetCommon","_monoI18n","_constants","_TimeUnitSelect","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","TimeUnitSwitch","_ref","selected","options","callback","lang","useLocale","size","useContext","ThemeContext","isDesktop","Size","DESKTOP","handleButtonClick","currentTarget","value","createElement","Fragment","className","map","_ref2","label","tooltipLabel","tooltip","translationKey","count","buttonLabel","Button","key","ButtonSize","full","variant","ButtonVariant","primary","secondary","onClick","CURRENCY_POWER_BALANCE_TOOLTIP_ID","TimeUnitSelect","exports"],"sources":["../../../../../src/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport {\n  Button, ButtonSize, ButtonVariant, ThemeContext, Size,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\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,\n}: TimeUnitSwitchProps) => {\n  const { lang } = useLocale();\n  const { size } = useContext(ThemeContext);\n  const isDesktop = size === Size.DESKTOP;\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(({ value, label, tooltipLabel }) => {\n              const tooltip = tooltipLabel\n                ? lang(tooltipLabel.translationKey, { count: tooltipLabel.count })\n                : tooltipLabel;\n              const buttonLabel = lang(label);\n\n              return (\n                <Button\n                  key={value}\n                  size={ButtonSize.full}\n                  variant={selected === value\n                    ? ButtonVariant.primary\n                    : ButtonVariant.secondary}\n                  onClick={handleButtonClick}\n                  value={value}\n                  data-tooltip-id={CURRENCY_POWER_BALANCE_TOOLTIP_ID}\n                  data-tooltip-content={tooltip}\n                >\n                  {buttonLabel}\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":"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","ignoreList":[]}
+{"version":3,"file":"TimeUnitSwitch.js","names":["_react","_interopRequireDefault","require","_labsWidgetCommon","_monoI18n","_constants","_TimeUnitSelect","e","__esModule","default","TimeUnitSwitch","_ref","selected","options","callback","lang","useLocale","size","useLayoutProvider","isDesktop","Size","DESKTOP","handleButtonClick","currentTarget","value","createElement","Fragment","className","map","_ref2","label","tooltipLabel","tooltip","translationKey","count","buttonLabel","Button","key","ButtonSize","full","variant","ButtonVariant","primary","secondary","onClick","CURRENCY_POWER_BALANCE_TOOLTIP_ID","TimeUnitSelect","exports"],"sources":["../../../../../src/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  Button, ButtonSize, ButtonVariant, useLayoutProvider, Size,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\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,\n}: TimeUnitSwitchProps) => {\n  const { lang } = useLocale();\n  const { size } = useLayoutProvider();\n  const isDesktop = size === Size.DESKTOP;\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(({ value, label, tooltipLabel }) => {\n              const tooltip = tooltipLabel\n                ? lang(tooltipLabel.translationKey, { count: tooltipLabel.count })\n                : tooltipLabel;\n              const buttonLabel = lang(label);\n\n              return (\n                <Button\n                  key={value}\n                  size={ButtonSize.full}\n                  variant={selected === value\n                    ? ButtonVariant.primary\n                    : ButtonVariant.secondary}\n                  onClick={handleButtonClick}\n                  value={value}\n                  data-tooltip-id={CURRENCY_POWER_BALANCE_TOOLTIP_ID}\n                  data-tooltip-content={tooltip}\n                >\n                  {buttonLabel}\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,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAD,OAAA;AAGA,IAAAE,SAAA,GAAAF,OAAA;AAGA,IAAAG,UAAA,GAAAH,OAAA;AACA,IAAAI,eAAA,GAAAJ,OAAA;AAAkD,SAAAD,uBAAAM,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAElD,MAAMG,cAAc,GAAGC,IAAA,IAEI;EAAA,IAFH;IACtBC,QAAQ;IAAEC,OAAO;IAAEC;EACA,CAAC,GAAAH,IAAA;EACpB,MAAM;IAAEI;EAAK,CAAC,GAAG,IAAAC,mBAAS,EAAC,CAAC;EAC5B,MAAM;IAAEC;EAAK,CAAC,GAAG,IAAAC,mCAAiB,EAAC,CAAC;EACpC,MAAMC,SAAS,GAAGF,IAAI,KAAKG,sBAAI,CAACC,OAAO;EAEvC,MAAMC,iBAAiB,GAAIf,CAA0C,IAAK;IACxEO,QAAQ,CAACP,CAAC,CAACgB,aAAa,CAACC,KAAqC,CAAC;EACjE,CAAC;EAED,OACExB,MAAA,CAAAS,OAAA,CAAAgB,aAAA,CAAAzB,MAAA,CAAAS,OAAA,CAAAiB,QAAA,QACGP,SAAS,GAENnB,MAAA,CAAAS,OAAA,CAAAgB,aAAA;IAAK,eAAY,kBAAkB;IAACE,SAAS,EAAC;EAAsC,GACjFd,OAAO,CAACe,GAAG,CAACC,KAAA,IAAoC;IAAA,IAAnC;MAAEL,KAAK;MAAEM,KAAK;MAAEC;IAAa,CAAC,GAAAF,KAAA;IAC1C,MAAMG,OAAO,GAAGD,YAAY,GACxBhB,IAAI,CAACgB,YAAY,CAACE,cAAc,EAAE;MAAEC,KAAK,EAAEH,YAAY,CAACG;IAAM,CAAC,CAAC,GAChEH,YAAY;IAChB,MAAMI,WAAW,GAAGpB,IAAI,CAACe,KAAK,CAAC;IAE/B,OACE9B,MAAA,CAAAS,OAAA,CAAAgB,aAAA,CAACtB,iBAAA,CAAAiC,MAAM;MACLC,GAAG,EAAEb,KAAM;MACXP,IAAI,EAAEqB,4BAAU,CAACC,IAAK;MACtBC,OAAO,EAAE5B,QAAQ,KAAKY,KAAK,GACvBiB,+BAAa,CAACC,OAAO,GACrBD,+BAAa,CAACE,SAAU;MAC5BC,OAAO,EAAEtB,iBAAkB;MAC3BE,KAAK,EAAEA,KAAM;MACb,mBAAiBqB,4CAAkC;MACnD,wBAAsBb;IAAQ,GAE7BG,WACK,CAAC;EAEb,CAAC,CACE,CAAC,GAGNnC,MAAA,CAAAS,OAAA,CAAAgB,aAAA,CAACnB,eAAA,CAAAwC,cAAc;IACblC,QAAQ,EAAEA,QAAS;IACnBE,QAAQ,EAAEA,QAAS;IACnBD,OAAO,EAAEA;EAAQ,CAClB,CAEL,CAAC;AAEP,CAAC;AAACkC,OAAA,CAAArC,cAAA,GAAAA,cAAA","ignoreList":[]}

package/dist/module/CurrencyPowerBalanceWidget/ChartWithData.js

@@ -1,7 +1,7 @@
-import React, { useContext } from 'react';
+import React from 'react';
 import { useQuery } from '@apollo/client';
 import { useLocale } from '@oanda/mono-i18n';
-import { ChartError, Spinner, SpinnerSize, ThemeContext, Tooltip, Size, LastUpdated } from '@oanda/labs-widget-common';
+import { ChartError, Spinner, SpinnerSize, useLayoutProvider, Tooltip, Size, LastUpdated } from '@oanda/labs-widget-common';
 import { Chart } from './components/Chart';
 import { CURRENCY_POWER_BALANCE_TOOLTIP_ID } from './constants';
 import { getCurrencyPowerBalance } from '../gql/getCurrencyPowerBalance';
@@ -12,7 +12,7 @@ const ChartWithData = _ref => {
   } = _ref;
   const {
     size
-  } = useContext(ThemeContext);
+  } = useLayoutProvider();
   const isDesktop = size === Size.DESKTOP;
   const {
     lang

package/dist/module/CurrencyPowerBalanceWidget/ChartWithData.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChartWithData.js","names":["React","useContext","useQuery","useLocale","ChartError","Spinner","SpinnerSize","ThemeContext","Tooltip","Size","LastUpdated","Chart","CURRENCY_POWER_BALANCE_TOOLTIP_ID","getCurrencyPowerBalance","ChartWithData","_ref","timeUnit","currencies","size","isDesktop","DESKTOP","lang","loading","data","error","variables","fetchPolicy","showError","currencyPowerBalance","length","createElement","Fragment","className","lg","values","id","timestamp","updatedAt","labelCallback"],"sources":["../../../src/CurrencyPowerBalanceWidget/ChartWithData.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport { useQuery } from '@apollo/client';\nimport { useLocale } from '@oanda/mono-i18n';\nimport {\n  ChartError, Spinner, SpinnerSize, ThemeContext, Tooltip, Size,\n  LastUpdated,\n} from '@oanda/labs-widget-common';\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, currencies }: ChartWithDataProps) => {\n  const { size } = useContext(ThemeContext);\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 = data?.currencyPowerBalance?.length === 0 || error\n    || (currencies && (currencies.length === 0 || currencies.length === 1));\n\n  return (\n    <>\n      {loading\n      && (\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 values={data?.currencyPowerBalance!} timeUnit={timeUnit} currencies={currencies} />\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            timestamp={data?.currencyPowerBalance![0]?.updatedAt}\n            labelCallback={lang}\n          />\n        )}\n      </div>\n    </>\n  );\n};\n\nexport { ChartWithData };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,UAAU,QAAQ,OAAO;AACzC,SAASC,QAAQ,QAAQ,gBAAgB;AACzC,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,SACEC,UAAU,EAAEC,OAAO,EAAEC,WAAW,EAAEC,YAAY,EAAEC,OAAO,EAAEC,IAAI,EAC7DC,WAAW,QACN,2BAA2B;AAClC,SAASC,KAAK,QAAQ,oBAAoB;AAC1C,SAASC,iCAAiC,QAAQ,aAAa;AAC/D,SAASC,uBAAuB,QAAQ,gCAAgC;AAIxE,MAAMC,aAAa,GAAGC,IAAA,IAAkD;EAAA,IAAjD;IAAEC,QAAQ;IAAEC;EAA+B,CAAC,GAAAF,IAAA;EACjE,MAAM;IAAEG;EAAK,CAAC,GAAGjB,UAAU,CAACM,YAAY,CAAC;EACzC,MAAMY,SAAS,GAAGD,IAAI,KAAKT,IAAI,CAACW,OAAO;EACvC,MAAM;IAAEC;EAAK,CAAC,GAAGlB,SAAS,CAAC,CAAC;EAC5B,MAAM;IAAEmB,OAAO;IAAEC,IAAI;IAAEC;EAAM,CAAC,GAAGtB,QAAQ,CAGvCW,uBAAuB,EAAE;IACzBY,SAAS,EAAE;MACTT;IACF,CAAC;IACDU,WAAW,EAAE;EACf,CAAC,CAAC;EAEF,MAAMC,SAAS,GAAGJ,IAAI,EAAEK,oBAAoB,EAAEC,MAAM,KAAK,CAAC,IAAIL,KAAK,IAC7DP,UAAU,KAAKA,UAAU,CAACY,MAAM,KAAK,CAAC,IAAIZ,UAAU,CAACY,MAAM,KAAK,CAAC,CAAE;EAEzE,OACE7B,KAAA,CAAA8B,aAAA,CAAA9B,KAAA,CAAA+B,QAAA,QACGT,OAAO,IAERtB,KAAA,CAAA8B,aAAA;IAAKE,SAAS,EAAC;EAAgH,GAC7HhC,KAAA,CAAA8B,aAAA,CAACzB,OAAO;IAACa,IAAI,EAAEZ,WAAW,CAAC2B;EAAG,CAAE,CAC7B,CACJ,EACA,CAACX,OAAO,IAAI,CAACK,SAAS,IACrB3B,KAAA,CAAA8B,aAAA,CAACnB,KAAK;IAACuB,MAAM,EAAEX,IAAI,EAAEK,oBAAsB;IAACZ,QAAQ,EAAEA,QAAS;IAACC,UAAU,EAAEA;EAAW,CAAE,CAC1F,EACA,CAACK,OAAO,IAAIK,SAAS,IACpB3B,KAAA,CAAA8B,aAAA;IAAKE,SAAS,EAAC;EAAmG,GAChHhC,KAAA,CAAA8B,aAAA,CAAC1B,UAAU,MAAE,CACV,CACN,EACAe,SAAS,IAAInB,KAAA,CAAA8B,aAAA,CAACtB,OAAO;IAAC2B,EAAE,EAAEvB;EAAkC,CAAE,CAAC,EAChEZ,KAAA,CAAA8B,aAAA;IAAKE,SAAS,EAAC;EAAgB,GAC5B,CAACV,OAAO,IAAI,CAACK,SAAS,IACrB3B,KAAA,CAAA8B,aAAA,CAACpB,WAAW;IACV0B,SAAS,EAAEb,IAAI,EAAEK,oBAAoB,CAAE,CAAC,CAAC,EAAES,SAAU;IACrDC,aAAa,EAAEjB;EAAK,CACrB,CAEA,CACL,CAAC;AAEP,CAAC;AAED,SAASP,aAAa","ignoreList":[]}
+{"version":3,"file":"ChartWithData.js","names":["React","useQuery","useLocale","ChartError","Spinner","SpinnerSize","useLayoutProvider","Tooltip","Size","LastUpdated","Chart","CURRENCY_POWER_BALANCE_TOOLTIP_ID","getCurrencyPowerBalance","ChartWithData","_ref","timeUnit","currencies","size","isDesktop","DESKTOP","lang","loading","data","error","variables","fetchPolicy","showError","currencyPowerBalance","length","createElement","Fragment","className","lg","values","id","timestamp","updatedAt","labelCallback"],"sources":["../../../src/CurrencyPowerBalanceWidget/ChartWithData.tsx"],"sourcesContent":["import React from 'react';\nimport { useQuery } from '@apollo/client';\nimport { useLocale } from '@oanda/mono-i18n';\nimport {\n  ChartError, Spinner, SpinnerSize, useLayoutProvider, Tooltip, Size,\n  LastUpdated,\n} from '@oanda/labs-widget-common';\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, 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 = data?.currencyPowerBalance?.length === 0 || error\n    || (currencies && (currencies.length === 0 || currencies.length === 1));\n\n  return (\n    <>\n      {loading\n      && (\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 values={data?.currencyPowerBalance!} timeUnit={timeUnit} currencies={currencies} />\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            timestamp={data?.currencyPowerBalance![0]?.updatedAt}\n            labelCallback={lang}\n          />\n        )}\n      </div>\n    </>\n  );\n};\n\nexport { ChartWithData };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,QAAQ,QAAQ,gBAAgB;AACzC,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,SACEC,UAAU,EAAEC,OAAO,EAAEC,WAAW,EAAEC,iBAAiB,EAAEC,OAAO,EAAEC,IAAI,EAClEC,WAAW,QACN,2BAA2B;AAClC,SAASC,KAAK,QAAQ,oBAAoB;AAC1C,SAASC,iCAAiC,QAAQ,aAAa;AAC/D,SAASC,uBAAuB,QAAQ,gCAAgC;AAIxE,MAAMC,aAAa,GAAGC,IAAA,IAAkD;EAAA,IAAjD;IAAEC,QAAQ;IAAEC;EAA+B,CAAC,GAAAF,IAAA;EACjE,MAAM;IAAEG;EAAK,CAAC,GAAGX,iBAAiB,CAAC,CAAC;EACpC,MAAMY,SAAS,GAAGD,IAAI,KAAKT,IAAI,CAACW,OAAO;EACvC,MAAM;IAAEC;EAAK,CAAC,GAAGlB,SAAS,CAAC,CAAC;EAC5B,MAAM;IAAEmB,OAAO;IAAEC,IAAI;IAAEC;EAAM,CAAC,GAAGtB,QAAQ,CAGvCW,uBAAuB,EAAE;IACzBY,SAAS,EAAE;MACTT;IACF,CAAC;IACDU,WAAW,EAAE;EACf,CAAC,CAAC;EAEF,MAAMC,SAAS,GAAGJ,IAAI,EAAEK,oBAAoB,EAAEC,MAAM,KAAK,CAAC,IAAIL,KAAK,IAC7DP,UAAU,KAAKA,UAAU,CAACY,MAAM,KAAK,CAAC,IAAIZ,UAAU,CAACY,MAAM,KAAK,CAAC,CAAE;EAEzE,OACE5B,KAAA,CAAA6B,aAAA,CAAA7B,KAAA,CAAA8B,QAAA,QACGT,OAAO,IAERrB,KAAA,CAAA6B,aAAA;IAAKE,SAAS,EAAC;EAAgH,GAC7H/B,KAAA,CAAA6B,aAAA,CAACzB,OAAO;IAACa,IAAI,EAAEZ,WAAW,CAAC2B;EAAG,CAAE,CAC7B,CACJ,EACA,CAACX,OAAO,IAAI,CAACK,SAAS,IACrB1B,KAAA,CAAA6B,aAAA,CAACnB,KAAK;IAACuB,MAAM,EAAEX,IAAI,EAAEK,oBAAsB;IAACZ,QAAQ,EAAEA,QAAS;IAACC,UAAU,EAAEA;EAAW,CAAE,CAC1F,EACA,CAACK,OAAO,IAAIK,SAAS,IACpB1B,KAAA,CAAA6B,aAAA;IAAKE,SAAS,EAAC;EAAmG,GAChH/B,KAAA,CAAA6B,aAAA,CAAC1B,UAAU,MAAE,CACV,CACN,EACAe,SAAS,IAAIlB,KAAA,CAAA6B,aAAA,CAACtB,OAAO;IAAC2B,EAAE,EAAEvB;EAAkC,CAAE,CAAC,EAChEX,KAAA,CAAA6B,aAAA;IAAKE,SAAS,EAAC;EAAgB,GAC5B,CAACV,OAAO,IAAI,CAACK,SAAS,IACrB1B,KAAA,CAAA6B,aAAA,CAACpB,WAAW;IACV0B,SAAS,EAAEb,IAAI,EAAEK,oBAAoB,CAAE,CAAC,CAAC,EAAES,SAAU;IACrDC,aAAa,EAAEjB;EAAK,CACrB,CAEA,CACL,CAAC;AAEP,CAAC;AAED,SAASP,aAAa","ignoreList":[]}

package/dist/module/CurrencyPowerBalanceWidget/CurrencyPowerBalance.js

@@ -1,7 +1,6 @@
 import React from 'react';
-import { ApolloClient, InMemoryCache, ApolloProvider } from '@apollo/client';
-import { ChartError, ThemeProvider, getLocale, renderComponent } from '@oanda/labs-widget-common';
-import { LocaleProvider } from '@oanda/mono-i18n';
+import { ApolloClient, InMemoryCache } from '@apollo/client';
+import { WidgetProvider, WidgetWrapper } from '@oanda/labs-widget-common';
 import { Main } from './Main';
 import { translations } from '../translations';
 const CurrencyPowerBalance = _ref => {
@@ -18,23 +17,19 @@ const CurrencyPowerBalance = _ref => {
     uri: graphqlUrl,
     cache: new InMemoryCache()
   });
-  return React.createElement(ThemeProvider, {
+  return React.createElement(WidgetProvider, {
+    locale: locale,
+    translations: translations,
+    client: client,
     theme: theme
-  }, React.createElement(LocaleProvider, {
-    locale: getLocale(locale),
-    translations: translations
-  }, React.createElement(ApolloProvider, {
-    client: client
-  }, isParamError ? React.createElement("div", {
-    className: "lw-flex lw-h-[425px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary"
-  }, React.createElement(ChartError, null)) : renderComponent({
-    Component: React.createElement(Main, {
-      timeUnit: timeUnit,
-      currencies: currencies
-    }),
-    logoLink,
-    linkArea: 'logo'
-  }))));
+  }, React.createElement(WidgetWrapper, {
+    logoLink: logoLink,
+    linkArea: "logo",
+    isParamError: isParamError
+  }, React.createElement(Main, {
+    timeUnit: timeUnit,
+    currencies: currencies
+  })));
 };
 export { CurrencyPowerBalance };
 //# sourceMappingURL=CurrencyPowerBalance.js.map

package/dist/module/CurrencyPowerBalanceWidget/CurrencyPowerBalance.js.map

@@ -1 +1 @@
-{"version":3,"file":"CurrencyPowerBalance.js","names":["React","ApolloClient","InMemoryCache","ApolloProvider","ChartError","ThemeProvider","getLocale","renderComponent","LocaleProvider","Main","translations","CurrencyPowerBalance","_ref","graphqlUrl","theme","locale","timeUnit","currencies","isParamError","logoLink","client","uri","cache","createElement","className","Component","linkArea"],"sources":["../../../src/CurrencyPowerBalanceWidget/CurrencyPowerBalance.tsx"],"sourcesContent":["import React from 'react';\nimport { ApolloClient, InMemoryCache, ApolloProvider } from '@apollo/client';\nimport {\n  ChartError, ThemeProvider, getLocale, renderComponent,\n} from '@oanda/labs-widget-common';\nimport { LocaleProvider } from '@oanda/mono-i18n';\nimport { Main } from './Main';\nimport { CurrencyPowerBalanceConfig } from './types';\nimport { translations } from '../translations';\n\nconst CurrencyPowerBalance = ({\n  graphqlUrl, theme, locale, timeUnit, currencies, isParamError, logoLink,\n}: CurrencyPowerBalanceConfig) => {\n  const client = new ApolloClient({\n    uri: graphqlUrl,\n    cache: new InMemoryCache(),\n  });\n\n  return (\n    <ThemeProvider theme={theme}>\n      <LocaleProvider locale={getLocale(locale)} translations={translations}>\n        <ApolloProvider client={client}>\n          {isParamError ? (\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          ) : renderComponent({\n            Component: <Main timeUnit={timeUnit} currencies={currencies} />,\n            logoLink,\n            linkArea: 'logo',\n          })}\n        </ApolloProvider>\n      </LocaleProvider>\n    </ThemeProvider>\n  );\n};\n\nexport { CurrencyPowerBalance };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,YAAY,EAAEC,aAAa,EAAEC,cAAc,QAAQ,gBAAgB;AAC5E,SACEC,UAAU,EAAEC,aAAa,EAAEC,SAAS,EAAEC,eAAe,QAChD,2BAA2B;AAClC,SAASC,cAAc,QAAQ,kBAAkB;AACjD,SAASC,IAAI,QAAQ,QAAQ;AAE7B,SAASC,YAAY,QAAQ,iBAAiB;AAE9C,MAAMC,oBAAoB,GAAGC,IAAA,IAEK;EAAA,IAFJ;IAC5BC,UAAU;IAAEC,KAAK;IAAEC,MAAM;IAAEC,QAAQ;IAAEC,UAAU;IAAEC,YAAY;IAAEC;EACrC,CAAC,GAAAP,IAAA;EAC3B,MAAMQ,MAAM,GAAG,IAAInB,YAAY,CAAC;IAC9BoB,GAAG,EAAER,UAAU;IACfS,KAAK,EAAE,IAAIpB,aAAa,CAAC;EAC3B,CAAC,CAAC;EAEF,OACEF,KAAA,CAAAuB,aAAA,CAAClB,aAAa;IAACS,KAAK,EAAEA;EAAM,GAC1Bd,KAAA,CAAAuB,aAAA,CAACf,cAAc;IAACO,MAAM,EAAET,SAAS,CAACS,MAAM,CAAE;IAACL,YAAY,EAAEA;EAAa,GACpEV,KAAA,CAAAuB,aAAA,CAACpB,cAAc;IAACiB,MAAM,EAAEA;EAAO,GAC5BF,YAAY,GACXlB,KAAA,CAAAuB,aAAA;IAAKC,SAAS,EAAC;EAAmG,GAChHxB,KAAA,CAAAuB,aAAA,CAACnB,UAAU,MAAE,CACV,CAAC,GACJG,eAAe,CAAC;IAClBkB,SAAS,EAAEzB,KAAA,CAAAuB,aAAA,CAACd,IAAI;MAACO,QAAQ,EAAEA,QAAS;MAACC,UAAU,EAAEA;IAAW,CAAE,CAAC;IAC/DE,QAAQ;IACRO,QAAQ,EAAE;EACZ,CAAC,CACa,CACF,CACH,CAAC;AAEpB,CAAC;AAED,SAASf,oBAAoB","ignoreList":[]}
+{"version":3,"file":"CurrencyPowerBalance.js","names":["React","ApolloClient","InMemoryCache","WidgetProvider","WidgetWrapper","Main","translations","CurrencyPowerBalance","_ref","graphqlUrl","theme","locale","timeUnit","currencies","isParamError","logoLink","client","uri","cache","createElement","linkArea"],"sources":["../../../src/CurrencyPowerBalanceWidget/CurrencyPowerBalance.tsx"],"sourcesContent":["import React from 'react';\nimport { ApolloClient, InMemoryCache } from '@apollo/client';\nimport { WidgetProvider, WidgetWrapper } from '@oanda/labs-widget-common';\nimport { Main } from './Main';\nimport { CurrencyPowerBalanceConfig } from './types';\nimport { translations } from '../translations';\n\nconst CurrencyPowerBalance = ({\n  graphqlUrl, theme, locale, timeUnit, currencies, isParamError, logoLink,\n}: CurrencyPowerBalanceConfig) => {\n  const client = new ApolloClient({\n    uri: graphqlUrl,\n    cache: new InMemoryCache(),\n  });\n\n  return (\n    <WidgetProvider\n      locale={locale}\n      translations={translations}\n      client={client}\n      theme={theme}\n    >\n      <WidgetWrapper\n        logoLink={logoLink}\n        linkArea=\"logo\"\n        isParamError={isParamError}\n      >\n        <Main timeUnit={timeUnit} currencies={currencies} />\n      </WidgetWrapper>\n    </WidgetProvider>\n  );\n};\n\nexport { CurrencyPowerBalance };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,YAAY,EAAEC,aAAa,QAAQ,gBAAgB;AAC5D,SAASC,cAAc,EAAEC,aAAa,QAAQ,2BAA2B;AACzE,SAASC,IAAI,QAAQ,QAAQ;AAE7B,SAASC,YAAY,QAAQ,iBAAiB;AAE9C,MAAMC,oBAAoB,GAAGC,IAAA,IAEK;EAAA,IAFJ;IAC5BC,UAAU;IAAEC,KAAK;IAAEC,MAAM;IAAEC,QAAQ;IAAEC,UAAU;IAAEC,YAAY;IAAEC;EACrC,CAAC,GAAAP,IAAA;EAC3B,MAAMQ,MAAM,GAAG,IAAIf,YAAY,CAAC;IAC9BgB,GAAG,EAAER,UAAU;IACfS,KAAK,EAAE,IAAIhB,aAAa,CAAC;EAC3B,CAAC,CAAC;EAEF,OACEF,KAAA,CAAAmB,aAAA,CAAChB,cAAc;IACbQ,MAAM,EAAEA,MAAO;IACfL,YAAY,EAAEA,YAAa;IAC3BU,MAAM,EAAEA,MAAO;IACfN,KAAK,EAAEA;EAAM,GAEbV,KAAA,CAAAmB,aAAA,CAACf,aAAa;IACZW,QAAQ,EAAEA,QAAS;IACnBK,QAAQ,EAAC,MAAM;IACfN,YAAY,EAAEA;EAAa,GAE3Bd,KAAA,CAAAmB,aAAA,CAACd,IAAI;IAACO,QAAQ,EAAEA,QAAS;IAACC,UAAU,EAAEA;EAAW,CAAE,CACtC,CACD,CAAC;AAErB,CAAC;AAED,SAASN,oBAAoB","ignoreList":[]}

package/dist/module/CurrencyPowerBalanceWidget/Main.js

@@ -1,5 +1,5 @@
-import React, { useContext, useState } from 'react';
-import { ThemeContext } from '@oanda/labs-widget-common';
+import React, { useState } from 'react';
+import { useLayoutProvider } from '@oanda/labs-widget-common';
 import { useLocale } from '@oanda/mono-i18n';
 import { CurrencyPowerBalanceTimeUnit } from '../gql/types/graphql';
 import { TimeUnitSwitch } from './components/TimeUnitSwitch';
@@ -12,7 +12,7 @@ const Main = _ref => {
   } = _ref;
   const {
     size
-  } = useContext(ThemeContext);
+  } = useLayoutProvider();
   const {
     lang
   } = useLocale();

package/dist/module/CurrencyPowerBalanceWidget/Main.js.map

@@ -1 +1 @@
-{"version":3,"file":"Main.js","names":["React","useContext","useState","ThemeContext","useLocale","CurrencyPowerBalanceTimeUnit","TimeUnitSwitch","timeUnitConfig","ChartWithData","Main","_ref","timeUnit","currencies","size","lang","selectedTimeUnit","setSelectedTimeUnit","CurrentDay","createElement","Fragment","className","filter","_ref2","value","map","_ref3","tooltipLabel","label","key","translationKey","count","selected","callback","options"],"sources":["../../../src/CurrencyPowerBalanceWidget/Main.tsx"],"sourcesContent":["import React, { useContext, useState } from 'react';\nimport { ThemeContext } from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport { CurrencyPowerBalanceTimeUnit } from '../gql/types/graphql';\nimport { TimeUnitSwitch } from './components/TimeUnitSwitch';\nimport { timeUnitConfig } from './config';\nimport { ChartWithData } from './ChartWithData';\nimport { MainProps } from './types';\n\nconst Main = ({ timeUnit, currencies }: MainProps) => {\n  const { size } = useContext(ThemeContext);\n  const { lang } = useLocale();\n  const [selectedTimeUnit, setSelectedTimeUnit] = useState(\n    timeUnit || CurrencyPowerBalanceTimeUnit.CurrentDay,\n  );\n  return (\n    <>\n      {size && (\n        <div\n          data-testid=\"currency-power-balance-wrapper\"\n          className=\"lw-flex lw-flex-col lw-text-sm lw-tracking-normal\"\n        >\n          {timeUnit && currencies ? (\n            <>\n              {timeUnitConfig\n                .filter(({ value }) => value === selectedTimeUnit)\n                .map(({ tooltipLabel, label }) => (\n                  <div data-testid=\"time-unit-label\" key={label} className=\"lw-mb-6 lw-flex lw-justify-center lw-font-sans lw-text-lg lw-font-bold\">\n                    {tooltipLabel ? <span>{`${lang(tooltipLabel!.translationKey, { count: tooltipLabel!.count })}`}</span> : <span>{`${lang(label)}`}</span>}\n                  </div>\n                ))}\n            </>\n          ) : (\n            <TimeUnitSwitch\n              selected={selectedTimeUnit}\n              callback={setSelectedTimeUnit}\n              options={timeUnitConfig}\n            />\n          )}\n          <ChartWithData\n            timeUnit={selectedTimeUnit}\n            currencies={timeUnit && currencies}\n          />\n        </div>\n      )}\n    </>\n  );\n};\n\nexport { Main };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,UAAU,EAAEC,QAAQ,QAAQ,OAAO;AACnD,SAASC,YAAY,QAAQ,2BAA2B;AACxD,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,SAASC,4BAA4B,QAAQ,sBAAsB;AACnE,SAASC,cAAc,QAAQ,6BAA6B;AAC5D,SAASC,cAAc,QAAQ,UAAU;AACzC,SAASC,aAAa,QAAQ,iBAAiB;AAG/C,MAAMC,IAAI,GAAGC,IAAA,IAAyC;EAAA,IAAxC;IAAEC,QAAQ;IAAEC;EAAsB,CAAC,GAAAF,IAAA;EAC/C,MAAM;IAAEG;EAAK,CAAC,GAAGZ,UAAU,CAACE,YAAY,CAAC;EACzC,MAAM;IAAEW;EAAK,CAAC,GAAGV,SAAS,CAAC,CAAC;EAC5B,MAAM,CAACW,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGd,QAAQ,CACtDS,QAAQ,IAAIN,4BAA4B,CAACY,UAC3C,CAAC;EACD,OACEjB,KAAA,CAAAkB,aAAA,CAAAlB,KAAA,CAAAmB,QAAA,QACGN,IAAI,IACHb,KAAA,CAAAkB,aAAA;IACE,eAAY,gCAAgC;IAC5CE,SAAS,EAAC;EAAmD,GAE5DT,QAAQ,IAAIC,UAAU,GACrBZ,KAAA,CAAAkB,aAAA,CAAAlB,KAAA,CAAAmB,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,OAC3BzB,KAAA,CAAAkB,aAAA;MAAK,eAAY,iBAAiB;MAACU,GAAG,EAAED,KAAM;MAACP,SAAS,EAAC;IAAwE,GAC9HM,YAAY,GAAG1B,KAAA,CAAAkB,aAAA,eAAO,GAAGJ,IAAI,CAACY,YAAY,CAAEG,cAAc,EAAE;MAAEC,KAAK,EAAEJ,YAAY,CAAEI;IAAM,CAAC,CAAC,EAAS,CAAC,GAAG9B,KAAA,CAAAkB,aAAA,eAAO,GAAGJ,IAAI,CAACa,KAAK,CAAC,EAAS,CACpI,CAAC;EAAA,CACP,CACH,CAAC,GAEH3B,KAAA,CAAAkB,aAAA,CAACZ,cAAc;IACbyB,QAAQ,EAAEhB,gBAAiB;IAC3BiB,QAAQ,EAAEhB,mBAAoB;IAC9BiB,OAAO,EAAE1B;EAAe,CACzB,CACF,EACDP,KAAA,CAAAkB,aAAA,CAACV,aAAa;IACZG,QAAQ,EAAEI,gBAAiB;IAC3BH,UAAU,EAAED,QAAQ,IAAIC;EAAW,CACpC,CACE,CAEP,CAAC;AAEP,CAAC;AAED,SAASH,IAAI","ignoreList":[]}
+{"version":3,"file":"Main.js","names":["React","useState","useLayoutProvider","useLocale","CurrencyPowerBalanceTimeUnit","TimeUnitSwitch","timeUnitConfig","ChartWithData","Main","_ref","timeUnit","currencies","size","lang","selectedTimeUnit","setSelectedTimeUnit","CurrentDay","createElement","Fragment","className","filter","_ref2","value","map","_ref3","tooltipLabel","label","key","translationKey","count","selected","callback","options"],"sources":["../../../src/CurrencyPowerBalanceWidget/Main.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { useLayoutProvider } from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport { CurrencyPowerBalanceTimeUnit } from '../gql/types/graphql';\nimport { TimeUnitSwitch } from './components/TimeUnitSwitch';\nimport { timeUnitConfig } from './config';\nimport { ChartWithData } from './ChartWithData';\nimport { 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          data-testid=\"currency-power-balance-wrapper\"\n          className=\"lw-flex lw-flex-col lw-text-sm lw-tracking-normal\"\n        >\n          {timeUnit && currencies ? (\n            <>\n              {timeUnitConfig\n                .filter(({ value }) => value === selectedTimeUnit)\n                .map(({ tooltipLabel, label }) => (\n                  <div data-testid=\"time-unit-label\" key={label} className=\"lw-mb-6 lw-flex lw-justify-center lw-font-sans lw-text-lg lw-font-bold\">\n                    {tooltipLabel ? <span>{`${lang(tooltipLabel!.translationKey, { count: tooltipLabel!.count })}`}</span> : <span>{`${lang(label)}`}</span>}\n                  </div>\n                ))}\n            </>\n          ) : (\n            <TimeUnitSwitch\n              selected={selectedTimeUnit}\n              callback={setSelectedTimeUnit}\n              options={timeUnitConfig}\n            />\n          )}\n          <ChartWithData\n            timeUnit={selectedTimeUnit}\n            currencies={timeUnit && currencies}\n          />\n        </div>\n      )}\n    </>\n  );\n};\n\nexport { Main };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,SAASC,iBAAiB,QAAQ,2BAA2B;AAC7D,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,SAASC,4BAA4B,QAAQ,sBAAsB;AACnE,SAASC,cAAc,QAAQ,6BAA6B;AAC5D,SAASC,cAAc,QAAQ,UAAU;AACzC,SAASC,aAAa,QAAQ,iBAAiB;AAG/C,MAAMC,IAAI,GAAGC,IAAA,IAAyC;EAAA,IAAxC;IAAEC,QAAQ;IAAEC;EAAsB,CAAC,GAAAF,IAAA;EAC/C,MAAM;IAAEG;EAAK,CAAC,GAAGV,iBAAiB,CAAC,CAAC;EACpC,MAAM;IAAEW;EAAK,CAAC,GAAGV,SAAS,CAAC,CAAC;EAC5B,MAAM,CAACW,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGd,QAAQ,CACtDS,QAAQ,IAAIN,4BAA4B,CAACY,UAC3C,CAAC;EACD,OACEhB,KAAA,CAAAiB,aAAA,CAAAjB,KAAA,CAAAkB,QAAA,QACGN,IAAI,IACHZ,KAAA,CAAAiB,aAAA;IACE,eAAY,gCAAgC;IAC5CE,SAAS,EAAC;EAAmD,GAE5DT,QAAQ,IAAIC,UAAU,GACrBX,KAAA,CAAAiB,aAAA,CAAAjB,KAAA,CAAAkB,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,OAC3BxB,KAAA,CAAAiB,aAAA;MAAK,eAAY,iBAAiB;MAACU,GAAG,EAAED,KAAM;MAACP,SAAS,EAAC;IAAwE,GAC9HM,YAAY,GAAGzB,KAAA,CAAAiB,aAAA,eAAO,GAAGJ,IAAI,CAACY,YAAY,CAAEG,cAAc,EAAE;MAAEC,KAAK,EAAEJ,YAAY,CAAEI;IAAM,CAAC,CAAC,EAAS,CAAC,GAAG7B,KAAA,CAAAiB,aAAA,eAAO,GAAGJ,IAAI,CAACa,KAAK,CAAC,EAAS,CACpI,CAAC;EAAA,CACP,CACH,CAAC,GAEH1B,KAAA,CAAAiB,aAAA,CAACZ,cAAc;IACbyB,QAAQ,EAAEhB,gBAAiB;IAC3BiB,QAAQ,EAAEhB,mBAAoB;IAC9BiB,OAAO,EAAE1B;EAAe,CACzB,CACF,EACDN,KAAA,CAAAiB,aAAA,CAACV,aAAa;IACZG,QAAQ,EAAEI,gBAAiB;IAC3BH,UAAU,EAAED,QAAQ,IAAIC;EAAW,CACpC,CACE,CAEP,CAAC;AAEP,CAAC;AAED,SAASH,IAAI","ignoreList":[]}

package/dist/module/CurrencyPowerBalanceWidget/components/Chart/Chart.js

@@ -1,10 +1,10 @@
-import React, { useRef, useEffect, useContext } from 'react';
+import React, { useRef, useEffect } from 'react';
 import ReactEChartsCore from 'echarts-for-react/lib/core';
 import * as echarts from 'echarts/core';
 import { LineChart } from 'echarts/charts';
 import { CanvasRenderer } from 'echarts/renderers';
 import { GridSimpleComponent, GraphicComponent, TooltipComponent, LegendPlainComponent, MarkLineComponent } from 'echarts/components';
-import { Theme, ThemeContext, getChartTheme, Size } from '@oanda/labs-widget-common';
+import { Theme, useLayoutProvider, getChartTheme, Size } from '@oanda/labs-widget-common';
 import { useLocale } from '@oanda/mono-i18n';
 import { CHART_HEIGHT } from './options/constants';
 import { getResponsiveOption, getOption } from './options';
@@ -23,7 +23,7 @@ const Chart = _ref => {
   const {
     isDark,
     size
-  } = useContext(ThemeContext);
+  } = useLayoutProvider();
   const isDesktop = size === Size.DESKTOP;
   const isMobile = size === Size.MOBILE;
   const echartRef = useRef(null);

package/dist/module/CurrencyPowerBalanceWidget/components/Chart/Chart.js.map

@@ -1 +1 @@
-{"version":3,"file":"Chart.js","names":["React","useRef","useEffect","useContext","ReactEChartsCore","echarts","LineChart","CanvasRenderer","GridSimpleComponent","GraphicComponent","TooltipComponent","LegendPlainComponent","MarkLineComponent","Theme","ThemeContext","getChartTheme","Size","useLocale","CHART_HEIGHT","getResponsiveOption","getOption","use","registerTheme","Dark","Light","Chart","_ref","values","timeUnit","currencies","lang","isDark","size","isDesktop","DESKTOP","isMobile","MOBILE","echartRef","chartData","filter","_ref2","currency","includes","current","echartInstance","getEchartsInstance","setOption","createElement","ref","theme","style","height","width","option"],"sources":["../../../../../src/CurrencyPowerBalanceWidget/components/Chart/Chart.tsx"],"sourcesContent":["import React, { useRef, useEffect, useContext } from 'react';\nimport ReactEChartsCore from 'echarts-for-react/lib/core';\nimport * as echarts from 'echarts/core';\nimport { LineChart } from 'echarts/charts';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport {\n  GridSimpleComponent, GraphicComponent, TooltipComponent, LegendPlainComponent, MarkLineComponent,\n} from 'echarts/components';\nimport {\n  Theme, ThemeContext, getChartTheme, Size,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport {\n  CHART_HEIGHT,\n} from './options/constants';\nimport { getResponsiveOption, getOption } from './options';\nimport { ChartProps } from './types';\n\necharts.use([\n  GridSimpleComponent,\n  GraphicComponent,\n  TooltipComponent,\n  LegendPlainComponent,\n  LineChart,\n  CanvasRenderer,\n  MarkLineComponent,\n]);\n\necharts.registerTheme('dark_theme', getChartTheme(Theme.Dark));\necharts.registerTheme('light_theme', getChartTheme(Theme.Light));\n\nconst Chart = ({ values, timeUnit, currencies }: ChartProps) => {\n  const { lang } = useLocale();\n  const { isDark, size } = useContext(ThemeContext);\n  const isDesktop = size === Size.DESKTOP;\n  const isMobile = size === Size.MOBILE;\n\n  const echartRef = useRef(null);\n\n  const chartData = currencies\n    ? values.filter(({ currency }) => currencies.includes(currency))\n    : values;\n\n  useEffect(() => {\n    if (echartRef.current) {\n      // @ts-ignore\n      const echartInstance = echartRef.current.getEchartsInstance() as echarts.EChartsType;\n\n      echartInstance.setOption(\n        getResponsiveOption(isDesktop, isMobile, isDark),\n      );\n    }\n  }, [echartRef, isDesktop, isMobile, isDark]);\n\n  return (\n    <ReactEChartsCore\n      echarts={echarts}\n      ref={echartRef}\n      theme={isDark ? 'dark_theme' : 'light_theme'}\n      style={{\n        height: `${CHART_HEIGHT}px`,\n        width: '100%',\n      }}\n      option={getOption(chartData, timeUnit, isDark, lang)}\n    />\n  );\n};\n\nexport { Chart };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,MAAM,EAAEC,SAAS,EAAEC,UAAU,QAAQ,OAAO;AAC5D,OAAOC,gBAAgB,MAAM,4BAA4B;AACzD,OAAO,KAAKC,OAAO,MAAM,cAAc;AACvC,SAASC,SAAS,QAAQ,gBAAgB;AAC1C,SAASC,cAAc,QAAQ,mBAAmB;AAClD,SACEC,mBAAmB,EAAEC,gBAAgB,EAAEC,gBAAgB,EAAEC,oBAAoB,EAAEC,iBAAiB,QAC3F,oBAAoB;AAC3B,SACEC,KAAK,EAAEC,YAAY,EAAEC,aAAa,EAAEC,IAAI,QACnC,2BAA2B;AAClC,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,SACEC,YAAY,QACP,qBAAqB;AAC5B,SAASC,mBAAmB,EAAEC,SAAS,QAAQ,WAAW;AAG1Df,OAAO,CAACgB,GAAG,CAAC,CACVb,mBAAmB,EACnBC,gBAAgB,EAChBC,gBAAgB,EAChBC,oBAAoB,EACpBL,SAAS,EACTC,cAAc,EACdK,iBAAiB,CAClB,CAAC;AAEFP,OAAO,CAACiB,aAAa,CAAC,YAAY,EAAEP,aAAa,CAACF,KAAK,CAACU,IAAI,CAAC,CAAC;AAC9DlB,OAAO,CAACiB,aAAa,CAAC,aAAa,EAAEP,aAAa,CAACF,KAAK,CAACW,KAAK,CAAC,CAAC;AAEhE,MAAMC,KAAK,GAAGC,IAAA,IAAkD;EAAA,IAAjD;IAAEC,MAAM;IAAEC,QAAQ;IAAEC;EAAuB,CAAC,GAAAH,IAAA;EACzD,MAAM;IAAEI;EAAK,CAAC,GAAGb,SAAS,CAAC,CAAC;EAC5B,MAAM;IAAEc,MAAM;IAAEC;EAAK,CAAC,GAAG7B,UAAU,CAACW,YAAY,CAAC;EACjD,MAAMmB,SAAS,GAAGD,IAAI,KAAKhB,IAAI,CAACkB,OAAO;EACvC,MAAMC,QAAQ,GAAGH,IAAI,KAAKhB,IAAI,CAACoB,MAAM;EAErC,MAAMC,SAAS,GAAGpC,MAAM,CAAC,IAAI,CAAC;EAE9B,MAAMqC,SAAS,GAAGT,UAAU,GACxBF,MAAM,CAACY,MAAM,CAACC,KAAA;IAAA,IAAC;MAAEC;IAAS,CAAC,GAAAD,KAAA;IAAA,OAAKX,UAAU,CAACa,QAAQ,CAACD,QAAQ,CAAC;EAAA,EAAC,GAC9Dd,MAAM;EAEVzB,SAAS,CAAC,MAAM;IACd,IAAImC,SAAS,CAACM,OAAO,EAAE;MAErB,MAAMC,cAAc,GAAGP,SAAS,CAACM,OAAO,CAACE,kBAAkB,CAAC,CAAwB;MAEpFD,cAAc,CAACE,SAAS,CACtB3B,mBAAmB,CAACc,SAAS,EAAEE,QAAQ,EAAEJ,MAAM,CACjD,CAAC;IACH;EACF,CAAC,EAAE,CAACM,SAAS,EAAEJ,SAAS,EAAEE,QAAQ,EAAEJ,MAAM,CAAC,CAAC;EAE5C,OACE/B,KAAA,CAAA+C,aAAA,CAAC3C,gBAAgB;IACfC,OAAO,EAAEA,OAAQ;IACjB2C,GAAG,EAAEX,SAAU;IACfY,KAAK,EAAElB,MAAM,GAAG,YAAY,GAAG,aAAc;IAC7CmB,KAAK,EAAE;MACLC,MAAM,EAAE,GAAGjC,YAAY,IAAI;MAC3BkC,KAAK,EAAE;IACT,CAAE;IACFC,MAAM,EAAEjC,SAAS,CAACkB,SAAS,EAAEV,QAAQ,EAAEG,MAAM,EAAED,IAAI;EAAE,CACtD,CAAC;AAEN,CAAC;AAED,SAASL,KAAK","ignoreList":[]}
+{"version":3,"file":"Chart.js","names":["React","useRef","useEffect","ReactEChartsCore","echarts","LineChart","CanvasRenderer","GridSimpleComponent","GraphicComponent","TooltipComponent","LegendPlainComponent","MarkLineComponent","Theme","useLayoutProvider","getChartTheme","Size","useLocale","CHART_HEIGHT","getResponsiveOption","getOption","use","registerTheme","Dark","Light","Chart","_ref","values","timeUnit","currencies","lang","isDark","size","isDesktop","DESKTOP","isMobile","MOBILE","echartRef","chartData","filter","_ref2","currency","includes","current","echartInstance","getEchartsInstance","setOption","createElement","ref","theme","style","height","width","option"],"sources":["../../../../../src/CurrencyPowerBalanceWidget/components/Chart/Chart.tsx"],"sourcesContent":["import React, { useRef, useEffect } from 'react';\nimport ReactEChartsCore from 'echarts-for-react/lib/core';\nimport * as echarts from 'echarts/core';\nimport { LineChart } from 'echarts/charts';\nimport { CanvasRenderer } from 'echarts/renderers';\nimport {\n  GridSimpleComponent, GraphicComponent, TooltipComponent, LegendPlainComponent, MarkLineComponent,\n} from 'echarts/components';\nimport {\n  Theme, useLayoutProvider, getChartTheme, Size,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport {\n  CHART_HEIGHT,\n} from './options/constants';\nimport { getResponsiveOption, getOption } from './options';\nimport { ChartProps } from './types';\n\necharts.use([\n  GridSimpleComponent,\n  GraphicComponent,\n  TooltipComponent,\n  LegendPlainComponent,\n  LineChart,\n  CanvasRenderer,\n  MarkLineComponent,\n]);\n\necharts.registerTheme('dark_theme', getChartTheme(Theme.Dark));\necharts.registerTheme('light_theme', getChartTheme(Theme.Light));\n\nconst Chart = ({ values, timeUnit, currencies }: ChartProps) => {\n  const { lang } = useLocale();\n  const { isDark, size } = useLayoutProvider();\n  const isDesktop = size === Size.DESKTOP;\n  const isMobile = size === Size.MOBILE;\n\n  const echartRef = useRef(null);\n\n  const chartData = currencies\n    ? values.filter(({ currency }) => currencies.includes(currency))\n    : values;\n\n  useEffect(() => {\n    if (echartRef.current) {\n      // @ts-ignore\n      const echartInstance = echartRef.current.getEchartsInstance() as echarts.EChartsType;\n\n      echartInstance.setOption(\n        getResponsiveOption(isDesktop, isMobile, isDark),\n      );\n    }\n  }, [echartRef, isDesktop, isMobile, isDark]);\n\n  return (\n    <ReactEChartsCore\n      echarts={echarts}\n      ref={echartRef}\n      theme={isDark ? 'dark_theme' : 'light_theme'}\n      style={{\n        height: `${CHART_HEIGHT}px`,\n        width: '100%',\n      }}\n      option={getOption(chartData, timeUnit, isDark, lang)}\n    />\n  );\n};\n\nexport { Chart };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,MAAM,EAAEC,SAAS,QAAQ,OAAO;AAChD,OAAOC,gBAAgB,MAAM,4BAA4B;AACzD,OAAO,KAAKC,OAAO,MAAM,cAAc;AACvC,SAASC,SAAS,QAAQ,gBAAgB;AAC1C,SAASC,cAAc,QAAQ,mBAAmB;AAClD,SACEC,mBAAmB,EAAEC,gBAAgB,EAAEC,gBAAgB,EAAEC,oBAAoB,EAAEC,iBAAiB,QAC3F,oBAAoB;AAC3B,SACEC,KAAK,EAAEC,iBAAiB,EAAEC,aAAa,EAAEC,IAAI,QACxC,2BAA2B;AAClC,SAASC,SAAS,QAAQ,kBAAkB;AAC5C,SACEC,YAAY,QACP,qBAAqB;AAC5B,SAASC,mBAAmB,EAAEC,SAAS,QAAQ,WAAW;AAG1Df,OAAO,CAACgB,GAAG,CAAC,CACVb,mBAAmB,EACnBC,gBAAgB,EAChBC,gBAAgB,EAChBC,oBAAoB,EACpBL,SAAS,EACTC,cAAc,EACdK,iBAAiB,CAClB,CAAC;AAEFP,OAAO,CAACiB,aAAa,CAAC,YAAY,EAAEP,aAAa,CAACF,KAAK,CAACU,IAAI,CAAC,CAAC;AAC9DlB,OAAO,CAACiB,aAAa,CAAC,aAAa,EAAEP,aAAa,CAACF,KAAK,CAACW,KAAK,CAAC,CAAC;AAEhE,MAAMC,KAAK,GAAGC,IAAA,IAAkD;EAAA,IAAjD;IAAEC,MAAM;IAAEC,QAAQ;IAAEC;EAAuB,CAAC,GAAAH,IAAA;EACzD,MAAM;IAAEI;EAAK,CAAC,GAAGb,SAAS,CAAC,CAAC;EAC5B,MAAM;IAAEc,MAAM;IAAEC;EAAK,CAAC,GAAGlB,iBAAiB,CAAC,CAAC;EAC5C,MAAMmB,SAAS,GAAGD,IAAI,KAAKhB,IAAI,CAACkB,OAAO;EACvC,MAAMC,QAAQ,GAAGH,IAAI,KAAKhB,IAAI,CAACoB,MAAM;EAErC,MAAMC,SAAS,GAAGnC,MAAM,CAAC,IAAI,CAAC;EAE9B,MAAMoC,SAAS,GAAGT,UAAU,GACxBF,MAAM,CAACY,MAAM,CAACC,KAAA;IAAA,IAAC;MAAEC;IAAS,CAAC,GAAAD,KAAA;IAAA,OAAKX,UAAU,CAACa,QAAQ,CAACD,QAAQ,CAAC;EAAA,EAAC,GAC9Dd,MAAM;EAEVxB,SAAS,CAAC,MAAM;IACd,IAAIkC,SAAS,CAACM,OAAO,EAAE;MAErB,MAAMC,cAAc,GAAGP,SAAS,CAACM,OAAO,CAACE,kBAAkB,CAAC,CAAwB;MAEpFD,cAAc,CAACE,SAAS,CACtB3B,mBAAmB,CAACc,SAAS,EAAEE,QAAQ,EAAEJ,MAAM,CACjD,CAAC;IACH;EACF,CAAC,EAAE,CAACM,SAAS,EAAEJ,SAAS,EAAEE,QAAQ,EAAEJ,MAAM,CAAC,CAAC;EAE5C,OACE9B,KAAA,CAAA8C,aAAA,CAAC3C,gBAAgB;IACfC,OAAO,EAAEA,OAAQ;IACjB2C,GAAG,EAAEX,SAAU;IACfY,KAAK,EAAElB,MAAM,GAAG,YAAY,GAAG,aAAc;IAC7CmB,KAAK,EAAE;MACLC,MAAM,EAAE,GAAGjC,YAAY,IAAI;MAC3BkC,KAAK,EAAE;IACT,CAAE;IACFC,MAAM,EAAEjC,SAAS,CAACkB,SAAS,EAAEV,QAAQ,EAAEG,MAAM,EAAED,IAAI;EAAE,CACtD,CAAC;AAEN,CAAC;AAED,SAASL,KAAK","ignoreList":[]}

package/dist/module/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.js

@@ -1,5 +1,5 @@
-import React, { useContext } from 'react';
-import { Button, ButtonSize, ButtonVariant, ThemeContext, Size } from '@oanda/labs-widget-common';
+import React from 'react';
+import { Button, ButtonSize, ButtonVariant, useLayoutProvider, Size } from '@oanda/labs-widget-common';
 import { useLocale } from '@oanda/mono-i18n';
 import { CURRENCY_POWER_BALANCE_TOOLTIP_ID } from '../../constants';
 import { TimeUnitSelect } from './TimeUnitSelect';
@@ -14,7 +14,7 @@ const TimeUnitSwitch = _ref => {
   } = useLocale();
   const {
     size
-  } = useContext(ThemeContext);
+  } = useLayoutProvider();
   const isDesktop = size === Size.DESKTOP;
   const handleButtonClick = e => {
     callback(e.currentTarget.value);

package/dist/module/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.js.map

@@ -1 +1 @@
-{"version":3,"file":"TimeUnitSwitch.js","names":["React","useContext","Button","ButtonSize","ButtonVariant","ThemeContext","Size","useLocale","CURRENCY_POWER_BALANCE_TOOLTIP_ID","TimeUnitSelect","TimeUnitSwitch","_ref","selected","options","callback","lang","size","isDesktop","DESKTOP","handleButtonClick","e","currentTarget","value","createElement","Fragment","className","map","_ref2","label","tooltipLabel","tooltip","translationKey","count","buttonLabel","key","full","variant","primary","secondary","onClick"],"sources":["../../../../../src/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport {\n  Button, ButtonSize, ButtonVariant, ThemeContext, Size,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\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,\n}: TimeUnitSwitchProps) => {\n  const { lang } = useLocale();\n  const { size } = useContext(ThemeContext);\n  const isDesktop = size === Size.DESKTOP;\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(({ value, label, tooltipLabel }) => {\n              const tooltip = tooltipLabel\n                ? lang(tooltipLabel.translationKey, { count: tooltipLabel.count })\n                : tooltipLabel;\n              const buttonLabel = lang(label);\n\n              return (\n                <Button\n                  key={value}\n                  size={ButtonSize.full}\n                  variant={selected === value\n                    ? ButtonVariant.primary\n                    : ButtonVariant.secondary}\n                  onClick={handleButtonClick}\n                  value={value}\n                  data-tooltip-id={CURRENCY_POWER_BALANCE_TOOLTIP_ID}\n                  data-tooltip-content={tooltip}\n                >\n                  {buttonLabel}\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,IAAIC,UAAU,QAAQ,OAAO;AACzC,SACEC,MAAM,EAAEC,UAAU,EAAEC,aAAa,EAAEC,YAAY,EAAEC,IAAI,QAChD,2BAA2B;AAClC,SAASC,SAAS,QAAQ,kBAAkB;AAG5C,SAASC,iCAAiC,QAAQ,iBAAiB;AACnE,SAASC,cAAc,QAAQ,kBAAkB;AAEjD,MAAMC,cAAc,GAAGC,IAAA,IAEI;EAAA,IAFH;IACtBC,QAAQ;IAAEC,OAAO;IAAEC;EACA,CAAC,GAAAH,IAAA;EACpB,MAAM;IAAEI;EAAK,CAAC,GAAGR,SAAS,CAAC,CAAC;EAC5B,MAAM;IAAES;EAAK,CAAC,GAAGf,UAAU,CAACI,YAAY,CAAC;EACzC,MAAMY,SAAS,GAAGD,IAAI,KAAKV,IAAI,CAACY,OAAO;EAEvC,MAAMC,iBAAiB,GAAIC,CAA0C,IAAK;IACxEN,QAAQ,CAACM,CAAC,CAACC,aAAa,CAACC,KAAqC,CAAC;EACjE,CAAC;EAED,OACEtB,KAAA,CAAAuB,aAAA,CAAAvB,KAAA,CAAAwB,QAAA,QACGP,SAAS,GAENjB,KAAA,CAAAuB,aAAA;IAAK,eAAY,kBAAkB;IAACE,SAAS,EAAC;EAAsC,GACjFZ,OAAO,CAACa,GAAG,CAACC,KAAA,IAAoC;IAAA,IAAnC;MAAEL,KAAK;MAAEM,KAAK;MAAEC;IAAa,CAAC,GAAAF,KAAA;IAC1C,MAAMG,OAAO,GAAGD,YAAY,GACxBd,IAAI,CAACc,YAAY,CAACE,cAAc,EAAE;MAAEC,KAAK,EAAEH,YAAY,CAACG;IAAM,CAAC,CAAC,GAChEH,YAAY;IAChB,MAAMI,WAAW,GAAGlB,IAAI,CAACa,KAAK,CAAC;IAE/B,OACE5B,KAAA,CAAAuB,aAAA,CAACrB,MAAM;MACLgC,GAAG,EAAEZ,KAAM;MACXN,IAAI,EAAEb,UAAU,CAACgC,IAAK;MACtBC,OAAO,EAAExB,QAAQ,KAAKU,KAAK,GACvBlB,aAAa,CAACiC,OAAO,GACrBjC,aAAa,CAACkC,SAAU;MAC5BC,OAAO,EAAEpB,iBAAkB;MAC3BG,KAAK,EAAEA,KAAM;MACb,mBAAiBd,iCAAkC;MACnD,wBAAsBsB;IAAQ,GAE7BG,WACK,CAAC;EAEb,CAAC,CACE,CAAC,GAGNjC,KAAA,CAAAuB,aAAA,CAACd,cAAc;IACbG,QAAQ,EAAEA,QAAS;IACnBE,QAAQ,EAAEA,QAAS;IACnBD,OAAO,EAAEA;EAAQ,CAClB,CAEL,CAAC;AAEP,CAAC;AAED,SAASH,cAAc","ignoreList":[]}
+{"version":3,"file":"TimeUnitSwitch.js","names":["React","Button","ButtonSize","ButtonVariant","useLayoutProvider","Size","useLocale","CURRENCY_POWER_BALANCE_TOOLTIP_ID","TimeUnitSelect","TimeUnitSwitch","_ref","selected","options","callback","lang","size","isDesktop","DESKTOP","handleButtonClick","e","currentTarget","value","createElement","Fragment","className","map","_ref2","label","tooltipLabel","tooltip","translationKey","count","buttonLabel","key","full","variant","primary","secondary","onClick"],"sources":["../../../../../src/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  Button, ButtonSize, ButtonVariant, useLayoutProvider, Size,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\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,\n}: TimeUnitSwitchProps) => {\n  const { lang } = useLocale();\n  const { size } = useLayoutProvider();\n  const isDesktop = size === Size.DESKTOP;\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(({ value, label, tooltipLabel }) => {\n              const tooltip = tooltipLabel\n                ? lang(tooltipLabel.translationKey, { count: tooltipLabel.count })\n                : tooltipLabel;\n              const buttonLabel = lang(label);\n\n              return (\n                <Button\n                  key={value}\n                  size={ButtonSize.full}\n                  variant={selected === value\n                    ? ButtonVariant.primary\n                    : ButtonVariant.secondary}\n                  onClick={handleButtonClick}\n                  value={value}\n                  data-tooltip-id={CURRENCY_POWER_BALANCE_TOOLTIP_ID}\n                  data-tooltip-content={tooltip}\n                >\n                  {buttonLabel}\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,SACEC,MAAM,EAAEC,UAAU,EAAEC,aAAa,EAAEC,iBAAiB,EAAEC,IAAI,QACrD,2BAA2B;AAClC,SAASC,SAAS,QAAQ,kBAAkB;AAG5C,SAASC,iCAAiC,QAAQ,iBAAiB;AACnE,SAASC,cAAc,QAAQ,kBAAkB;AAEjD,MAAMC,cAAc,GAAGC,IAAA,IAEI;EAAA,IAFH;IACtBC,QAAQ;IAAEC,OAAO;IAAEC;EACA,CAAC,GAAAH,IAAA;EACpB,MAAM;IAAEI;EAAK,CAAC,GAAGR,SAAS,CAAC,CAAC;EAC5B,MAAM;IAAES;EAAK,CAAC,GAAGX,iBAAiB,CAAC,CAAC;EACpC,MAAMY,SAAS,GAAGD,IAAI,KAAKV,IAAI,CAACY,OAAO;EAEvC,MAAMC,iBAAiB,GAAIC,CAA0C,IAAK;IACxEN,QAAQ,CAACM,CAAC,CAACC,aAAa,CAACC,KAAqC,CAAC;EACjE,CAAC;EAED,OACErB,KAAA,CAAAsB,aAAA,CAAAtB,KAAA,CAAAuB,QAAA,QACGP,SAAS,GAENhB,KAAA,CAAAsB,aAAA;IAAK,eAAY,kBAAkB;IAACE,SAAS,EAAC;EAAsC,GACjFZ,OAAO,CAACa,GAAG,CAACC,KAAA,IAAoC;IAAA,IAAnC;MAAEL,KAAK;MAAEM,KAAK;MAAEC;IAAa,CAAC,GAAAF,KAAA;IAC1C,MAAMG,OAAO,GAAGD,YAAY,GACxBd,IAAI,CAACc,YAAY,CAACE,cAAc,EAAE;MAAEC,KAAK,EAAEH,YAAY,CAACG;IAAM,CAAC,CAAC,GAChEH,YAAY;IAChB,MAAMI,WAAW,GAAGlB,IAAI,CAACa,KAAK,CAAC;IAE/B,OACE3B,KAAA,CAAAsB,aAAA,CAACrB,MAAM;MACLgC,GAAG,EAAEZ,KAAM;MACXN,IAAI,EAAEb,UAAU,CAACgC,IAAK;MACtBC,OAAO,EAAExB,QAAQ,KAAKU,KAAK,GACvBlB,aAAa,CAACiC,OAAO,GACrBjC,aAAa,CAACkC,SAAU;MAC5BC,OAAO,EAAEpB,iBAAkB;MAC3BG,KAAK,EAAEA,KAAM;MACb,mBAAiBd,iCAAkC;MACnD,wBAAsBsB;IAAQ,GAE7BG,WACK,CAAC;EAEb,CAAC,CACE,CAAC,GAGNhC,KAAA,CAAAsB,aAAA,CAACd,cAAc;IACbG,QAAQ,EAAEA,QAAS;IACnBE,QAAQ,EAAEA,QAAS;IACnBD,OAAO,EAAEA;EAAQ,CAClB,CAEL,CAAC;AAEP,CAAC;AAED,SAASH,cAAc","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oanda/labs-currency-power-balance-widget",
-  "version": "1.0.111",
+  "version": "1.0.112",
   "description": "Labs Currency Power Balance Widget",
   "main": "dist/main/index.js",
   "module": "dist/module/index.js",
@@ -12,7 +12,7 @@
   "author": "OANDA",
   "license": "UNLICENSED",
   "dependencies": {
-    "@oanda/labs-widget-common": "^1.0.172",
+    "@oanda/labs-widget-common": "^1.0.173",
     "@oanda/mono-i18n": "10.0.1",
     "echarts": "5.5.0",
     "echarts-for-react": "3.0.2",
@@ -22,5 +22,5 @@
     "@graphql-codegen/cli": "5.0.0",
     "@graphql-codegen/client-preset": "4.1.0"
   },
-  "gitHead": "f3c94dbb01bc271f175ba95700c51001c4099a52"
+  "gitHead": "67a7801f99f0bab94dd6067a102761f51de786c1"
 }

package/src/CurrencyPowerBalanceWidget/ChartWithData.tsx

@@ -1,8 +1,8 @@
-import React, { useContext } from 'react';
+import React from 'react';
 import { useQuery } from '@apollo/client';
 import { useLocale } from '@oanda/mono-i18n';
 import {
-  ChartError, Spinner, SpinnerSize, ThemeContext, Tooltip, Size,
+  ChartError, Spinner, SpinnerSize, useLayoutProvider, Tooltip, Size,
   LastUpdated,
 } from '@oanda/labs-widget-common';
 import { Chart } from './components/Chart';
@@ -12,7 +12,7 @@ import { ChartWithDataProps } from './types';
 import { GetCurrencyPowerBalanceQuery, GetCurrencyPowerBalanceQueryVariables } from '../gql/types/graphql';
 
 const ChartWithData = ({ timeUnit, currencies }: ChartWithDataProps) => {
-  const { size } = useContext(ThemeContext);
+  const { size } = useLayoutProvider();
   const isDesktop = size === Size.DESKTOP;
   const { lang } = useLocale();
   const { loading, data, error } = useQuery<

package/src/CurrencyPowerBalanceWidget/CurrencyPowerBalance.tsx

@@ -1,9 +1,6 @@
 import React from 'react';
-import { ApolloClient, InMemoryCache, ApolloProvider } from '@apollo/client';
-import {
-  ChartError, ThemeProvider, getLocale, renderComponent,
-} from '@oanda/labs-widget-common';
-import { LocaleProvider } from '@oanda/mono-i18n';
+import { ApolloClient, InMemoryCache } from '@apollo/client';
+import { WidgetProvider, WidgetWrapper } from '@oanda/labs-widget-common';
 import { Main } from './Main';
 import { CurrencyPowerBalanceConfig } from './types';
 import { translations } from '../translations';
@@ -17,21 +14,20 @@ const CurrencyPowerBalance = ({
   });
 
   return (
-    <ThemeProvider theme={theme}>
-      <LocaleProvider locale={getLocale(locale)} translations={translations}>
-        <ApolloProvider client={client}>
-          {isParamError ? (
-            <div className="lw-flex lw-h-[425px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary">
-              <ChartError />
-            </div>
-          ) : renderComponent({
-            Component: <Main timeUnit={timeUnit} currencies={currencies} />,
-            logoLink,
-            linkArea: 'logo',
-          })}
-        </ApolloProvider>
-      </LocaleProvider>
-    </ThemeProvider>
+    <WidgetProvider
+      locale={locale}
+      translations={translations}
+      client={client}
+      theme={theme}
+    >
+      <WidgetWrapper
+        logoLink={logoLink}
+        linkArea="logo"
+        isParamError={isParamError}
+      >
+        <Main timeUnit={timeUnit} currencies={currencies} />
+      </WidgetWrapper>
+    </WidgetProvider>
   );
 };
 

package/src/CurrencyPowerBalanceWidget/Main.tsx

@@ -1,5 +1,5 @@
-import React, { useContext, useState } from 'react';
-import { ThemeContext } from '@oanda/labs-widget-common';
+import React, { useState } from 'react';
+import { useLayoutProvider } from '@oanda/labs-widget-common';
 import { useLocale } from '@oanda/mono-i18n';
 import { CurrencyPowerBalanceTimeUnit } from '../gql/types/graphql';
 import { TimeUnitSwitch } from './components/TimeUnitSwitch';
@@ -8,7 +8,7 @@ import { ChartWithData } from './ChartWithData';
 import { MainProps } from './types';
 
 const Main = ({ timeUnit, currencies }: MainProps) => {
-  const { size } = useContext(ThemeContext);
+  const { size } = useLayoutProvider();
   const { lang } = useLocale();
   const [selectedTimeUnit, setSelectedTimeUnit] = useState(
     timeUnit || CurrencyPowerBalanceTimeUnit.CurrentDay,

package/src/CurrencyPowerBalanceWidget/components/Chart/Chart.tsx

@@ -1,4 +1,4 @@
-import React, { useRef, useEffect, useContext } from 'react';
+import React, { useRef, useEffect } from 'react';
 import ReactEChartsCore from 'echarts-for-react/lib/core';
 import * as echarts from 'echarts/core';
 import { LineChart } from 'echarts/charts';
@@ -7,7 +7,7 @@ import {
   GridSimpleComponent, GraphicComponent, TooltipComponent, LegendPlainComponent, MarkLineComponent,
 } from 'echarts/components';
 import {
-  Theme, ThemeContext, getChartTheme, Size,
+  Theme, useLayoutProvider, getChartTheme, Size,
 } from '@oanda/labs-widget-common';
 import { useLocale } from '@oanda/mono-i18n';
 import {
@@ -31,7 +31,7 @@ echarts.registerTheme('light_theme', getChartTheme(Theme.Light));
 
 const Chart = ({ values, timeUnit, currencies }: ChartProps) => {
   const { lang } = useLocale();
-  const { isDark, size } = useContext(ThemeContext);
+  const { isDark, size } = useLayoutProvider();
   const isDesktop = size === Size.DESKTOP;
   const isMobile = size === Size.MOBILE;
 

package/src/CurrencyPowerBalanceWidget/components/TimeUnitSwitch/TimeUnitSwitch.tsx

@@ -1,6 +1,6 @@
-import React, { useContext } from 'react';
+import React from 'react';
 import {
-  Button, ButtonSize, ButtonVariant, ThemeContext, Size,
+  Button, ButtonSize, ButtonVariant, useLayoutProvider, Size,
 } from '@oanda/labs-widget-common';
 import { useLocale } from '@oanda/mono-i18n';
 import { TimeUnitSwitchProps } from './types';
@@ -12,7 +12,7 @@ const TimeUnitSwitch = ({
   selected, options, callback,
 }: TimeUnitSwitchProps) => {
   const { lang } = useLocale();
-  const { size } = useContext(ThemeContext);
+  const { size } = useLayoutProvider();
   const isDesktop = size === Size.DESKTOP;
 
   const handleButtonClick = (e: React.SyntheticEvent<HTMLButtonElement>) => {

package/test/Main.test.tsx

@@ -4,7 +4,7 @@
 import React from 'react';
 import { render } from '@testing-library/react';
 import { MockedProvider } from '@apollo/client/testing';
-import { Size, ThemeContext } from '@oanda/labs-widget-common';
+import { MockLayoutProvider, Size } from '@oanda/labs-widget-common';
 import { Main } from '../src/CurrencyPowerBalanceWidget/Main';
 import { mockResponse } from './responsesMocks';
 import { CurrencyPowerBalanceTimeUnit } from '../src/gql/types/graphql';
@@ -13,9 +13,9 @@ describe('Main component', () => {
   it('should render tool desktop view', async () => {
     const { findByTestId, getByTestId, queryByTestId } = render(
       <MockedProvider mocks={mockResponse}>
-        <ThemeContext.Provider value={{ size: Size.DESKTOP, isDark: true }}>
+        <MockLayoutProvider>
           <Main />
-        </ThemeContext.Provider>
+        </MockLayoutProvider>
       </MockedProvider>,
     );
 
@@ -26,9 +26,9 @@ describe('Main component', () => {
   it('should render widget desktop view', async () => {
     const { findByTestId, getByTestId, queryByTestId } = render(
       <MockedProvider mocks={mockResponse}>
-        <ThemeContext.Provider value={{ size: Size.DESKTOP, isDark: true }}>
+        <MockLayoutProvider>
           <Main timeUnit={CurrencyPowerBalanceTimeUnit.CurrentDay} currencies={['USD', 'EUR']} />
-        </ThemeContext.Provider>
+        </MockLayoutProvider>
       </MockedProvider>,
     );
 
@@ -39,9 +39,9 @@ describe('Main component', () => {
   it('should render tool desktop view when timeUnit missing for widget', async () => {
     const { findByTestId, getByTestId, queryByTestId } = render(
       <MockedProvider mocks={mockResponse}>
-        <ThemeContext.Provider value={{ size: Size.DESKTOP, isDark: true }}>
+        <MockLayoutProvider>
           <Main currencies={['USD', 'EUR']} />
-        </ThemeContext.Provider>
+        </MockLayoutProvider>
       </MockedProvider>,
     );
 
@@ -52,9 +52,9 @@ describe('Main component', () => {
   it('should render tool desktop view when currencies missing for widget', async () => {
     const { findByTestId, getByTestId, queryByTestId } = render(
       <MockedProvider mocks={mockResponse}>
-        <ThemeContext.Provider value={{ size: Size.DESKTOP, isDark: true }}>
+        <MockLayoutProvider>
           <Main timeUnit={CurrencyPowerBalanceTimeUnit.CurrentDay} />
-        </ThemeContext.Provider>
+        </MockLayoutProvider>
       </MockedProvider>,
     );
 
@@ -65,9 +65,9 @@ describe('Main component', () => {
   it('should render tool mobile view', async () => {
     const { findByTestId, getByTestId, queryByTestId } = render(
       <MockedProvider mocks={mockResponse}>
-        <ThemeContext.Provider value={{ size: Size.MOBILE, isDark: true }}>
+        <MockLayoutProvider size={Size.MOBILE}>
           <Main />
-        </ThemeContext.Provider>
+        </MockLayoutProvider>
       </MockedProvider>,
     );