@oanda/labs-ticker-tape-widget 1.0.6 → 1.0.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (85) hide show
  1. package/CHANGELOG.md +68 -0
  2. package/dist/main/TickerTapeWidget/Main.js +5 -30
  3. package/dist/main/TickerTapeWidget/Main.js.map +1 -1
  4. package/dist/main/TickerTapeWidget/TickerTapeWidget.js +8 -8
  5. package/dist/main/TickerTapeWidget/TickerTapeWidget.js.map +1 -1
  6. package/dist/main/TickerTapeWidget/ValidationWrapper.js +45 -0
  7. package/dist/main/TickerTapeWidget/ValidationWrapper.js.map +1 -0
  8. package/dist/main/TickerTapeWidget/components/InstrumentRateWithData/InstrumentRateWithData.js +38 -0
  9. package/dist/main/TickerTapeWidget/components/InstrumentRateWithData/InstrumentRateWithData.js.map +1 -0
  10. package/dist/main/TickerTapeWidget/components/InstrumentRateWithData/index.js +17 -0
  11. package/dist/main/TickerTapeWidget/components/InstrumentRateWithData/index.js.map +1 -0
  12. package/dist/main/TickerTapeWidget/components/InstrumentRateWithData/types.js.map +1 -0
  13. package/dist/main/TickerTapeWidget/types.js.map +1 -1
  14. package/dist/module/TickerTapeWidget/Main.js +7 -32
  15. package/dist/module/TickerTapeWidget/Main.js.map +1 -1
  16. package/dist/module/TickerTapeWidget/TickerTapeWidget.js +7 -8
  17. package/dist/module/TickerTapeWidget/TickerTapeWidget.js.map +1 -1
  18. package/dist/module/TickerTapeWidget/ValidationWrapper.js +38 -0
  19. package/dist/module/TickerTapeWidget/ValidationWrapper.js.map +1 -0
  20. package/dist/module/TickerTapeWidget/components/InstrumentRateWithData/InstrumentRateWithData.js +31 -0
  21. package/dist/module/TickerTapeWidget/components/InstrumentRateWithData/InstrumentRateWithData.js.map +1 -0
  22. package/dist/module/TickerTapeWidget/components/InstrumentRateWithData/index.js +2 -0
  23. package/dist/module/TickerTapeWidget/components/InstrumentRateWithData/index.js.map +1 -0
  24. package/dist/module/TickerTapeWidget/components/InstrumentRateWithData/types.js.map +1 -0
  25. package/dist/module/TickerTapeWidget/types.js.map +1 -1
  26. package/dist/types/TickerTapeWidget/Main.d.ts +1 -1
  27. package/dist/types/TickerTapeWidget/ValidationWrapper.d.ts +4 -0
  28. package/dist/types/TickerTapeWidget/components/InstrumentRateWithData/InstrumentRateWithData.d.ts +4 -0
  29. package/dist/types/TickerTapeWidget/components/InstrumentRateWithData/index.d.ts +1 -0
  30. package/dist/types/TickerTapeWidget/components/InstrumentRateWithData/types.d.ts +8 -0
  31. package/dist/types/TickerTapeWidget/types.d.ts +10 -4
  32. package/package.json +3 -3
  33. package/src/TickerTapeWidget/Main.tsx +6 -42
  34. package/src/TickerTapeWidget/TickerTapeWidget.tsx +11 -17
  35. package/src/TickerTapeWidget/ValidationWrapper.tsx +52 -0
  36. package/src/TickerTapeWidget/components/InstrumentRateWithData/InstrumentRateWithData.tsx +40 -0
  37. package/src/TickerTapeWidget/components/InstrumentRateWithData/index.ts +1 -0
  38. package/src/TickerTapeWidget/components/InstrumentRateWithData/types.ts +9 -0
  39. package/src/TickerTapeWidget/types.tsx +10 -5
  40. package/test/Main.test.tsx +8 -1
  41. package/dist/main/TickerTapeWidget/components/InstrumentRateWithChart/InstrumentRateWithChart.js +0 -46
  42. package/dist/main/TickerTapeWidget/components/InstrumentRateWithChart/InstrumentRateWithChart.js.map +0 -1
  43. package/dist/main/TickerTapeWidget/components/InstrumentRateWithChart/index.js +0 -28
  44. package/dist/main/TickerTapeWidget/components/InstrumentRateWithChart/index.js.map +0 -1
  45. package/dist/main/TickerTapeWidget/components/InstrumentRateWithChart/types.js.map +0 -1
  46. package/dist/main/TickerTapeWidget/components/InstrumentRateWithChart/utils.js +0 -25
  47. package/dist/main/TickerTapeWidget/components/InstrumentRateWithChart/utils.js.map +0 -1
  48. package/dist/main/TickerTapeWidget/components/LineChartWithData/LineChartWithData.js +0 -42
  49. package/dist/main/TickerTapeWidget/components/LineChartWithData/LineChartWithData.js.map +0 -1
  50. package/dist/main/TickerTapeWidget/components/LineChartWithData/index.js +0 -17
  51. package/dist/main/TickerTapeWidget/components/LineChartWithData/index.js.map +0 -1
  52. package/dist/main/TickerTapeWidget/components/LineChartWithData/types.js +0 -6
  53. package/dist/main/TickerTapeWidget/components/LineChartWithData/types.js.map +0 -1
  54. package/dist/module/TickerTapeWidget/components/InstrumentRateWithChart/InstrumentRateWithChart.js +0 -38
  55. package/dist/module/TickerTapeWidget/components/InstrumentRateWithChart/InstrumentRateWithChart.js.map +0 -1
  56. package/dist/module/TickerTapeWidget/components/InstrumentRateWithChart/index.js +0 -3
  57. package/dist/module/TickerTapeWidget/components/InstrumentRateWithChart/index.js.map +0 -1
  58. package/dist/module/TickerTapeWidget/components/InstrumentRateWithChart/types.js.map +0 -1
  59. package/dist/module/TickerTapeWidget/components/InstrumentRateWithChart/utils.js +0 -18
  60. package/dist/module/TickerTapeWidget/components/InstrumentRateWithChart/utils.js.map +0 -1
  61. package/dist/module/TickerTapeWidget/components/LineChartWithData/LineChartWithData.js +0 -35
  62. package/dist/module/TickerTapeWidget/components/LineChartWithData/LineChartWithData.js.map +0 -1
  63. package/dist/module/TickerTapeWidget/components/LineChartWithData/index.js +0 -2
  64. package/dist/module/TickerTapeWidget/components/LineChartWithData/index.js.map +0 -1
  65. package/dist/module/TickerTapeWidget/components/LineChartWithData/types.js +0 -2
  66. package/dist/module/TickerTapeWidget/components/LineChartWithData/types.js.map +0 -1
  67. package/dist/types/TickerTapeWidget/components/InstrumentRateWithChart/InstrumentRateWithChart.d.ts +0 -4
  68. package/dist/types/TickerTapeWidget/components/InstrumentRateWithChart/index.d.ts +0 -2
  69. package/dist/types/TickerTapeWidget/components/InstrumentRateWithChart/types.d.ts +0 -9
  70. package/dist/types/TickerTapeWidget/components/InstrumentRateWithChart/utils.d.ts +0 -3
  71. package/dist/types/TickerTapeWidget/components/LineChartWithData/LineChartWithData.d.ts +0 -4
  72. package/dist/types/TickerTapeWidget/components/LineChartWithData/index.d.ts +0 -1
  73. package/dist/types/TickerTapeWidget/components/LineChartWithData/types.d.ts +0 -8
  74. package/src/TickerTapeWidget/components/InstrumentRateWithChart/InstrumentRateWithChart.tsx +0 -43
  75. package/src/TickerTapeWidget/components/InstrumentRateWithChart/index.ts +0 -2
  76. package/src/TickerTapeWidget/components/InstrumentRateWithChart/types.ts +0 -10
  77. package/src/TickerTapeWidget/components/InstrumentRateWithChart/utils.ts +0 -25
  78. package/src/TickerTapeWidget/components/LineChartWithData/LineChartWithData.tsx +0 -43
  79. package/src/TickerTapeWidget/components/LineChartWithData/index.ts +0 -1
  80. package/src/TickerTapeWidget/components/LineChartWithData/types.tsx +0 -9
  81. package/test/LineChartWithData.test.tsx +0 -164
  82. package/test/components/InstrumentRateWithChart.test.tsx +0 -62
  83. package/test/components/utils.test.ts +0 -13
  84. /package/dist/main/TickerTapeWidget/components/{InstrumentRateWithChart → InstrumentRateWithData}/types.js +0 -0
  85. /package/dist/module/TickerTapeWidget/components/{InstrumentRateWithChart → InstrumentRateWithData}/types.js +0 -0
