@oanda/labs-order-book-widget 1.0.62 → 1.0.63

package/CHANGELOG.md

@@ -3,6 +3,246 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## 1.0.63 (2024-01-11)
+
+
+
+## 1.0.62 (2024-01-10)
+
+
+
+## 1.0.61 (2024-01-09)
+
+
+
+## 1.0.60 (2024-01-05)
+
+
+
+## 1.0.59 (2023-12-27)
+
+
+
+## 1.0.58 (2023-12-22)
+
+
+
+## 1.0.57 (2023-12-22)
+
+
+
+## 1.0.56 (2023-12-21)
+
+
+
+## 1.0.55 (2023-12-19)
+
+
+
+## 1.0.54 (2023-12-15)
+
+
+
+## 1.0.53 (2023-12-13)
+
+
+
+## 1.0.52 (2023-12-13)
+
+
+
+## 1.0.51 (2023-12-07)
+
+
+
+## 1.0.50 (2023-12-04)
+
+
+
+## 1.0.49 (2023-12-01)
+
+
+
+## 1.0.48 (2023-12-01)
+
+
+
+## 1.0.47 (2023-11-29)
+
+
+
+## 1.0.46 (2023-11-28)
+
+
+
+## 1.0.45 (2023-11-23)
+
+
+
+## 1.0.44 (2023-11-22)
+
+
+
+## 1.0.43 (2023-11-15)
+
+
+
+## 1.0.42 (2023-11-10)
+
+
+
+## 1.0.41 (2023-11-03)
+
+
+
+## 1.0.40 (2023-11-02)
+
+
+
+## 1.0.39 (2023-11-02)
+
+
+
+## 1.0.38 (2023-10-26)
+
+
+
+## 1.0.37 (2023-10-26)
+
+
+
+## 1.0.36 (2023-10-25)
+
+
+
+## 1.0.35 (2023-10-24)
+
+
+
+## 1.0.34 (2023-10-23)
+
+
+
+## 1.0.33 (2023-10-23)
+
+
+
+## 1.0.32 (2023-10-23)
+
+
+
+## 1.0.31 (2023-10-20)
+
+
+
+## 1.0.30 (2023-10-19)
+
+
+
+## 1.0.29 (2023-10-19)
+
+
+
+## 1.0.28 (2023-10-19)
+
+
+
+## 1.0.27 (2023-10-18)
+
+
+
+## 1.0.26 (2023-10-18)
+
+
+
+## 1.0.25 (2023-10-17)
+
+
+
+## 1.0.24 (2023-10-13)
+
+
+
+## 1.0.23 (2023-10-13)
+
+
+
+## 1.0.22 (2023-10-11)
+
+
+
+## 1.0.21 (2023-10-10)
+
+
+
+## 1.0.20 (2023-10-06)
+
+
+
+## 1.0.19 (2023-10-06)
+
+
+
+## 1.0.18 (2023-10-05)
+
+
+
+## 1.0.17 (2023-10-04)
+
+
+
+## 1.0.16 (2023-10-04)
+
+
+
+## 1.0.15 (2023-10-04)
+
+
+
+## 1.0.14 (2023-10-03)
+
+
+
+## 1.0.13 (2023-10-03)
+
+
+
+## 1.0.12 (2023-10-03)
+
+
+
+## 1.0.11 (2023-10-02)
+
+
+
+## 1.0.10 (2023-09-29)
+
+
+
+## 1.0.9 (2023-09-28)
+
+
+
+## 1.0.8 (2023-09-27)
+
+
+
+## 1.0.7 (2023-09-26)
+
+
+
+## 1.0.6 (2023-09-21)
+
+
+
+## 1.0.5 (2023-09-13)
+
+**Note:** Version bump only for package @oanda/labs-order-book-widget
+
+
+
+
+
 ## 1.0.62 (2024-01-10)
 
 

package/dist/main/OrderBookWidget/OrderBookWidget.js

@@ -15,20 +15,23 @@ const OrderBookWidget = _ref => {
   let {
     graphqlUrl,
     instrument,
-    locale
+    locale,
+    theme
   } = _ref;
   const client = new _client.ApolloClient({
     uri: graphqlUrl,
     cache: new _client.InMemoryCache()
   });
-  return _react.default.createElement(_monoI18n.LocaleProvider, {
+  return _react.default.createElement(_labsWidgetCommon.ThemeProvider, {
+    theme: theme
+  }, _react.default.createElement(_monoI18n.LocaleProvider, {
     locale: (0, _labsWidgetCommon.getLocale)(locale),
     translations: _translations.translations
   }, _react.default.createElement(_client.ApolloProvider, {
     client: client
   }, _react.default.createElement(_Widget.Widget, {
     instrument: instrument
-  })));
+  }))));
 };
 exports.OrderBookWidget = OrderBookWidget;
 //# sourceMappingURL=OrderBookWidget.js.map

package/dist/main/OrderBookWidget/OrderBookWidget.js.map