@@ -0,0 +1,31 @@
1
+ import React from 'react';
2
+ import { useBackgroundQuery } from '@apollo/client';
3
+ import { InstrumentRateWithChart } from '@oanda/labs-widget-common';
4
+ import { INSTRUMENT_TOOLTIP_ID } from '../../constant';
5
+ import { getInstrumentsChart } from '../../../gql/getInstrumentsChart';
6
+ const InstrumentRateWithData = _ref => {
7
+ let {
8
+ record,
9
+ division,
10
+ target,
11
+ size
12
+ } = _ref;
13
+ const hasInstrument = !!record.instrument;
14
+ const [queryRef] = useBackgroundQuery(getInstrumentsChart, {
15
+ variables: {
16
+ instruments: [record.instrument],
17
+ division
18
+ },
19
+ fetchPolicy: 'network-only',
20
+ skip: !hasInstrument
21
+ });
22
+ return React.createElement(InstrumentRateWithChart, {
23
+ record: record,
24
+ target: target,
25
+ size: size,
26
+ tooltipId: INSTRUMENT_TOOLTIP_ID,
27
+ queryRef: queryRef
28
+ });
29
+ };
30
+ export { InstrumentRateWithData };
31
+ //# sourceMappingURL=InstrumentRateWithData.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"InstrumentRateWithData.js","names":["React","useBackgroundQuery","InstrumentRateWithChart","INSTRUMENT_TOOLTIP_ID","getInstrumentsChart","InstrumentRateWithData","_ref","record","division","target","size","hasInstrument","instrument","queryRef","variables","instruments","fetchPolicy","skip","createElement","tooltipId"],"sources":["../../../../../src/TickerTapeWidget/components/InstrumentRateWithData/InstrumentRateWithData.tsx"],"sourcesContent":["import React from 'react';\nimport { useBackgroundQuery } from '@apollo/client';\nimport { InstrumentRateWithChart } from '@oanda/labs-widget-common';\nimport { InstrumentRateWithDataProps } from './types';\nimport { INSTRUMENT_TOOLTIP_ID } from '../../constant';\nimport { getInstrumentsChart } from '../../../gql/getInstrumentsChart';\nimport { GetInstrumentsChartQuery, GetInstrumentsChartQueryVariables } from '../../../gql/types/graphql';\n\nconst InstrumentRateWithData = ({\n record,\n division,\n target,\n size,\n}: InstrumentRateWithDataProps) => {\n const hasInstrument = !!record.instrument;\n\n const [queryRef] = useBackgroundQuery<\n GetInstrumentsChartQuery,\n GetInstrumentsChartQueryVariables\n >(getInstrumentsChart, {\n variables: {\n instruments: [record.instrument],\n division,\n },\n fetchPolicy: 'network-only',\n skip: !hasInstrument,\n });\n\n return (\n <InstrumentRateWithChart<GetInstrumentsChartQuery>\n record={record}\n target={target}\n size={size}\n tooltipId={INSTRUMENT_TOOLTIP_ID}\n queryRef={queryRef}\n />\n );\n};\n\nexport { InstrumentRateWithData };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,kBAAkB,QAAQ,gBAAgB;AACnD,SAASC,uBAAuB,QAAQ,2BAA2B;AAEnE,SAASC,qBAAqB,QAAQ,gBAAgB;AACtD,SAASC,mBAAmB,QAAQ,kCAAkC;AAGtE,MAAMC,sBAAsB,GAAGC,IAAA,IAKI;EAAA,IALH;IAC9BC,MAAM;IACNC,QAAQ;IACRC,MAAM;IACNC;EAC2B,CAAC,GAAAJ,IAAA;EAC5B,MAAMK,aAAa,GAAG,CAAC,CAACJ,MAAM,CAACK,UAAU;EAEzC,MAAM,CAACC,QAAQ,CAAC,GAAGZ,kBAAkB,CAGnCG,mBAAmB,EAAE;IACrBU,SAAS,EAAE;MACTC,WAAW,EAAE,CAACR,MAAM,CAACK,UAAU,CAAC;MAChCJ;IACF,CAAC;IACDQ,WAAW,EAAE,cAAc;IAC3BC,IAAI,EAAE,CAACN;EACT,CAAC,CAAC;EAEF,OACEX,KAAA,CAAAkB,aAAA,CAAChB,uBAAuB;IACtBK,MAAM,EAAEA,MAAO;IACfE,MAAM,EAAEA,MAAO;IACfC,IAAI,EAAEA,IAAK;IACXS,SAAS,EAAEhB,qBAAsB;IACjCU,QAAQ,EAAEA;EAAS,CACpB,CAAC;AAEN,CAAC;AAED,SAASR,sBAAsB","ignoreList":[]}
@@ -0,0 +1,2 @@
1
+ export * from './InstrumentRateWithData';
2
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"index.js","names":[],"sources":["../../../../../src/TickerTapeWidget/components/InstrumentRateWithData/index.ts"],"sourcesContent":["export * from './InstrumentRateWithData';\n"],"mappings":"AAAA,cAAc,0BAA0B","ignoreList":[]}
@@ -0,0 +1 @@
1
+ {"version":3,"file":"types.js","names":[],"sources":["../../../../../src/TickerTapeWidget/components/InstrumentRateWithData/types.ts"],"sourcesContent":["import { DataRecord, WidgetSize } from '@oanda/labs-widget-common';\nimport { Division } from '../../types';\n\nexport interface InstrumentRateWithDataProps {\n record: DataRecord;\n target: EventTarget | null;\n division: Division;\n size?: WidgetSize\n}\n"],"mappings":"","ignoreList":[]}
@@ -1 +1 @@
1
- {"version":3,"file":"types.js","names":["Locale","Division"],"sources":["../../../src/TickerTapeWidget/types.tsx"],"sourcesContent":["import { Locale } from '@oanda/mono-i18n';\nimport { Theme } from '@oanda/labs-widget-common';\nimport { Division } from '../gql/types/graphql';\n\nexport { Locale } from '@oanda/mono-i18n';\nexport { Division } from '../gql/types/graphql';\n\nexport interface TickerTapeConfig {\n graphqlUrl: string;\n division: Division;\n liveRatesUrl: string;\n instruments: string[];\n locale: Locale;\n theme?: Theme;\n isParamError?: boolean;\n removePadding?: boolean;\n size?: 'compact' | 'full' | 'fullWithChart';\n}\n\nexport interface MainProps {\n instruments: string[];\n division: Division;\n size?: 'compact' | 'full' | 'fullWithChart'\n}\n"],"mappings":"AAIA,SAASA,MAAM,QAAQ,kBAAkB;AACzC,SAASC,QAAQ,QAAQ,sBAAsB","ignoreList":[]}
1
+ {"version":3,"file":"types.js","names":["Locale","Division"],"sources":["../../../src/TickerTapeWidget/types.tsx"],"sourcesContent":["import { Locale } from '@oanda/mono-i18n';\nimport { DataRecord, Theme, WidgetSize } from '@oanda/labs-widget-common';\nimport { Division } from '../gql/types/graphql';\n\nexport { Locale } from '@oanda/mono-i18n';\nexport { Division } from '../gql/types/graphql';\n\nexport interface TickerTapeConfig {\n graphqlUrl: string;\n division: Division;\n liveRatesUrl: string;\n instruments: string[];\n locale: Locale;\n theme?: Theme;\n isParamError?: boolean;\n removePadding?: boolean;\n size?: WidgetSize;\n}\nexport interface ValidationWrapperProps {\n instruments: string[];\n division: Division;\n size?: WidgetSize;\n isParamError?: boolean;\n}\nexport interface MainProps {\n records: DataRecord[];\n division: Division;\n size?: WidgetSize;\n}\n"],"mappings":"AAIA,SAASA,MAAM,QAAQ,kBAAkB;AACzC,SAASC,QAAQ,QAAQ,sBAAsB","ignoreList":[]}
@@ -1,4 +1,4 @@
1
1
  import React from 'react';
2
2
  import { MainProps } from './types';
3
- declare const Main: ({ instruments, division, size: widgetSize, }: MainProps) => React.JSX.Element;
3
+ declare const Main: ({ records, division, size: widgetSize, }: MainProps) => React.JSX.Element;
4
4
  export { Main };
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { ValidationWrapperProps } from './types';
3
+ declare const ValidationWrapper: ({ instruments, division, size: widgetSize, isParamError, }: ValidationWrapperProps) => React.JSX.Element;
4
+ export { ValidationWrapper };
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ import { InstrumentRateWithDataProps } from './types';
3
+ declare const InstrumentRateWithData: ({ record, division, target, size, }: InstrumentRateWithDataProps) => React.JSX.Element;
4
+ export { InstrumentRateWithData };
@@ -0,0 +1 @@
1
+ export * from './InstrumentRateWithData';
@@ -0,0 +1,8 @@
1
+ import { DataRecord, WidgetSize } from '@oanda/labs-widget-common';
2
+ import { Division } from '../../types';
3
+ export interface InstrumentRateWithDataProps {
4
+ record: DataRecord;
5
+ target: EventTarget | null;
6
+ division: Division;
7
+ size?: WidgetSize;
8
+ }
@@ -1,5 +1,5 @@
1
1
  import { Locale } from '@oanda/mono-i18n';