@@ -1 +1 @@
-{"version":3,"file":"OrderBookWidget.js","names":["_react","_interopRequireDefault","require","_client","_monoI18n","_labsWidgetCommon","_Widget","_translations","obj","__esModule","default","OrderBookWidget","_ref","graphqlUrl","instrument","locale","client","ApolloClient","uri","cache","InMemoryCache","createElement","LocaleProvider","getLocale","translations","ApolloProvider","Widget","exports"],"sources":["../../../src/OrderBookWidget/OrderBookWidget.tsx"],"sourcesContent":["import React from 'react';\nimport { ApolloClient, InMemoryCache, ApolloProvider } from '@apollo/client';\nimport { LocaleProvider } from '@oanda/mono-i18n';\nimport { getLocale } from '@oanda/labs-widget-common';\nimport { Widget } from './Widget';\nimport { OrderBookWidgetConfig } from './types';\nimport { translations } from '../translations';\n\nconst OrderBookWidget = ({\n  graphqlUrl,\n  instrument,\n  locale,\n}: OrderBookWidgetConfig) => {\n  const client = new ApolloClient({\n    uri: graphqlUrl,\n    cache: new InMemoryCache(),\n  });\n\n  return (\n    <LocaleProvider locale={getLocale(locale)} translations={translations}>\n      <ApolloProvider client={client}>\n        <Widget instrument={instrument} />\n      </ApolloProvider>\n    </LocaleProvider>\n  );\n};\n\nexport { OrderBookWidget };\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,SAAA,GAAAF,OAAA;AACA,IAAAG,iBAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAEA,IAAAK,aAAA,GAAAL,OAAA;AAA+C,SAAAD,uBAAAO,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAE/C,MAAMG,eAAe,GAAGC,IAAA,IAIK;EAAA,IAJJ;IACvBC,UAAU;IACVC,UAAU;IACVC;EACqB,CAAC,GAAAH,IAAA;EACtB,MAAMI,MAAM,GAAG,IAAIC,oBAAY,CAAC;IAC9BC,GAAG,EAAEL,UAAU;IACfM,KAAK,EAAE,IAAIC,qBAAa,CAAC;EAC3B,CAAC,CAAC;EAEF,OACEpB,MAAA,CAAAU,OAAA,CAAAW,aAAA,CAACjB,SAAA,CAAAkB,cAAc;IAACP,MAAM,EAAE,IAAAQ,2BAAS,EAACR,MAAM,CAAE;IAACS,YAAY,EAAEA;EAAa,GACpExB,MAAA,CAAAU,OAAA,CAAAW,aAAA,CAAClB,OAAA,CAAAsB,cAAc;IAACT,MAAM,EAAEA;EAAO,GAC7BhB,MAAA,CAAAU,OAAA,CAAAW,aAAA,CAACf,OAAA,CAAAoB,MAAM;IAACZ,UAAU,EAAEA;EAAW,CAAE,CACnB,CACF,CAAC;AAErB,CAAC;AAACa,OAAA,CAAAhB,eAAA,GAAAA,eAAA"}
+{"version":3,"file":"OrderBookWidget.js","names":["_react","_interopRequireDefault","require","_client","_monoI18n","_labsWidgetCommon","_Widget","_translations","obj","__esModule","default","OrderBookWidget","_ref","graphqlUrl","instrument","locale","theme","client","ApolloClient","uri","cache","InMemoryCache","createElement","ThemeProvider","LocaleProvider","getLocale","translations","ApolloProvider","Widget","exports"],"sources":["../../../src/OrderBookWidget/OrderBookWidget.tsx"],"sourcesContent":["import React from 'react';\nimport { ApolloClient, InMemoryCache, ApolloProvider } from '@apollo/client';\nimport { LocaleProvider } from '@oanda/mono-i18n';\nimport { ThemeProvider, getLocale } from '@oanda/labs-widget-common';\nimport { Widget } from './Widget';\nimport { OrderBookWidgetConfig } from './types';\nimport { translations } from '../translations';\n\nconst OrderBookWidget = ({\n  graphqlUrl,\n  instrument,\n  locale,\n  theme,\n}: OrderBookWidgetConfig) => {\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          <Widget instrument={instrument} />\n        </ApolloProvider>\n      </LocaleProvider>\n    </ThemeProvider>\n  );\n};\n\nexport { OrderBookWidget };\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,SAAA,GAAAF,OAAA;AACA,IAAAG,iBAAA,GAAAH,OAAA;AACA,IAAAI,OAAA,GAAAJ,OAAA;AAEA,IAAAK,aAAA,GAAAL,OAAA;AAA+C,SAAAD,uBAAAO,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAE/C,MAAMG,eAAe,GAAGC,IAAA,IAKK;EAAA,IALJ;IACvBC,UAAU;IACVC,UAAU;IACVC,MAAM;IACNC;EACqB,CAAC,GAAAJ,IAAA;EACtB,MAAMK,MAAM,GAAG,IAAIC,oBAAY,CAAC;IAC9BC,GAAG,EAAEN,UAAU;IACfO,KAAK,EAAE,IAAIC,qBAAa,CAAC;EAC3B,CAAC,CAAC;EAEF,OACErB,MAAA,CAAAU,OAAA,CAAAY,aAAA,CAACjB,iBAAA,CAAAkB,aAAa;IAACP,KAAK,EAAEA;EAAM,GAC1BhB,MAAA,CAAAU,OAAA,CAAAY,aAAA,CAAClB,SAAA,CAAAoB,cAAc;IAACT,MAAM,EAAE,IAAAU,2BAAS,EAACV,MAAM,CAAE;IAACW,YAAY,EAAEA;EAAa,GACpE1B,MAAA,CAAAU,OAAA,CAAAY,aAAA,CAACnB,OAAA,CAAAwB,cAAc;IAACV,MAAM,EAAEA;EAAO,GAC7BjB,MAAA,CAAAU,OAAA,CAAAY,aAAA,CAAChB,OAAA,CAAAsB,MAAM;IAACd,UAAU,EAAEA;EAAW,CAAE,CACnB,CACF,CACH,CAAC;AAEpB,CAAC;AAACe,OAAA,CAAAlB,eAAA,GAAAA,eAAA"}

package/dist/main/OrderBookWidget/Widget.js

@@ -11,6 +11,7 @@ var _monoI18n = require("@oanda/mono-i18n");
 var _getOrderPositionBooks = require("../gql/getOrderPositionBooks");
 var _graphql = require("../gql/types/graphql");
 var _Chart = require("./components/Chart/Chart");
+var _config = require("./config");
 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 && Object.prototype.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; }
 const Widget = _ref => {
@@ -33,30 +34,27 @@ const Widget = _ref => {
     }
   });
   const isError = !loading && !data || !!error;
-  const isTypeOrder = bookType === _graphql.BookType.Order;
   return _react.default.createElement("div", {
     "data-testid": "order-book-widget",
     className: "lw-p-4 lw-text-sm lw-tracking-normal lw-text-black"
-  }, _react.default.createElement("div", {
-    className: "lw-flex lw-gap-2"
-  }, _react.default.createElement(_labsWidgetCommon.Button, {
-    variant: isTypeOrder ? _labsWidgetCommon.ButtonVariant.primary : _labsWidgetCommon.ButtonVariant.secondary,
-    onClick: () => setBookType(_graphql.BookType.Order)
-  }, lang('order_book')), _react.default.createElement(_labsWidgetCommon.Button, {
-    variant: isTypeOrder ? _labsWidgetCommon.ButtonVariant.secondary : _labsWidgetCommon.ButtonVariant.primary,
-    onClick: () => setBookType(_graphql.BookType.Position)
-  }, lang('position_book'))), _react.default.createElement("div", {
-    className: "lw-relative lw-h-[700px] lw-w-full"
+  }, _react.default.createElement(_labsWidgetCommon.Tabs, {
+    activeTab: bookType,
+    handleClick: e => setBookType(e.currentTarget.value),
+    labelCallback: lang,
+    items: _config.navigationConfig
+  }), _react.default.createElement("div", {
+    className: "lw-relative lw-h-[450px] lw-w-full"
   }, isError && _react.default.createElement("div", {
-    className: "lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full lw-items-center lw-justify-center lw-bg-lightGrey/[0.4]"
+    className: "lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full lw-items-center lw-justify-center lw-border lw-border-solid lw-border-border-primary"
   }, _react.default.createElement(_labsWidgetCommon.ChartError, null)), loading && _react.default.createElement("div", {
-    className: "lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full lw-items-center lw-justify-center lw-bg-lightGrey/[0.4]"
+    className: "lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full lw-items-center lw-justify-center lw-border lw-border-solid lw-border-border-primary"
   }, _react.default.createElement(_labsWidgetCommon.Spinner, {
     size: _labsWidgetCommon.SpinnerSize.lg
   })), data && _react.default.createElement("div", {
     className: "lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full"
   }, _react.default.createElement(_Chart.Chart, {
-    data: data
+    data: data,
+    isOrderBook: bookType === _graphql.BookType.Order
   }))));
 };
 exports.Widget = Widget;

package/dist/main/OrderBookWidget/Widget.js.map