2
- import { Theme } from '@oanda/labs-widget-common';
2
+ import { DataRecord, Theme, WidgetSize } from '@oanda/labs-widget-common';
3
3
  import { Division } from '../gql/types/graphql';
4
4
  export { Locale } from '@oanda/mono-i18n';
5
5
  export { Division } from '../gql/types/graphql';
@@ -12,10 +12,16 @@ export interface TickerTapeConfig {
12
12
  theme?: Theme;
13
13
  isParamError?: boolean;
14
14
  removePadding?: boolean;
15
- size?: 'compact' | 'full' | 'fullWithChart';
15
+ size?: WidgetSize;
16
16
  }
17
- export interface MainProps {
17
+ export interface ValidationWrapperProps {
18
18
  instruments: string[];
19
19
  division: Division;
20
- size?: 'compact' | 'full' | 'fullWithChart';
20
+ size?: WidgetSize;
21
+ isParamError?: boolean;
22
+ }
23
+ export interface MainProps {
24
+ records: DataRecord[];
25
+ division: Division;
26
+ size?: WidgetSize;
21
27
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@oanda/labs-ticker-tape-widget",
3
- "version": "1.0.6",
3
+ "version": "1.0.8",
4
4
  "description": "Labs Ticker Tape Widget",
5
5
  "main": "dist/main/index.js",
6
6
  "module": "dist/module/index.js",
@@ -12,7 +12,7 @@
12
12
  "author": "OANDA",
13
13
  "license": "UNLICENSED",
14
14
  "dependencies": {
15
- "@oanda/labs-widget-common": "^1.0.150",
15
+ "@oanda/labs-widget-common": "^1.0.152",
16
16
  "@oanda/mono-i18n": "10.0.1",
17
17
  "graphql": "16.8.1",
18
18
  "react-fast-marquee": "1.6.5"
@@ -21,5 +21,5 @@
21
21
  "@graphql-codegen/cli": "5.0.0",
22
22
  "@graphql-codegen/client-preset": "4.1.0"
23
23
  },
24
- "gitHead": "bc89a81b65b183de5f94a884b9d338b4b06e582a"
24
+ "gitHead": "d98506afc65c02ba755debfd2a9ba6d6e14279f5"
25
25
  }
@@ -1,44 +1,17 @@
1
- import React, { useEffect, useState } from 'react';
1
+ import React, { useEffect } from 'react';
2
2
  import Marquee from 'react-fast-marquee';
3
3
  import classnames from 'classnames';
4
- import { useQuery } from '@apollo/client';
5
- import {
6
- ChartError, DataRecord, Tooltip, useLiveRatesQuery,
7
- } from '@oanda/labs-widget-common';
4
+ import { Tooltip, useLiveRatesQuery } from '@oanda/labs-widget-common';
8
5
  import { MainProps } from './types';
9
- import {
10
- ValidateInstrumentsQuery,
11
- ValidateInstrumentsQueryVariables,
12
- } from '../gql/types/graphql';
13
- import { validateInstruments } from '../gql/validateInstruments';
14
- import { getRecords } from './utils';
15
- import { InstrumentRateWithChart } from './components/InstrumentRateWithChart';
16
6
  import { INSTRUMENT_TOOLTIP_ID } from './constant';
7
+ import { InstrumentRateWithData } from './components/InstrumentRateWithData';
17
8
 
18
9
  const Main = ({
19
- instruments,
10
+ records,
20
11
  division,
21
12
  size: widgetSize = 'fullWithChart',
22
13
  }: MainProps) => {
23
- const [records, setRecords] = useState<DataRecord[]>([]);
24
14
  const { target, setQuery } = useLiveRatesQuery();
25
- const { loading, data, error } = useQuery<
26
- ValidateInstrumentsQuery,
27
- ValidateInstrumentsQueryVariables
28
- >(validateInstruments, {
29
- variables: {
30
- instruments,
31
- division,
32
- },
33
- fetchPolicy: 'network-only',
34
- });
35
-
36
- useEffect(() => {
37
- if (!loading && data) {
38
- setRecords(getRecords(data)!);
39
- }
40
- // eslint-disable-next-line react-hooks/exhaustive-deps
41
- }, [loading, data]);
42
15
 
43
16
  const instrumentsNames = records.map(({ instrument: instrumentName }) => instrumentName);
44
17
 
@@ -49,13 +22,10 @@ const Main = ({
49
22
  // eslint-disable-next-line react-hooks/exhaustive-deps
50
23
  }, [records]);
51
24
 
52
- const showError = !!error;
53
- const isLoading = loading || !data;
54
-
55
25
  return (
56
26
  <div data-testid="ticker-tape-wrapper">
57
27
  <Marquee
58
- play={!isLoading}
28
+ play={records.length > 0}
59
29
  autoFill
60
30
  pauseOnHover
61
31
  speed={60}
@@ -68,8 +38,7 @@ const Main = ({
68
38
  'lw-h-[54px]': widgetSize === 'compact',
69
39
  })}
70
40
  >
71
- <InstrumentRateWithChart
72
- loading={loading}
41
+ <InstrumentRateWithData
73
42
  record={record}
74
43
  target={target}
75
44
  division={division}
@@ -79,11 +48,6 @@ const Main = ({
79
48
  ))}
80
49
  </Marquee>
81
50
  <Tooltip id={INSTRUMENT_TOOLTIP_ID} />
82
- {!loading && showError && (
83
- <div className="lw-flex lw-h-[150px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary">
84
- <ChartError />
85
- </div>
86
- )}
87
51
  </div>
88
52
  );
89
53
  };
@@ -1,12 +1,10 @@
1
- import React from 'react';
1
+ import React, { Suspense } from 'react';
2
2
  import { ApolloClient, InMemoryCache, ApolloProvider } from '@apollo/client';