@@ -1 +1 @@
-{"version":3,"file":"Widget.js","names":["_react","_interopRequireWildcard","require","_client","_labsWidgetCommon","_monoI18n","_getOrderPositionBooks","_graphql","_Chart","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","Widget","_ref","instrument","bookType","setBookType","useState","BookType","Order","lang","useLocale","loading","data","error","useQuery","getOrderPositionBooks","variables","recentHours","isError","isTypeOrder","createElement","className","Button","variant","ButtonVariant","primary","secondary","onClick","Position","ChartError","Spinner","size","SpinnerSize","lg","Chart","exports"],"sources":["../../../src/OrderBookWidget/Widget.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { useQuery } from '@apollo/client';\nimport {\n  Button, ButtonVariant, ChartError, Spinner, SpinnerSize,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport { WidgetProps } from './types';\nimport { getOrderPositionBooks } from '../gql/getOrderPositionBooks';\nimport { GetOrderPositionBooksQuery, GetOrderPositionBooksQueryVariables, BookType } from '../gql/types/graphql';\nimport { Chart } from './components/Chart/Chart';\n\nconst Widget = ({\n  instrument,\n}: WidgetProps) => {\n  const [bookType, setBookType] = useState(BookType.Order);\n  const { lang } = useLocale();\n\n  const { loading, data, error } = useQuery<\n  GetOrderPositionBooksQuery,\n  GetOrderPositionBooksQueryVariables\n  >(getOrderPositionBooks, {\n    variables: {\n      instrument,\n      bookType,\n      recentHours: 1,\n    },\n  });\n\n  const isError = (!loading && !data) || !!error;\n\n  const isTypeOrder = bookType === BookType.Order;\n\n  return (\n    <div data-testid=\"order-book-widget\" className=\"lw-p-4 lw-text-sm lw-tracking-normal lw-text-black\">\n      <div className=\"lw-flex lw-gap-2\">\n        <Button\n          variant={isTypeOrder ? ButtonVariant.primary : ButtonVariant.secondary}\n          onClick={() => setBookType(BookType.Order)}\n        >\n          {lang('order_book')}\n        </Button>\n        <Button\n          variant={isTypeOrder ? ButtonVariant.secondary : ButtonVariant.primary}\n          onClick={() => setBookType(BookType.Position)}\n        >\n          {lang('position_book')}\n        </Button>\n      </div>\n      {/* @todo: chart height */}\n      <div className=\"lw-relative lw-h-[700px] lw-w-full\">\n        {isError && (\n          <div className=\"lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full lw-items-center lw-justify-center lw-bg-lightGrey/[0.4]\">\n            <ChartError />\n          </div>\n        )}\n        {loading && (\n          <div className=\"lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full lw-items-center lw-justify-center lw-bg-lightGrey/[0.4]\">\n            <Spinner size={SpinnerSize.lg} />\n          </div>\n        )}\n        {data && (\n          <div className=\"lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full\">\n            <Chart data={data} />\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport { Widget };\n"],"mappings":"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"}
+{"version":3,"file":"Widget.js","names":["_react","_interopRequireWildcard","require","_client","_labsWidgetCommon","_monoI18n","_getOrderPositionBooks","_graphql","_Chart","_config","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","Widget","_ref","instrument","bookType","setBookType","useState","BookType","Order","lang","useLocale","loading","data","error","useQuery","getOrderPositionBooks","variables","recentHours","isError","createElement","className","Tabs","activeTab","handleClick","currentTarget","value","labelCallback","items","navigationConfig","ChartError","Spinner","size","SpinnerSize","lg","Chart","isOrderBook","exports"],"sources":["../../../src/OrderBookWidget/Widget.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { useQuery } from '@apollo/client';\nimport {\n  ChartError, Spinner, SpinnerSize, Tabs,\n} from '@oanda/labs-widget-common';\nimport { useLocale } from '@oanda/mono-i18n';\nimport { WidgetProps } from './types';\nimport { getOrderPositionBooks } from '../gql/getOrderPositionBooks';\nimport { GetOrderPositionBooksQuery, GetOrderPositionBooksQueryVariables, BookType } from '../gql/types/graphql';\nimport { Chart } from './components/Chart/Chart';\nimport { navigationConfig } from './config';\n\nconst Widget = ({\n  instrument,\n}: WidgetProps) => {\n  const [bookType, setBookType] = useState(BookType.Order);\n  const { lang } = useLocale();\n\n  const { loading, data, error } = useQuery<\n  GetOrderPositionBooksQuery,\n  GetOrderPositionBooksQueryVariables\n  >(getOrderPositionBooks, {\n    variables: {\n      instrument,\n      bookType,\n      recentHours: 1,\n    },\n  });\n\n  const isError = (!loading && !data) || !!error;\n\n  return (\n    <div data-testid=\"order-book-widget\" className=\"lw-p-4 lw-text-sm lw-tracking-normal lw-text-black\">\n      <Tabs\n        activeTab={bookType}\n        handleClick={(e) => setBookType(e.currentTarget.value as BookType)}\n        labelCallback={lang}\n        items={navigationConfig}\n      />\n      {/* @todo: chart height */}\n      <div className=\"lw-relative lw-h-[450px] lw-w-full\">\n        {isError && (\n          <div className=\"lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full lw-items-center lw-justify-center lw-border lw-border-solid lw-border-border-primary\">\n            <ChartError />\n          </div>\n        )}\n        {loading && (\n          <div className=\"lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full lw-items-center lw-justify-center lw-border lw-border-solid lw-border-border-primary\">\n            <Spinner size={SpinnerSize.lg} />\n          </div>\n        )}\n        {data && (\n          <div className=\"lw-absolute lw-left-0 lw-top-0 lw-flex lw-h-full lw-w-full\">\n            <Chart data={data} isOrderBook={bookType === BookType.Order} />\n          </div>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport { Widget };\n"],"mappings":"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"}

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

@@ -4,30 +4,65 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.Chart = void 0;
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _echartsForReact = _interopRequireDefault(require("echarts-for-react"));
-var _getOptions = require("./getOptions");
+var _echarts = require("echarts");
+var _labsWidgetCommon = require("@oanda/labs-widget-common");
+var _usehooksTs = require("usehooks-ts");
+var _getOption = require("./getOption");
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+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 && Object.prototype.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; }
+(0, _echarts.registerTheme)('dark_theme', (0, _labsWidgetCommon.getChartTheme)(_labsWidgetCommon.Theme.Dark));
+(0, _echarts.registerTheme)('light_theme', (0, _labsWidgetCommon.getChartTheme)(_labsWidgetCommon.Theme.Light));
 const Chart = _ref => {
-  var _data$orderPositionBo, _data$orderPositionBo2, _data$orderPositionBo3;
   let {
-    data
+    data,
+    isOrderBook
   } = _ref;
-  const buckets = ((_data$orderPositionBo = data.orderPositionBooks[0]) === null || _data$orderPositionBo === void 0 ? void 0 : _data$orderPositionBo.buckets) || [];
-  const bucketWidth = (_data$orderPositionBo2 = data.orderPositionBooks[0]) === null || _data$orderPositionBo2 === void 0 ? void 0 : _data$orderPositionBo2.bucketWidth;
-  const price = (_data$orderPositionBo3 = data.orderPositionBooks[0]) === null || _data$orderPositionBo3 === void 0 ? void 0 : _data$orderPositionBo3.price;
-  const chartData = buckets.map(item => [item.price, Number(item.longCountPercent), Number(item.shortCountPercent) * -1]);
+  const isDark = (0, _react.useContext)(_labsWidgetCommon.ThemeContext) === _labsWidgetCommon.Theme.Dark;
+  const echartRef = (0, _react.useRef)(null);
+  const isDesktop = (0, _usehooksTs.useMediaQuery)('(min-width: 768px)');
+  (0, _react.useEffect)(() => {
+    if (echartRef.current) {
+      const echartInstance = echartRef.current.getEchartsInstance();
+      echartInstance.on('highlight', () => {
+        if (echartInstance.getOption().color[0] === _labsWidgetCommon.colorPalette.bottleGreenLight) {
+          echartInstance.setOption({
+            color: [_labsWidgetCommon.colorPalette.bottleGreenLight70, isDark ? _labsWidgetCommon.colorPalette.orange70 : _labsWidgetCommon.colorPalette.raspberryDark70]
+          });
+        }
+      });
+      echartInstance.on('globalout', () => {
+        echartInstance.setOption({
+          color: [_labsWidgetCommon.colorPalette.bottleGreenLight, isDark ? _labsWidgetCommon.colorPalette.orange : _labsWidgetCommon.colorPalette.raspberryDark]
+        });
+      });
+    }
+  }, [echartRef, isDark]);
+  (0, _react.useEffect)(() => {
+    if (echartRef.current) {
+      const echartInstance = echartRef.current.getEchartsInstance();
+      echartInstance.setOption((0, _getOption.getDesktopOption)({
+        isDark,
+        isOrderBook
+      }));
+    }
+  }, [echartRef, isDesktop, isDark, isOrderBook]);
   return _react.default.createElement("div", {
     className: "lw-relative lw-w-full"
-  }, _react.default.createElement("div", null, price && bucketWidth && _react.default.createElement(_echartsForReact.default, {
+  }, _react.default.createElement("div", null, data && _react.default.createElement(_echartsForReact.default, {
+    ref: echartRef,
+    theme: isDark ? 'dark_theme' : 'light_theme',
     style: {
-      height: '600px',
+      height: '450px',
       width: '100%'
     },
-    option: (0, _getOptions.getOptions)({
-      data: chartData,
-      price,
-      bucketWidth
+    option: (0, _getOption.getOption)({
+      data,
+      precision: 4,
+      isDark,
+      isOrderBook
     })
   })));
 };

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

@@ -1 +1 @@
-{"version":3,"file":"Chart.js","names":["_react","_interopRequireDefault","require","_echartsForReact","_getOptions","obj","__esModule","default","Chart","_ref","_data$orderPositionBo","_data$orderPositionBo2","_data$orderPositionBo3","data","buckets","orderPositionBooks","bucketWidth","price","chartData","map","item","Number","longCountPercent","shortCountPercent","createElement","className","style","height","width","option","getOptions","exports"],"sources":["../../../../../src/OrderBookWidget/components/Chart/Chart.tsx"],"sourcesContent":["import React from 'react';\nimport ReactEcharts from 'echarts-for-react';\nimport { getOptions } from './getOptions';\nimport { GetOrderPositionBooksQuery } from '../../../gql/types/graphql';\n\ninterface ChartProps {\n  data: GetOrderPositionBooksQuery;\n}\n\nexport const Chart = ({ data }: ChartProps) => {\n  const buckets = data.orderPositionBooks[0]?.buckets || [];\n  const bucketWidth = data.orderPositionBooks[0]?.bucketWidth;\n  const price = data.orderPositionBooks[0]?.price;\n\n  const chartData = buckets.map((item) => ([\n    item!.price,\n    Number(item!.longCountPercent),\n    Number(item!.shortCountPercent) * -1,\n  ]));\n\n  return (\n    <div className=\"lw-relative lw-w-full\">\n      <div>\n        {price && bucketWidth && (\n          <ReactEcharts\n            style={{\n              height: '600px',\n              width: '100%',\n            }}\n            option={getOptions({ data: chartData, price, bucketWidth })}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,gBAAA,GAAAF,sBAAA,CAAAC,OAAA;AACA,IAAAE,WAAA,GAAAF,OAAA;AAA0C,SAAAD,uBAAAI,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAOnC,MAAMG,KAAK,GAAGC,IAAA,IAA0B;EAAA,IAAAC,qBAAA,EAAAC,sBAAA,EAAAC,sBAAA;EAAA,IAAzB;IAAEC;EAAiB,CAAC,GAAAJ,IAAA;EACxC,MAAMK,OAAO,GAAG,EAAAJ,qBAAA,GAAAG,IAAI,CAACE,kBAAkB,CAAC,CAAC,CAAC,cAAAL,qBAAA,uBAA1BA,qBAAA,CAA4BI,OAAO,KAAI,EAAE;EACzD,MAAME,WAAW,IAAAL,sBAAA,GAAGE,IAAI,CAACE,kBAAkB,CAAC,CAAC,CAAC,cAAAJ,sBAAA,uBAA1BA,sBAAA,CAA4BK,WAAW;EAC3D,MAAMC,KAAK,IAAAL,sBAAA,GAAGC,IAAI,CAACE,kBAAkB,CAAC,CAAC,CAAC,cAAAH,sBAAA,uBAA1BA,sBAAA,CAA4BK,KAAK;EAE/C,MAAMC,SAAS,GAAGJ,OAAO,CAACK,GAAG,CAAEC,IAAI,IAAM,CACvCA,IAAI,CAAEH,KAAK,EACXI,MAAM,CAACD,IAAI,CAAEE,gBAAgB,CAAC,EAC9BD,MAAM,CAACD,IAAI,CAAEG,iBAAiB,CAAC,GAAG,CAAC,CAAC,CACpC,CAAC;EAEH,OACEvB,MAAA,CAAAO,OAAA,CAAAiB,aAAA;IAAKC,SAAS,EAAC;EAAuB,GACpCzB,MAAA,CAAAO,OAAA,CAAAiB,aAAA,cACGP,KAAK,IAAID,WAAW,IACnBhB,MAAA,CAAAO,OAAA,CAAAiB,aAAA,CAACrB,gBAAA,CAAAI,OAAY;IACXmB,KAAK,EAAE;MACLC,MAAM,EAAE,OAAO;MACfC,KAAK,EAAE;IACT,CAAE;IACFC,MAAM,EAAE,IAAAC,sBAAU,EAAC;MAAEjB,IAAI,EAAEK,SAAS;MAAED,KAAK;MAAED;IAAY,CAAC;EAAE,CAC7D,CAEA,CACF,CAAC;AAEV,CAAC;AAACe,OAAA,CAAAvB,KAAA,GAAAA,KAAA"}
+{"version":3,"file":"Chart.js","names":["_react","_interopRequireWildcard","require","_echartsForReact","_interopRequireDefault","_echarts","_labsWidgetCommon","_usehooksTs","_getOption","obj","__esModule","default","_getRequireWildcardCache","e","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","prototype","hasOwnProperty","call","i","set","registerTheme","getChartTheme","Theme","Dark","Light","Chart","_ref","data","isOrderBook","isDark","useContext","ThemeContext","echartRef","useRef","isDesktop","useMediaQuery","useEffect","current","echartInstance","getEchartsInstance","on","getOption","color","colorPalette","bottleGreenLight","setOption","bottleGreenLight70","orange70","raspberryDark70","orange","raspberryDark","getDesktopOption","createElement","className","ref","theme","style","height","width","option","precision","exports"],"sources":["../../../../../src/OrderBookWidget/components/Chart/Chart.tsx"],"sourcesContent":["import React, { useRef, useEffect, useContext } from 'react';\nimport ReactEcharts from 'echarts-for-react';\nimport { registerTheme, EChartsType, Color } from 'echarts';\nimport {\n  Theme, ThemeContext, colorPalette, getChartTheme,\n} from '@oanda/labs-widget-common';\nimport { useMediaQuery } from 'usehooks-ts';\nimport { getDesktopOption, getOption } from './getOption';\nimport { ChartProps } from './types';\n\nregisterTheme('dark_theme', getChartTheme(Theme.Dark));\nregisterTheme('light_theme', getChartTheme(Theme.Light));\n\nexport const Chart = ({ data, isOrderBook }: ChartProps) => {\n  const isDark = useContext(ThemeContext) === Theme.Dark;\n  const echartRef = useRef(null);\n  const isDesktop = useMediaQuery('(min-width: 768px)');\n\n  useEffect(() => {\n    if (echartRef.current) {\n      // @ts-ignore\n      const echartInstance = echartRef.current.getEchartsInstance() as EChartsType;\n\n      echartInstance.on('highlight', () => {\n        if ((echartInstance.getOption().color as Color[])[0] === colorPalette.bottleGreenLight) {\n          echartInstance.setOption({\n            color: [\n              colorPalette.bottleGreenLight70,\n              isDark ? colorPalette.orange70 : colorPalette.raspberryDark70,\n            ],\n          });\n        }\n      });\n\n      echartInstance.on('globalout', () => {\n        echartInstance.setOption({\n          color: [\n            colorPalette.bottleGreenLight,\n            isDark ? colorPalette.orange : colorPalette.raspberryDark,\n          ],\n        });\n      });\n    }\n  }, [echartRef, isDark]);\n\n  useEffect(() => {\n    if (echartRef.current) {\n      // @ts-ignore\n      const echartInstance = echartRef.current.getEchartsInstance() as EChartsType;\n\n      echartInstance.setOption(getDesktopOption({ isDark, isOrderBook }));\n    }\n  }, [echartRef, isDesktop, isDark, isOrderBook]);\n\n  return (\n    <div className=\"lw-relative lw-w-full\">\n      <div>\n        {data && (\n          <ReactEcharts\n            ref={echartRef}\n            theme={isDark ? 'dark_theme' : 'light_theme'}\n            style={{\n              height: '450px',\n              width: '100%',\n            }}\n            option={getOption({\n              data, precision: 4, isDark, isOrderBook,\n            })}\n          />\n        )}\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,gBAAA,GAAAC,sBAAA,CAAAF,OAAA;AACA,IAAAG,QAAA,GAAAH,OAAA;AACA,IAAAI,iBAAA,GAAAJ,OAAA;AAGA,IAAAK,WAAA,GAAAL,OAAA;AACA,IAAAM,UAAA,GAAAN,OAAA;AAA0D,SAAAE,uBAAAK,GAAA,WAAAA,GAAA,IAAAA,GAAA,CAAAC,UAAA,GAAAD,GAAA,KAAAE,OAAA,EAAAF,GAAA;AAAA,SAAAG,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAZ,wBAAAY,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAH,UAAA,SAAAG,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAF,OAAA,EAAAE,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAC,GAAA,CAAAJ,CAAA,UAAAG,CAAA,CAAAE,GAAA,CAAAL,CAAA,OAAAM,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAZ,CAAA,oBAAAY,CAAA,IAAAH,MAAA,CAAAI,SAAA,CAAAC,cAAA,CAAAC,IAAA,CAAAf,CAAA,EAAAY,CAAA,SAAAI,CAAA,GAAAR,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAX,CAAA,EAAAY,CAAA,UAAAI,CAAA,KAAAA,CAAA,CAAAX,GAAA,IAAAW,CAAA,CAAAC,GAAA,IAAAR,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAI,CAAA,IAAAV,CAAA,CAAAM,CAAA,IAAAZ,CAAA,CAAAY,CAAA,YAAAN,CAAA,CAAAR,OAAA,GAAAE,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAc,GAAA,CAAAjB,CAAA,EAAAM,CAAA,GAAAA,CAAA;AAG1D,IAAAY,sBAAa,EAAC,YAAY,EAAE,IAAAC,+BAAa,EAACC,uBAAK,CAACC,IAAI,CAAC,CAAC;AACtD,IAAAH,sBAAa,EAAC,aAAa,EAAE,IAAAC,+BAAa,EAACC,uBAAK,CAACE,KAAK,CAAC,CAAC;AAEjD,MAAMC,KAAK,GAAGC,IAAA,IAAuC;EAAA,IAAtC;IAAEC,IAAI;IAAEC;EAAwB,CAAC,GAAAF,IAAA;EACrD,MAAMG,MAAM,GAAG,IAAAC,iBAAU,EAACC,8BAAY,CAAC,KAAKT,uBAAK,CAACC,IAAI;EACtD,MAAMS,SAAS,GAAG,IAAAC,aAAM,EAAC,IAAI,CAAC;EAC9B,MAAMC,SAAS,GAAG,IAAAC,yBAAa,EAAC,oBAAoB,CAAC;EAErD,IAAAC,gBAAS,EAAC,MAAM;IACd,IAAIJ,SAAS,CAACK,OAAO,EAAE;MAErB,MAAMC,cAAc,GAAGN,SAAS,CAACK,OAAO,CAACE,kBAAkB,CAAC,CAAgB;MAE5ED,cAAc,CAACE,EAAE,CAAC,WAAW,EAAE,MAAM;QACnC,IAAKF,cAAc,CAACG,SAAS,CAAC,CAAC,CAACC,KAAK,CAAa,CAAC,CAAC,KAAKC,8BAAY,CAACC,gBAAgB,EAAE;UACtFN,cAAc,CAACO,SAAS,CAAC;YACvBH,KAAK,EAAE,CACLC,8BAAY,CAACG,kBAAkB,EAC/BjB,MAAM,GAAGc,8BAAY,CAACI,QAAQ,GAAGJ,8BAAY,CAACK,eAAe;UAEjE,CAAC,CAAC;QACJ;MACF,CAAC,CAAC;MAEFV,cAAc,CAACE,EAAE,CAAC,WAAW,EAAE,MAAM;QACnCF,cAAc,CAACO,SAAS,CAAC;UACvBH,KAAK,EAAE,CACLC,8BAAY,CAACC,gBAAgB,EAC7Bf,MAAM,GAAGc,8BAAY,CAACM,MAAM,GAAGN,8BAAY,CAACO,aAAa;QAE7D,CAAC,CAAC;MACJ,CAAC,CAAC;IACJ;EACF,CAAC,EAAE,CAAClB,SAAS,EAAEH,MAAM,CAAC,CAAC;EAEvB,IAAAO,gBAAS,EAAC,MAAM;IACd,IAAIJ,SAAS,CAACK,OAAO,EAAE;MAErB,MAAMC,cAAc,GAAGN,SAAS,CAACK,OAAO,CAACE,kBAAkB,CAAC,CAAgB;MAE5ED,cAAc,CAACO,SAAS,CAAC,IAAAM,2BAAgB,EAAC;QAAEtB,MAAM;QAAED;MAAY,CAAC,CAAC,CAAC;IACrE;EACF,CAAC,EAAE,CAACI,SAAS,EAAEE,SAAS,EAAEL,MAAM,EAAED,WAAW,CAAC,CAAC;EAE/C,OACEvC,MAAA,CAAAW,OAAA,CAAAoD,aAAA;IAAKC,SAAS,EAAC;EAAuB,GACpChE,MAAA,CAAAW,OAAA,CAAAoD,aAAA,cACGzB,IAAI,IACHtC,MAAA,CAAAW,OAAA,CAAAoD,aAAA,CAAC5D,gBAAA,CAAAQ,OAAY;IACXsD,GAAG,EAAEtB,SAAU;IACfuB,KAAK,EAAE1B,MAAM,GAAG,YAAY,GAAG,aAAc;IAC7C2B,KAAK,EAAE;MACLC,MAAM,EAAE,OAAO;MACfC,KAAK,EAAE;IACT,CAAE;IACFC,MAAM,EAAE,IAAAlB,oBAAS,EAAC;MAChBd,IAAI;MAAEiC,SAAS,EAAE,CAAC;MAAE/B,MAAM;MAAED;IAC9B,CAAC;EAAE,CACJ,CAEA,CACF,CAAC;AAEV,CAAC;AAACiC,OAAA,CAAApC,KAAA,GAAAA,KAAA"}

package/dist/main/OrderBookWidget/components/Chart/constants.js

@@ -3,7 +3,11 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ZOOM_BARS = exports.INITIAL_BARS = void 0;
-const INITIAL_BARS = exports.INITIAL_BARS = 150;
-const ZOOM_BARS = exports.ZOOM_BARS = 10;
+exports.Y_LABEL_SIZE_MOBILE = exports.Y_LABEL_SIZE_DESKTOP = exports.X_LABEL_SIZE = exports.INITIAL_BARS = exports.CHART_WIDTH = exports.CHART_HEIGHT = void 0;
+const INITIAL_BARS = exports.INITIAL_BARS = 80;
+const X_LABEL_SIZE = exports.X_LABEL_SIZE = 40;
+const Y_LABEL_SIZE_MOBILE = exports.Y_LABEL_SIZE_MOBILE = 35;
+const Y_LABEL_SIZE_DESKTOP = exports.Y_LABEL_SIZE_DESKTOP = 120;
+const CHART_WIDTH = exports.CHART_WIDTH = 9999;
+const CHART_HEIGHT = exports.CHART_HEIGHT = 450;
 //# sourceMappingURL=constants.js.map

package/dist/main/OrderBookWidget/components/Chart/constants.js.map

@@ -1 +1 @@
-{"version":3,"file":"constants.js","names":["INITIAL_BARS","exports","ZOOM_BARS"],"sources":["../../../../../src/OrderBookWidget/components/Chart/constants.ts"],"sourcesContent":["export const INITIAL_BARS = 150;\nexport const ZOOM_BARS = 10;\n"],"mappings":";;;;;;AAAO,MAAMA,YAAY,GAAAC,OAAA,CAAAD,YAAA,GAAG,GAAG;AACxB,MAAME,SAAS,GAAAD,OAAA,CAAAC,SAAA,GAAG,EAAE"}
+{"version":3,"file":"constants.js","names":["INITIAL_BARS","exports","X_LABEL_SIZE","Y_LABEL_SIZE_MOBILE","Y_LABEL_SIZE_DESKTOP","CHART_WIDTH","CHART_HEIGHT"],"sources":["../../../../../src/OrderBookWidget/components/Chart/constants.ts"],"sourcesContent":["export const INITIAL_BARS = 80;\n\nexport const X_LABEL_SIZE = 40;\nexport const Y_LABEL_SIZE_MOBILE = 35;\nexport const Y_LABEL_SIZE_DESKTOP = 120;\nexport const CHART_WIDTH = 9999;\nexport const CHART_HEIGHT = 450;\n"],"mappings":";;;;;;AAAO,MAAMA,YAAY,GAAAC,OAAA,CAAAD,YAAA,GAAG,EAAE;AAEvB,MAAME,YAAY,GAAAD,OAAA,CAAAC,YAAA,GAAG,EAAE;AACvB,MAAMC,mBAAmB,GAAAF,OAAA,CAAAE,mBAAA,GAAG,EAAE;AAC9B,MAAMC,oBAAoB,GAAAH,OAAA,CAAAG,oBAAA,GAAG,GAAG;AAChC,MAAMC,WAAW,GAAAJ,OAAA,CAAAI,WAAA,GAAG,IAAI;AACxB,MAAMC,YAAY,GAAAL,OAAA,CAAAK,YAAA,GAAG,GAAG"}

package/dist/main/OrderBookWidget/components/Chart/formatters.js

@@ -0,0 +1,14 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.tooltipFormatter = void 0;
+const tooltipFormatter = (data, precision, isOrderBook) => {
+  const priceText = "Price: ".concat(data[0].toFixed(precision));
+  const buyText = data[1] ? "<br />".concat(isOrderBook ? 'Buy' : 'Long positions', ": ").concat(data[1], "%") : '';
+  const sellText = data[2] ? "<br />".concat(isOrderBook ? 'Sell' : 'Short positions', ": ").concat(data[2] * -1, "%") : '';
+  return priceText + buyText + sellText;
+};
+exports.tooltipFormatter = tooltipFormatter;
+//# sourceMappingURL=formatters.js.map

package/dist/main/OrderBookWidget/components/Chart/formatters.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"formatters.js","names":["tooltipFormatter","data","precision","isOrderBook","priceText","concat","toFixed","buyText","sellText","exports"],"sources":["../../../../../src/OrderBookWidget/components/Chart/formatters.ts"],"sourcesContent":["import { TooltipFormatterType } from './types';\n\nconst tooltipFormatter: TooltipFormatterType = (data, precision, isOrderBook) => {\n  const priceText = `Price: ${data[0].toFixed(precision)}`;\n  const buyText = data[1] ? `<br />${isOrderBook ? 'Buy' : 'Long positions'}: ${data[1]}%` : '';\n  const sellText = data[2] ? `<br />${isOrderBook ? 'Sell' : 'Short positions'}: ${data[2] * -1}%` : '';\n\n  return priceText + buyText + sellText;\n};\n\nexport { tooltipFormatter };\n"],"mappings":";;;;;;AAEA,MAAMA,gBAAsC,GAAGA,CAACC,IAAI,EAAEC,SAAS,EAAEC,WAAW,KAAK;EAC/E,MAAMC,SAAS,aAAAC,MAAA,CAAaJ,IAAI,CAAC,CAAC,CAAC,CAACK,OAAO,CAACJ,SAAS,CAAC,CAAE;EACxD,MAAMK,OAAO,GAAGN,IAAI,CAAC,CAAC,CAAC,YAAAI,MAAA,CAAYF,WAAW,GAAG,KAAK,GAAG,gBAAgB,QAAAE,MAAA,CAAKJ,IAAI,CAAC,CAAC,CAAC,SAAM,EAAE;EAC7F,MAAMO,QAAQ,GAAGP,IAAI,CAAC,CAAC,CAAC,YAAAI,MAAA,CAAYF,WAAW,GAAG,MAAM,GAAG,iBAAiB,QAAAE,MAAA,CAAKJ,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,SAAM,EAAE;EAErG,OAAOG,SAAS,GAAGG,OAAO,GAAGC,QAAQ;AACvC,CAAC;AAACC,OAAA,CAAAT,gBAAA,GAAAA,gBAAA"}