3
3
  import { LocaleProvider } from '@oanda/mono-i18n';
4
- import {
5
- ChartError, LiveRatesProvider, ThemeProvider, getLocale,
6
- } from '@oanda/labs-widget-common';
4
+ import { LiveRatesProvider, ThemeProvider, getLocale } from '@oanda/labs-widget-common';
7
5
  import { translations } from '../translations';
8
- import { Main } from './Main';
9
6
  import { Division, TickerTapeConfig } from './types';
7
+ import { ValidationWrapper } from './ValidationWrapper';
10
8
 
11
9
  const TickerTapeWidget = ({
12
10
  graphqlUrl,
@@ -35,18 +33,14 @@ const TickerTapeWidget = ({
35
33
  options={{ divisionCode, dataSource }}
36
34
  >
37
35
  <ApolloProvider client={client}>
38
- {isParamError ? (
39
- <div className="lw-flex lw-h-[425px] lw-w-full lw-items-center lw-border lw-border-solid lw-border-border-primary">
40
- <ChartError />
41
- </div>
42
- )
43
- : (
44
- <Main
45
- size={size}
46
- instruments={instruments}
47
- division={division}
48
- />
49
- )}
36
+ <Suspense>
37
+ <ValidationWrapper
38
+ size={size}
39
+ instruments={instruments}
40
+ division={division}
41
+ isParamError={isParamError}
42
+ />
43
+ </Suspense>
50
44
  </ApolloProvider>
51
45
  </LiveRatesProvider>
52
46
  </LocaleProvider>
@@ -0,0 +1,52 @@
1
+ import React from 'react';
2
+ import { useSuspenseQuery } from '@apollo/client';
3
+ import classnames from 'classnames';
4
+ import { Error } from '@oanda/labs-widget-common';
5
+ import { validateInstruments } from '../gql/validateInstruments';
6
+ import { ValidateInstrumentsQuery, ValidateInstrumentsQueryVariables } from '../gql/types/graphql';
7
+ import { Main } from './Main';
8
+ import { getRecords } from './utils';
9
+ import { ValidationWrapperProps } from './types';
10
+
11
+ const ValidationWrapper = ({
12
+ instruments,
13
+ division,
14
+ size: widgetSize,
15
+ isParamError,
16
+ }: ValidationWrapperProps) => {
17
+ const { data, error } = useSuspenseQuery<
18
+ ValidateInstrumentsQuery,
19
+ ValidateInstrumentsQueryVariables
20
+ >(validateInstruments, {
21
+ variables: {
22
+ instruments,
23
+ division,
24
+ },
25
+ fetchPolicy: 'network-only',
26
+ });
27
+
28
+ const showError = !!error || isParamError;
29
+
30
+ return (
31
+ <>
32
+ {!showError && (
33
+ <Main
34
+ size={widgetSize}
35
+ division={division}
36
+ records={getRecords(data)!}
37
+ />
38
+ )}
39
+ {showError && (
40
+ <div className={classnames('lw-flex lw-border lw-border-solid lw-border-border-primary lw-px-4 lw-text-sm lw-tracking-normal lw-text-text-primary', {
41
+ 'lw-h-[82px]': widgetSize !== 'compact',
42
+ 'lw-h-[54px]': widgetSize === 'compact',
43
+ })}
44
+ >
45
+ <Error />
46
+ </div>
47
+ )}
48
+ </>
49
+ );
50
+ };
51
+
52
+ export { ValidationWrapper };
@@ -0,0 +1,40 @@
1
+ import React from 'react';
2
+ import { useBackgroundQuery } from '@apollo/client';
3
+ import { InstrumentRateWithChart } from '@oanda/labs-widget-common';
4
+ import { InstrumentRateWithDataProps } from './types';
5
+ import { INSTRUMENT_TOOLTIP_ID } from '../../constant';
6
+ import { getInstrumentsChart } from '../../../gql/getInstrumentsChart';
7
+ import { GetInstrumentsChartQuery, GetInstrumentsChartQueryVariables } from '../../../gql/types/graphql';
8
+
9
+ const InstrumentRateWithData = ({
10
+ record,
11
+ division,
12
+ target,
13
+ size,
14
+ }: InstrumentRateWithDataProps) => {
15
+ const hasInstrument = !!record.instrument;
16
+
17
+ const [queryRef] = useBackgroundQuery<
18
+ GetInstrumentsChartQuery,
19
+ GetInstrumentsChartQueryVariables
20
+ >(getInstrumentsChart, {
21
+ variables: {
22
+ instruments: [record.instrument],
23
+ division,
24
+ },
25
+ fetchPolicy: 'network-only',
26
+ skip: !hasInstrument,
27
+ });
28
+
29
+ return (
30
+ <InstrumentRateWithChart<GetInstrumentsChartQuery>
31
+ record={record}
32
+ target={target}
33
+ size={size}
34
+ tooltipId={INSTRUMENT_TOOLTIP_ID}
35
+ queryRef={queryRef}
36
+ />
37
+ );
38
+ };
39
+
40
+ export { InstrumentRateWithData };
@@ -0,0 +1 @@
1
+ export * from './InstrumentRateWithData';
@@ -0,0 +1,9 @@
1
+ import { DataRecord, WidgetSize } from '@oanda/labs-widget-common';
2
+ import { Division } from '../../types';
3
+
4
+ export interface InstrumentRateWithDataProps {
5
+ record: DataRecord;
6
+ target: EventTarget | null;
7
+ division: Division;
8
+ size?: WidgetSize
9
+ }
@@ -1,5 +1,5 @@
1
1
  import { Locale } from '@oanda/mono-i18n';
2
- import { Theme } from '@oanda/labs-widget-common';
2
+ import { DataRecord, Theme, WidgetSize } from '@oanda/labs-widget-common';
3
3
  import { Division } from '../gql/types/graphql';
4
4
 
5
5
  export { Locale } from '@oanda/mono-i18n';
@@ -14,11 +14,16 @@ export interface TickerTapeConfig {
14
14
  theme?: Theme;
15
15
  isParamError?: boolean;
16
16
  removePadding?: boolean;
17
- size?: 'compact' | 'full' | 'fullWithChart';
17
+ size?: WidgetSize;
18
18
  }
19
-
20
- export interface MainProps {
19
+ export interface ValidationWrapperProps {
21
20
  instruments: string[];
22
21
  division: Division;
23
- size?: 'compact' | 'full' | 'fullWithChart'
22
+ size?: WidgetSize;
23
+ isParamError?: boolean;
24
+ }
25
+ export interface MainProps {
26
+ records: DataRecord[];
27
+ division: Division;
28
+ size?: WidgetSize;
24
29
  }
@@ -9,6 +9,10 @@ import { Division } from '../src/gql/types/graphql';
9
9
  import { widgetMocks } from './mocks';
10
10
  import { Main } from '../src/TickerTapeWidget/Main';
11
11
 
12
+ jest.mock('../src/TickerTapeWidget/components/InstrumentRateWithData', () => ({
13
+ InstrumentRateWithData: () => <div>Test</div>,
14
+ }));
15
+
12
16
  describe('Main component', () => {
13
17
  it('should render ticker tape component', async () => {
14
18
  const { findByTestId } = render(
@@ -16,7 +20,10 @@ describe('Main component', () => {
16
20
  <ThemeContext.Provider value={{ size: Size.DESKTOP, isDark: true }}>
17
21
  <Main
18
22
  division={Division.Oc}
19
- instruments={['EUR_USD']}
23
+ records={[{
24
+ instrument: 'EUR_USD',
25
+ displayName: 'EUR/USD',
26
+ }]}
20
27
  />
21
28
  </ThemeContext.Provider>
22
29
  </MockedProvider>,
@@ -1,46 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.InstrumentRateWithChart = void 0;
7
- var _react = _interopRequireWildcard(require("react"));
8
- var _labsWidgetCommon = require("@oanda/labs-widget-common");
9
- var _utils = require("./utils");
10
- var _constant = require("../../constant");
11
- var _LineChartWithData = require("../LineChartWithData");
12
- var _utils2 = require("../../utils");
13
- 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); }
14
- 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; }
15
- const InstrumentRateWithChart = _ref => {
16
- let {
17
- loading,
18
- record,
19
- target,
20
- division,
21
- size
22
- } = _ref;
23
- const {
24
- isDark
25
- } = (0, _react.useContext)(_labsWidgetCommon.ThemeContext);
26
- const {
27
- updatedRecord,
28
- error
29
- } = (0, _utils2.useRecords)(record, record.instrument ? target : null);
30
- const indicator = (0, _utils.getColorIndicator)(updatedRecord.dailyPercentChange);
31
- return _react.default.createElement(_react.default.Fragment, null, _react.default.createElement(_labsWidgetCommon.InstrumentRate, {
32
- isLoading: loading,
33
- isError: !!error,
34
- record: updatedRecord,
35
- size: size,
36
- tooltipId: _constant.INSTRUMENT_TOOLTIP_ID,
37
- colorIndicator: indicator
38
- }), size === 'fullWithChart' && _react.default.createElement(_LineChartWithData.LineChartWithData, {
39
- record: record,
40
- isLoading: loading,
41
- division: division,
42
- color: (0, _utils.getChartColor)(indicator, isDark)
43
- }));
44
- };
45
- exports.InstrumentRateWithChart = InstrumentRateWithChart;
46
- //# sourceMappingURL=InstrumentRateWithChart.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"InstrumentRateWithChart.js","names":["_react","_interopRequireWildcard","require","_labsWidgetCommon","_utils","_constant","_LineChartWithData","_utils2","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","InstrumentRateWithChart","_ref","loading","record","target","division","size","isDark","useContext","ThemeContext","updatedRecord","error","useRecords","instrument","indicator","getColorIndicator","dailyPercentChange","createElement","Fragment","InstrumentRate","isLoading","isError","tooltipId","INSTRUMENT_TOOLTIP_ID","colorIndicator","LineChartWithData","color","getChartColor","exports"],"sources":["../../../../../src/TickerTapeWidget/components/InstrumentRateWithChart/InstrumentRateWithChart.tsx"],"sourcesContent":["import React, { useContext } from 'react';\nimport { InstrumentRate, ThemeContext } from '@oanda/labs-widget-common';\nimport { InstrumentRateWithChartProps } from './types';\nimport { getChartColor, getColorIndicator } from './utils';\nimport { INSTRUMENT_TOOLTIP_ID } from '../../constant';\nimport { LineChartWithData } from '../LineChartWithData';\nimport { useRecords } from '../../utils';\n\nconst InstrumentRateWithChart = ({\n loading,\n record,\n target,\n division,\n size,\n}: InstrumentRateWithChartProps) => {\n const { isDark } = useContext(ThemeContext);\n const { updatedRecord, error } = useRecords(record, record.instrument ? target : null);\n\n const indicator = getColorIndicator(updatedRecord.dailyPercentChange);\n\n return (\n <>\n <InstrumentRate\n isLoading={loading}\n isError={!!error}\n record={updatedRecord}\n size={size}\n tooltipId={INSTRUMENT_TOOLTIP_ID}\n colorIndicator={indicator}\n />\n {size === 'fullWithChart' && (\n <LineChartWithData\n record={record}\n isLoading={loading}\n division={division}\n color={getChartColor(indicator, isDark)}\n />\n )}\n </>\n );\n};\n\nexport { InstrumentRateWithChart };\n"],"mappings":"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","ignoreList":[]}
@@ -1,28 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- var _InstrumentRateWithChart = require("./InstrumentRateWithChart");
7
- Object.keys(_InstrumentRateWithChart).forEach(function (key) {
8
- if (key === "default" || key === "__esModule") return;
9
- if (key in exports && exports[key] === _InstrumentRateWithChart[key]) return;
10
- Object.defineProperty(exports, key, {
11
- enumerable: true,
12
- get: function () {
13
- return _InstrumentRateWithChart[key];
14
- }
15
- });
16
- });
17
- var _utils = require("./utils");
18
- Object.keys(_utils).forEach(function (key) {
19
- if (key === "default" || key === "__esModule") return;
20
- if (key in exports && exports[key] === _utils[key]) return;
21
- Object.defineProperty(exports, key, {
22
- enumerable: true,
23
- get: function () {
24
- return _utils[key];
25
- }
26
- });
27
- });
28
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","names":["_InstrumentRateWithChart","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get","_utils"],"sources":["../../../../../src/TickerTapeWidget/components/InstrumentRateWithChart/index.ts"],"sourcesContent":["export * from './InstrumentRateWithChart';\nexport * from './utils';\n"],"mappings":";;;;;AAAA,IAAAA,wBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,wBAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,wBAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,wBAAA,CAAAK,GAAA;IAAA;EAAA;AAAA;AACA,IAAAK,MAAA,GAAAT,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAO,MAAA,EAAAN,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAK,MAAA,CAAAL,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAC,MAAA,CAAAL,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}
@@ -1 +0,0 @@
1
- {"version":3,"file":"types.js","names":[],"sources":["../../../../../src/TickerTapeWidget/components/InstrumentRateWithChart/types.ts"],"sourcesContent":["import { DataRecord } from '@oanda/labs-widget-common';\nimport { Division } from '../../types';\n\nexport interface InstrumentRateWithChartProps {\n loading: boolean;\n record: DataRecord;\n target: EventTarget | null;\n division: Division;\n size?: 'compact' | 'full' | 'fullWithChart'\n}\n"],"mappings":"","ignoreList":[]}
@@ -1,25 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.getColorIndicator = exports.getChartColor = void 0;
7
- var _labsWidgetCommon = require("@oanda/labs-widget-common");
8
- const getColorIndicator = dailyChange => {
9
- const numberValue = Number(dailyChange?.substring(0, dailyChange.length - 1));
10
- return Math.sign(numberValue);
11
- };
12
- exports.getColorIndicator = getColorIndicator;
13
- const getChartColor = (indicator, isDarkMode) => {
14
- const theme = isDarkMode ? _labsWidgetCommon.darkTheme : _labsWidgetCommon.lightTheme;
15
- switch (indicator) {
16
- case 1:
17
- return theme.textOk;
18
- case -1:
19
- return theme.textDanger;
20
- default:
21
- return theme.textDisabled;
22
- }
23
- };
24
- exports.getChartColor = getChartColor;
25
- //# sourceMappingURL=utils.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"utils.js","names":["_labsWidgetCommon","require","getColorIndicator","dailyChange","numberValue","Number","substring","length","Math","sign","exports","getChartColor","indicator","isDarkMode","theme","darkTheme","lightTheme","textOk","textDanger","textDisabled"],"sources":["../../../../../src/TickerTapeWidget/components/InstrumentRateWithChart/utils.ts"],"sourcesContent":["import { lightTheme, darkTheme } from '@oanda/labs-widget-common';\n\nconst getColorIndicator = (dailyChange?: string) => {\n const numberValue = Number(dailyChange?.substring(0, dailyChange.length - 1));\n\n return Math.sign(numberValue);\n};\n\nconst getChartColor = (indicator?: number, isDarkMode?: boolean) => {\n const theme = isDarkMode ? darkTheme : lightTheme;\n\n switch (indicator) {\n case 1:\n return theme.textOk;\n case -1:\n return theme.textDanger;\n default:\n return theme.textDisabled;\n }\n};\n\nexport {\n getColorIndicator,\n getChartColor,\n};\n"],"mappings":";;;;;;AAAA,IAAAA,iBAAA,GAAAC,OAAA;AAEA,MAAMC,iBAAiB,GAAIC,WAAoB,IAAK;EAClD,MAAMC,WAAW,GAAGC,MAAM,CAACF,WAAW,EAAEG,SAAS,CAAC,CAAC,EAAEH,WAAW,CAACI,MAAM,GAAG,CAAC,CAAC,CAAC;EAE7E,OAAOC,IAAI,CAACC,IAAI,CAACL,WAAW,CAAC;AAC/B,CAAC;AAACM,OAAA,CAAAR,iBAAA,GAAAA,iBAAA;AAEF,MAAMS,aAAa,GAAGA,CAACC,SAAkB,EAAEC,UAAoB,KAAK;EAClE,MAAMC,KAAK,GAAGD,UAAU,GAAGE,2BAAS,GAAGC,4BAAU;EAEjD,QAAQJ,SAAS;IACf,KAAK,CAAC;MACJ,OAAOE,KAAK,CAACG,MAAM;IACrB,KAAK,CAAC,CAAC;MACL,OAAOH,KAAK,CAACI,UAAU;IACzB;MACE,OAAOJ,KAAK,CAACK,YAAY;EAC7B;AACF,CAAC;AAACT,OAAA,CAAAC,aAAA,GAAAA,aAAA","ignoreList":[]}
@@ -1,42 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.LineChartWithData = void 0;
7
- var _react = _interopRequireDefault(require("react"));
8
- var _client = require("@apollo/client");
9
- var _labsWidgetCommon = require("@oanda/labs-widget-common");
10
- var _getInstrumentsChart = require("../../../gql/getInstrumentsChart");
11
- function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
12
- const LineChartWithData = _ref => {
13
- let {
14
- record,
15
- isLoading,
16
- division,
17
- color
18
- } = _ref;
19
- const {
20
- loading,
21
- data
22
- } = (0, _client.useQuery)(_getInstrumentsChart.getInstrumentsChart, {
23
- variables: {
24
- instruments: [record.instrument],
25
- division
26
- },
27
- fetchPolicy: 'network-only',
28
- skip: !record.instrument
29
- });
30
- const showChart = isLoading || loading;
31
- const chart = data?.topicalInstrumentsCharts?.[0].chart || [];
32
- return _react.default.createElement("div", {
33
- className: "lw-relative"
34
- }, !showChart ? _react.default.createElement("div", {
35
- className: "lw-absolute lw-bottom-0 lw-right-0 lw--z-50 lw-flex lw-h-10 lw-w-[100px] lw-items-center lw-justify-center"
36
- }, _react.default.createElement(_labsWidgetCommon.LineChart, {
37
- color: color,
38
- data: chart
39
- })) : null);
40
- };
41
- exports.LineChartWithData = LineChartWithData;
42
- //# sourceMappingURL=LineChartWithData.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"LineChartWithData.js","names":["_react","_interopRequireDefault","require","_client","_labsWidgetCommon","_getInstrumentsChart","e","__esModule","default","LineChartWithData","_ref","record","isLoading","division","color","loading","data","useQuery","getInstrumentsChart","variables","instruments","instrument","fetchPolicy","skip","showChart","chart","topicalInstrumentsCharts","createElement","className","LineChart","exports"],"sources":["../../../../../src/TickerTapeWidget/components/LineChartWithData/LineChartWithData.tsx"],"sourcesContent":["import React from 'react';\nimport { useQuery } from '@apollo/client';\nimport { LineChart } from '@oanda/labs-widget-common';\nimport { LineChartWithDataProps } from './types';\nimport { getInstrumentsChart } from '../../../gql/getInstrumentsChart';\nimport { GetInstrumentsChartQuery, GetInstrumentsChartQueryVariables } from '../../../gql/types/graphql';\n\nconst LineChartWithData = ({\n record,\n isLoading,\n division,\n color,\n}: LineChartWithDataProps) => {\n const { loading, data } = useQuery<\n GetInstrumentsChartQuery,\n GetInstrumentsChartQueryVariables\n >(getInstrumentsChart, {\n variables: {\n instruments: [record.instrument],\n division,\n },\n fetchPolicy: 'network-only',\n skip: !record.instrument,\n });\n\n const showChart = isLoading || loading;\n const chart = data?.topicalInstrumentsCharts?.[0].chart || [];\n\n return (\n <div className=\"lw-relative\">\n {!showChart ? (\n <div className=\"lw-absolute lw-bottom-0 lw-right-0 lw--z-50 lw-flex lw-h-10 lw-w-[100px] lw-items-center lw-justify-center\">\n <LineChart\n color={color}\n data={chart}\n />\n </div>\n ) : null}\n </div>\n );\n};\n\nexport { LineChartWithData };\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,iBAAA,GAAAF,OAAA;AAEA,IAAAG,oBAAA,GAAAH,OAAA;AAAuE,SAAAD,uBAAAK,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAGvE,MAAMG,iBAAiB,GAAGC,IAAA,IAKI;EAAA,IALH;IACzBC,MAAM;IACNC,SAAS;IACTC,QAAQ;IACRC;EACsB,CAAC,GAAAJ,IAAA;EACvB,MAAM;IAAEK,OAAO;IAAEC;EAAK,CAAC,GAAG,IAAAC,gBAAQ,EAGhCC,wCAAmB,EAAE;IACrBC,SAAS,EAAE;MACTC,WAAW,EAAE,CAACT,MAAM,CAACU,UAAU,CAAC;MAChCR;IACF,CAAC;IACDS,WAAW,EAAE,cAAc;IAC3BC,IAAI,EAAE,CAACZ,MAAM,CAACU;EAChB,CAAC,CAAC;EAEF,MAAMG,SAAS,GAAGZ,SAAS,IAAIG,OAAO;EACtC,MAAMU,KAAK,GAAGT,IAAI,EAAEU,wBAAwB,GAAG,CAAC,CAAC,CAACD,KAAK,IAAI,EAAE;EAE7D,OACEzB,MAAA,CAAAQ,OAAA,CAAAmB,aAAA;IAAKC,SAAS,EAAC;EAAa,GACzB,CAACJ,SAAS,GACTxB,MAAA,CAAAQ,OAAA,CAAAmB,aAAA;IAAKC,SAAS,EAAC;EAA4G,GACzH5B,MAAA,CAAAQ,OAAA,CAAAmB,aAAA,CAACvB,iBAAA,CAAAyB,SAAS;IACRf,KAAK,EAAEA,KAAM;IACbE,IAAI,EAAES;EAAM,CACb,CACE,CAAC,GACJ,IACD,CAAC;AAEV,CAAC;AAACK,OAAA,CAAArB,iBAAA,GAAAA,iBAAA","ignoreList":[]}
@@ -1,17 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- var _LineChartWithData = require("./LineChartWithData");
7
- Object.keys(_LineChartWithData).forEach(function (key) {
8
- if (key === "default" || key === "__esModule") return;
9
- if (key in exports && exports[key] === _LineChartWithData[key]) return;
10
- Object.defineProperty(exports, key, {
11
- enumerable: true,
12
- get: function () {
13
- return _LineChartWithData[key];
14
- }
15
- });
16
- });
17
- //# sourceMappingURL=index.js.map
@@ -1 +0,0 @@
1
- {"version":3,"file":"index.js","names":["_LineChartWithData","require","Object","keys","forEach","key","exports","defineProperty","enumerable","get"],"sources":["../../../../../src/TickerTapeWidget/components/LineChartWithData/index.ts"],"sourcesContent":["export * from './LineChartWithData';\n"],"mappings":";;;;;AAAA,IAAAA,kBAAA,GAAAC,OAAA;AAAAC,MAAA,CAAAC,IAAA,CAAAH,kBAAA,EAAAI,OAAA,WAAAC,GAAA;EAAA,IAAAA,GAAA,kBAAAA,GAAA;EAAA,IAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,kBAAA,CAAAK,GAAA;EAAAH,MAAA,CAAAK,cAAA,CAAAD,OAAA,EAAAD,GAAA;IAAAG,UAAA;IAAAC,GAAA,WAAAA,CAAA;MAAA,OAAAT,kBAAA,CAAAK,GAAA;IAAA;EAAA;AAAA","ignoreList":[]}