@oanda/labs-currency-cross-table 1.0.7 → 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.
- package/CHANGELOG.md +36 -0
- package/dist/main/CurrencyCrossTableWidget/Main.js +8 -8
- package/dist/main/CurrencyCrossTableWidget/Main.js.map +1 -1
- package/dist/main/CurrencyCrossTableWidget/components/Cell.js +2 -4
- package/dist/main/CurrencyCrossTableWidget/components/Cell.js.map +1 -1
- package/dist/main/CurrencyCrossTableWidget/components/CellValidationWrapper.js +0 -2
- package/dist/main/CurrencyCrossTableWidget/components/CellValidationWrapper.js.map +1 -1
- package/dist/main/CurrencyCrossTableWidget/components/CellWithData.js +0 -2
- package/dist/main/CurrencyCrossTableWidget/components/CellWithData.js.map +1 -1
- package/dist/main/CurrencyCrossTableWidget/components/TextCell.js +7 -5
- package/dist/main/CurrencyCrossTableWidget/components/TextCell.js.map +1 -1
- package/dist/main/CurrencyCrossTableWidget/components/types.js.map +1 -1
- package/dist/module/CurrencyCrossTableWidget/Main.js +8 -8
- package/dist/module/CurrencyCrossTableWidget/Main.js.map +1 -1
- package/dist/module/CurrencyCrossTableWidget/components/Cell.js +2 -4
- package/dist/module/CurrencyCrossTableWidget/components/Cell.js.map +1 -1
- package/dist/module/CurrencyCrossTableWidget/components/CellValidationWrapper.js +0 -2
- package/dist/module/CurrencyCrossTableWidget/components/CellValidationWrapper.js.map +1 -1
- package/dist/module/CurrencyCrossTableWidget/components/CellWithData.js +0 -2
- package/dist/module/CurrencyCrossTableWidget/components/CellWithData.js.map +1 -1
- package/dist/module/CurrencyCrossTableWidget/components/TextCell.js +7 -5
- package/dist/module/CurrencyCrossTableWidget/components/TextCell.js.map +1 -1
- package/dist/module/CurrencyCrossTableWidget/components/types.js.map +1 -1
- package/dist/types/CurrencyCrossTableWidget/components/Cell.d.ts +1 -1
- package/dist/types/CurrencyCrossTableWidget/components/CellValidationWrapper.d.ts +1 -1
- package/dist/types/CurrencyCrossTableWidget/components/CellWithData.d.ts +1 -1
- package/dist/types/CurrencyCrossTableWidget/components/TextCell.d.ts +1 -1
- package/dist/types/CurrencyCrossTableWidget/components/types.d.ts +1 -4
- package/package.json +3 -3
- package/src/CurrencyCrossTableWidget/Main.tsx +5 -7
- package/src/CurrencyCrossTableWidget/components/Cell.tsx +2 -4
- package/src/CurrencyCrossTableWidget/components/CellValidationWrapper.tsx +0 -2
- package/src/CurrencyCrossTableWidget/components/CellWithData.tsx +0 -2
- package/src/CurrencyCrossTableWidget/components/TextCell.tsx +6 -4
- package/src/CurrencyCrossTableWidget/components/types.ts +1 -4
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,42 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
## 1.0.8 (2024-09-04)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
|
|
10
|
+
## 1.0.156 (2024-09-02)
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
## 1.0.155 (2024-08-29)
|
|
15
|
+
|
|
16
|
+
|
|
17
|
+
|
|
18
|
+
## 1.0.154 (2024-08-29)
|
|
19
|
+
|
|
20
|
+
|
|
21
|
+
|
|
22
|
+
## 1.0.153 (2024-08-23)
|
|
23
|
+
|
|
24
|
+
|
|
25
|
+
|
|
26
|
+
## 1.0.152 (2024-08-23)
|
|
27
|
+
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
## 1.0.151 (2024-08-20)
|
|
31
|
+
|
|
32
|
+
|
|
33
|
+
|
|
34
|
+
## 1.0.150 (2024-08-19)
|
|
35
|
+
|
|
36
|
+
**Note:** Version bump only for package @oanda/labs-currency-cross-table
|
|
37
|
+
|
|
38
|
+
|
|
39
|
+
|
|
40
|
+
|
|
41
|
+
|
|
6
42
|
## 1.0.7 (2024-09-02)
|
|
7
43
|
|
|
8
44
|
|
|
@@ -33,20 +33,22 @@ const Main = _ref => {
|
|
|
33
33
|
}, instruments);
|
|
34
34
|
return _react.default.createElement("div", {
|
|
35
35
|
"data-testid": "currency-cross-table-wrapper",
|
|
36
|
-
className: "lw-w-full"
|
|
36
|
+
className: "lw-w-full lw-overflow-x-auto lw-overflow-y-hidden lw-border lw-border-b-0 lw-border-solid lw-border-border-primary"
|
|
37
37
|
}, _react.default.createElement("div", {
|
|
38
|
-
className: "lw-flex lw-
|
|
39
|
-
}, _react.default.createElement(_components.TextCell,
|
|
38
|
+
className: "lw-flex lw-w-max lw-min-w-full"
|
|
39
|
+
}, _react.default.createElement(_components.TextCell, {
|
|
40
|
+
sticky: true
|
|
41
|
+
}), currencies.map(pair => _react.default.createElement(_components.TextCell, {
|
|
40
42
|
key: pair,
|
|
41
43
|
label: pair,
|
|
42
44
|
hovered: pair === selectedPair
|
|
43
45
|
}))), currencies.map((currency, index, arr) => _react.default.createElement("div", {
|
|
44
46
|
key: currency,
|
|
45
|
-
className: "lw-flex lw-
|
|
47
|
+
className: "lw-flex lw-w-max lw-min-w-full"
|
|
46
48
|
}, _react.default.createElement(_components.TextCell, {
|
|
47
49
|
label: currency,
|
|
48
|
-
|
|
49
|
-
|
|
50
|
+
hovered: currency === selectedCurrency,
|
|
51
|
+
sticky: true
|
|
50
52
|
}), arr.map(pair => _react.default.createElement(_react.Fragment, {
|
|
51
53
|
key: `${currency}_${pair}`
|
|
52
54
|
}, currency !== pair ? _react.default.createElement(_react.Suspense, null, _react.default.createElement(_CellValidationWrapper.CellValidationWrapper, {
|
|
@@ -54,12 +56,10 @@ const Main = _ref => {
|
|
|
54
56
|
pair: pair,
|
|
55
57
|
instrument: `${currency}${(0, _utils.divisionMapper)(division)}${pair}`,
|
|
56
58
|
target: target,
|
|
57
|
-
additionalBorderBottom: index === arr.length - 1,
|
|
58
59
|
setSelectedCurrency: setSelectedCurrency,
|
|
59
60
|
setSelectedPair: setSelectedPair,
|
|
60
61
|
division: division
|
|
61
62
|
})) : _react.default.createElement(_components.TextCell, {
|
|
62
|
-
additionalBorderBottom: index === arr.length - 1,
|
|
63
63
|
emptyIndicator: true
|
|
64
64
|
}))))));
|
|
65
65
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Main.js","names":["_react","_interopRequireWildcard","require","_labsWidgetCommon","_components","_CellValidationWrapper","_utils","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Main","_ref","instruments","currencies","division","selectedCurrency","setSelectedCurrency","useState","selectedPair","setSelectedPair","hasInstruments","length","target","setQuery","useLiveRatesQuery","useEffect","createElement","className","TextCell","map","pair","key","label","hovered","currency","index","arr","
|
|
1
|
+
{"version":3,"file":"Main.js","names":["_react","_interopRequireWildcard","require","_labsWidgetCommon","_components","_CellValidationWrapper","_utils","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Main","_ref","instruments","currencies","division","selectedCurrency","setSelectedCurrency","useState","selectedPair","setSelectedPair","hasInstruments","length","target","setQuery","useLiveRatesQuery","useEffect","createElement","className","TextCell","sticky","map","pair","key","label","hovered","currency","index","arr","Fragment","Suspense","CellValidationWrapper","instrument","divisionMapper","emptyIndicator","exports"],"sources":["../../../src/CurrencyCrossTableWidget/Main.tsx"],"sourcesContent":["import React, {\n Fragment, Suspense, useEffect, useState,\n} from 'react';\nimport { useLiveRatesQuery } from '@oanda/labs-widget-common';\nimport { MainProps } from './types';\nimport { TextCell } from './components';\nimport { CellValidationWrapper } from './components/CellValidationWrapper';\nimport { divisionMapper } from './utils';\n\nconst Main = ({\n instruments,\n currencies,\n division,\n}: MainProps) => {\n const [selectedCurrency, setSelectedCurrency] = useState('');\n const [selectedPair, setSelectedPair] = useState('');\n\n const hasInstruments = instruments.length > 0;\n\n const { target, setQuery } = useLiveRatesQuery();\n\n useEffect(() => {\n if (hasInstruments) {\n setQuery({ instruments });\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, instruments);\n\n return (\n <div data-testid=\"currency-cross-table-wrapper\" className=\"lw-w-full lw-overflow-x-auto lw-overflow-y-hidden lw-border lw-border-b-0 lw-border-solid lw-border-border-primary\">\n <div className=\"lw-flex lw-w-max lw-min-w-full\">\n <TextCell sticky />\n {currencies.map(((pair) => (\n <TextCell\n key={pair}\n label={pair}\n hovered={pair === selectedPair}\n />\n )))}\n </div>\n {currencies.map(((currency, index, arr) => (\n <div\n key={currency}\n className=\"lw-flex lw-w-max lw-min-w-full\"\n >\n <TextCell\n label={currency}\n hovered={currency === selectedCurrency}\n sticky\n />\n {arr.map((pair) => (\n <Fragment key={`${currency}_${pair}`}>\n {currency !== pair ? (\n <Suspense>\n <CellValidationWrapper\n currency={currency}\n pair={pair}\n instrument={`${currency}${divisionMapper(division)}${pair}`}\n target={target}\n setSelectedCurrency={setSelectedCurrency}\n setSelectedPair={setSelectedPair}\n division={division}\n />\n </Suspense>\n ) : (\n <TextCell\n emptyIndicator\n />\n )}\n </Fragment>\n ))}\n </div>\n )))}\n </div>\n );\n};\n\nexport { Main };\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -13,15 +13,13 @@ const Cell = _ref => {
|
|
|
13
13
|
children,
|
|
14
14
|
isError,
|
|
15
15
|
isLoading,
|
|
16
|
-
additionalBorderBottom,
|
|
17
16
|
hovered,
|
|
18
17
|
mouseEnterHandler,
|
|
19
18
|
mouseLeaveHandler
|
|
20
19
|
} = _ref;
|
|
21
20
|
return _react.default.createElement("div", {
|
|
22
|
-
className: (0, _classnames.default)('lw-flex lw-h-[
|
|
23
|
-
'lw-border-
|
|
24
|
-
'lw-font-semibold': hovered
|
|
21
|
+
className: (0, _classnames.default)('lw-flex lw-h-11 lw-min-w-[70px] lw-flex-1 lw-items-center lw-justify-center lw-border-b lw-border-r lw-border-solid lw-border-border-primary last:lw-border-r-[0px]', {
|
|
22
|
+
'lw-bg-border-primary lw-font-semibold lw-shadow-innerBorderBgColor': hovered
|
|
25
23
|
}),
|
|
26
24
|
onMouseEnter: mouseEnterHandler,
|
|
27
25
|
onMouseLeave: mouseLeaveHandler
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Cell.js","names":["_react","_interopRequireDefault","require","_classnames","_constant","e","__esModule","default","Cell","_ref","children","isError","isLoading","
|
|
1
|
+
{"version":3,"file":"Cell.js","names":["_react","_interopRequireDefault","require","_classnames","_constant","e","__esModule","default","Cell","_ref","children","isError","isLoading","hovered","mouseEnterHandler","mouseLeaveHandler","createElement","className","classnames","onMouseEnter","onMouseLeave","CELL_LOADING_VALUE","CELL_EMPTY_VALUE","exports"],"sources":["../../../../src/CurrencyCrossTableWidget/components/Cell.tsx"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport { CellProps } from './types';\nimport { CELL_EMPTY_VALUE, CELL_LOADING_VALUE } from '../constant';\n\nconst Cell = ({\n children,\n isError,\n isLoading,\n hovered,\n mouseEnterHandler,\n mouseLeaveHandler,\n}: CellProps) => (\n <div\n className={classnames('lw-flex lw-h-11 lw-min-w-[70px] lw-flex-1 lw-items-center lw-justify-center lw-border-b lw-border-r lw-border-solid lw-border-border-primary last:lw-border-r-[0px]', {\n 'lw-bg-border-primary lw-font-semibold lw-shadow-innerBorderBgColor': hovered,\n })}\n onMouseEnter={mouseEnterHandler}\n onMouseLeave={mouseLeaveHandler}\n >\n {isLoading && <div className=\"lw-px-3 lw-py-3.5\">{CELL_LOADING_VALUE}</div>}\n {!isLoading && !isError && children}\n {!isLoading && isError && (\n <span>{CELL_EMPTY_VALUE}</span>\n )}\n </div>\n);\n\nexport { Cell };\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,WAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAAE,SAAA,GAAAF,OAAA;AAAmE,SAAAD,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEnE,MAAMG,IAAI,GAAGC,IAAA;EAAA,IAAC;IACZC,QAAQ;IACRC,OAAO;IACPC,SAAS;IACTC,OAAO;IACPC,iBAAiB;IACjBC;EACS,CAAC,GAAAN,IAAA;EAAA,OACVT,MAAA,CAAAO,OAAA,CAAAS,aAAA;IACEC,SAAS,EAAE,IAAAC,mBAAU,EAAC,qKAAqK,EAAE;MAC3L,oEAAoE,EAAEL;IACxE,CAAC,CAAE;IACHM,YAAY,EAAEL,iBAAkB;IAChCM,YAAY,EAAEL;EAAkB,GAE/BH,SAAS,IAAIZ,MAAA,CAAAO,OAAA,CAAAS,aAAA;IAAKC,SAAS,EAAC;EAAmB,GAAEI,4BAAwB,CAAC,EAC1E,CAACT,SAAS,IAAI,CAACD,OAAO,IAAID,QAAQ,EAClC,CAACE,SAAS,IAAID,OAAO,IACpBX,MAAA,CAAAO,OAAA,CAAAS,aAAA,eAAOM,0BAAuB,CAE7B,CAAC;AAAA,CACP;AAACC,OAAA,CAAAf,IAAA,GAAAA,IAAA","ignoreList":[]}
|
|
@@ -16,7 +16,6 @@ const CellValidationWrapper = _ref => {
|
|
|
16
16
|
pair,
|
|
17
17
|
instrument,
|
|
18
18
|
target,
|
|
19
|
-
additionalBorderBottom,
|
|
20
19
|
setSelectedCurrency,
|
|
21
20
|
setSelectedPair,
|
|
22
21
|
division
|
|
@@ -41,7 +40,6 @@ const CellValidationWrapper = _ref => {
|
|
|
41
40
|
},
|
|
42
41
|
instrumentForCalculations: instrumentForCalculations,
|
|
43
42
|
target: target,
|
|
44
|
-
additionalBorderBottom: additionalBorderBottom,
|
|
45
43
|
setSelectedCurrency: setSelectedCurrency,
|
|
46
44
|
setSelectedPair: setSelectedPair,
|
|
47
45
|
division: division
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CellValidationWrapper.js","names":["_react","_interopRequireDefault","require","_client","_validateInstruments","_CellWithData","_utils","e","__esModule","default","CellValidationWrapper","_ref","currency","pair","instrument","target","
|
|
1
|
+
{"version":3,"file":"CellValidationWrapper.js","names":["_react","_interopRequireDefault","require","_client","_validateInstruments","_CellWithData","_utils","e","__esModule","default","CellValidationWrapper","_ref","currency","pair","instrument","target","setSelectedCurrency","setSelectedPair","division","error","useSuspenseQuery","validateInstruments","variables","instruments","fetchPolicy","errorPolicy","instrumentForCalculations","divisionMapper","createElement","CellWithData","record","displayName","exports"],"sources":["../../../../src/CurrencyCrossTableWidget/components/CellValidationWrapper.tsx"],"sourcesContent":["import React from 'react';\nimport { useSuspenseQuery } from '@apollo/client';\nimport { CellValidationWrapperProps } from './types';\nimport { ValidateInstrumentsQuery, ValidateInstrumentsQueryVariables } from '../../gql/types/graphql';\nimport { validateInstruments } from '../../gql/validateInstruments';\nimport { CellWithData } from './CellWithData';\nimport { divisionMapper } from '../utils';\n\nconst CellValidationWrapper = ({\n currency,\n pair,\n instrument,\n target,\n setSelectedCurrency,\n setSelectedPair,\n division,\n}: CellValidationWrapperProps) => {\n const { error } = useSuspenseQuery<\n ValidateInstrumentsQuery,\n ValidateInstrumentsQueryVariables\n >(validateInstruments, {\n variables: {\n instruments: [instrument],\n division,\n },\n fetchPolicy: 'network-only',\n errorPolicy: 'all',\n });\n\n const instrumentForCalculations = error ? `${pair}${divisionMapper(division)}${currency}` : '';\n\n return (\n <CellWithData\n currency={currency}\n pair={pair}\n record={{\n instrument,\n displayName: `${currency}${divisionMapper(division)}${pair}`,\n }}\n instrumentForCalculations={instrumentForCalculations}\n target={target}\n setSelectedCurrency={setSelectedCurrency}\n setSelectedPair={setSelectedPair}\n division={division}\n />\n );\n};\n\nexport { CellValidationWrapper };\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AAGA,IAAAE,oBAAA,GAAAF,OAAA;AACA,IAAAG,aAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AAA0C,SAAAD,uBAAAM,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAE1C,MAAMG,qBAAqB,GAAGC,IAAA,IAQI;EAAA,IARH;IAC7BC,QAAQ;IACRC,IAAI;IACJC,UAAU;IACVC,MAAM;IACNC,mBAAmB;IACnBC,eAAe;IACfC;EAC0B,CAAC,GAAAP,IAAA;EAC3B,MAAM;IAAEQ;EAAM,CAAC,GAAG,IAAAC,wBAAgB,EAGhCC,wCAAmB,EAAE;IACrBC,SAAS,EAAE;MACTC,WAAW,EAAE,CAACT,UAAU,CAAC;MACzBI;IACF,CAAC;IACDM,WAAW,EAAE,cAAc;IAC3BC,WAAW,EAAE;EACf,CAAC,CAAC;EAEF,MAAMC,yBAAyB,GAAGP,KAAK,GAAG,GAAGN,IAAI,GAAG,IAAAc,qBAAc,EAACT,QAAQ,CAAC,GAAGN,QAAQ,EAAE,GAAG,EAAE;EAE9F,OACEZ,MAAA,CAAAS,OAAA,CAAAmB,aAAA,CAACvB,aAAA,CAAAwB,YAAY;IACXjB,QAAQ,EAAEA,QAAS;IACnBC,IAAI,EAAEA,IAAK;IACXiB,MAAM,EAAE;MACNhB,UAAU;MACViB,WAAW,EAAE,GAAGnB,QAAQ,GAAG,IAAAe,qBAAc,EAACT,QAAQ,CAAC,GAAGL,IAAI;IAC5D,CAAE;IACFa,yBAAyB,EAAEA,yBAA0B;IACrDX,MAAM,EAAEA,MAAO;IACfC,mBAAmB,EAAEA,mBAAoB;IACzCC,eAAe,EAAEA,eAAgB;IACjCC,QAAQ,EAAEA;EAAS,CACpB,CAAC;AAEN,CAAC;AAACc,OAAA,CAAAtB,qBAAA,GAAAA,qBAAA","ignoreList":[]}
|
|
@@ -17,7 +17,6 @@ const CellWithData = _ref => {
|
|
|
17
17
|
record,
|
|
18
18
|
instrumentForCalculations,
|
|
19
19
|
target,
|
|
20
|
-
additionalBorderBottom,
|
|
21
20
|
setSelectedCurrency,
|
|
22
21
|
setSelectedPair
|
|
23
22
|
} = _ref;
|
|
@@ -48,7 +47,6 @@ const CellWithData = _ref => {
|
|
|
48
47
|
return _react.default.createElement(_Cell.Cell, {
|
|
49
48
|
isLoading: checkLoading('buy'),
|
|
50
49
|
isError: !!liveRatesError,
|
|
51
|
-
additionalBorderBottom: additionalBorderBottom,
|
|
52
50
|
hovered: hovered,
|
|
53
51
|
mouseEnterHandler: handleMouseEnter,
|
|
54
52
|
mouseLeaveHandler: handleMouseLeave
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CellWithData.js","names":["_react","_interopRequireWildcard","require","_labsWidgetCommon","_Cell","_utils","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","CellWithData","_ref","currency","pair","record","instrumentForCalculations","target","
|
|
1
|
+
{"version":3,"file":"CellWithData.js","names":["_react","_interopRequireWildcard","require","_labsWidgetCommon","_Cell","_utils","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","CellWithData","_ref","currency","pair","record","instrumentForCalculations","target","setSelectedCurrency","setSelectedPair","hovered","setHovered","useState","instrumentForUpdates","instrument","update","error","liveRatesError","useLiveRatesMessage","updatedRecord","displayName","buy","ask","buyPriceMovement","askPriceMovement","displayPrecision","checkLoading","id","undefined","handleMouseEnter","handleMouseLeave","createElement","Cell","isLoading","isError","mouseEnterHandler","mouseLeaveHandler","Price","priceMovement","getPriceMovement","movementIndicator","getBuyPrice","toFixed","exports"],"sources":["../../../../src/CurrencyCrossTableWidget/components/CellWithData.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { Price, useLiveRatesMessage } from '@oanda/labs-widget-common';\nimport { Cell } from './Cell';\nimport { CellWithDataProps } from './types';\nimport { getBuyPrice, getPriceMovement } from '../utils';\n\nconst CellWithData = ({\n currency,\n pair,\n record,\n instrumentForCalculations,\n target,\n setSelectedCurrency,\n setSelectedPair,\n}: CellWithDataProps) => {\n const [hovered, setHovered] = useState(false);\n\n const instrumentForUpdates = instrumentForCalculations || record.instrument;\n\n const { update, error: liveRatesError } = useLiveRatesMessage(\n instrumentForUpdates,\n target,\n );\n\n const updatedRecord: Record<string, any> = {\n displayName: record.displayName,\n instrument: record.instrument,\n buy: update?.ask,\n buyPriceMovement: update?.askPriceMovement,\n displayPrecision: update?.displayPrecision,\n };\n\n const checkLoading = (id: string) => (!liveRatesError && updatedRecord?.[id] === undefined);\n\n const handleMouseEnter = () => {\n setHovered(true);\n setSelectedCurrency(currency);\n setSelectedPair(pair);\n };\n\n const handleMouseLeave = () => {\n setHovered(false);\n setSelectedCurrency('');\n setSelectedPair('');\n };\n\n return (\n <Cell\n isLoading={checkLoading('buy')}\n isError={!!liveRatesError}\n hovered={hovered}\n mouseEnterHandler={handleMouseEnter}\n mouseLeaveHandler={handleMouseLeave}\n >\n <Price priceMovement={getPriceMovement(updatedRecord.buyPriceMovement, !!instrumentForCalculations)} movementIndicator=\"background\">\n <span>\n {getBuyPrice(\n updatedRecord.buy,\n !!instrumentForCalculations,\n ).toFixed(updatedRecord.displayPrecision)}\n </span>\n </Price>\n </Cell>\n );\n};\n\nexport { CellWithData };\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -11,14 +11,16 @@ const TextCell = _ref => {
|
|
|
11
11
|
let {
|
|
12
12
|
label,
|
|
13
13
|
emptyIndicator,
|
|
14
|
-
|
|
15
|
-
|
|
14
|
+
hovered,
|
|
15
|
+
sticky
|
|
16
16
|
} = _ref;
|
|
17
17
|
return _react.default.createElement("span", {
|
|
18
|
-
className: (0, _classnames.default)('lw-flex-1 lw-border-r lw-border-solid lw-border-border-primary lw-py-3.5 lw-text-center', {
|
|
19
|
-
'lw-border-b': additionalBorderBottom,
|
|
18
|
+
className: (0, _classnames.default)('lw-h-11 lw-min-w-[70px] lw-flex-1 lw-border-b lw-border-r lw-border-solid lw-border-border-primary lw-py-3.5 lw-text-center last:lw-border-r-[0px]', {
|
|
20
19
|
'lw-bg-border-primary': emptyIndicator,
|
|
21
|
-
'lw-
|
|
20
|
+
'lw-shadow-innerBorderBgColor': emptyIndicator && hovered,
|
|
21
|
+
'lw-bg-border-primary lw-font-semibold': hovered,
|
|
22
|
+
'lw-sticky lw-left-0 lw-z-10': sticky,
|
|
23
|
+
'lw-bg-bg-primary': sticky && !hovered
|
|
22
24
|
})
|
|
23
25
|
}, label);
|
|
24
26
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextCell.js","names":["_react","_interopRequireDefault","require","_classnames","e","__esModule","default","TextCell","_ref","label","emptyIndicator","
|
|
1
|
+
{"version":3,"file":"TextCell.js","names":["_react","_interopRequireDefault","require","_classnames","e","__esModule","default","TextCell","_ref","label","emptyIndicator","hovered","sticky","createElement","className","classnames","exports"],"sources":["../../../../src/CurrencyCrossTableWidget/components/TextCell.tsx"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport { TextCellProps } from './types';\n\nconst TextCell = ({\n label,\n emptyIndicator,\n hovered,\n sticky,\n}: TextCellProps) => (\n <span className={classnames('lw-h-11 lw-min-w-[70px] lw-flex-1 lw-border-b lw-border-r lw-border-solid lw-border-border-primary lw-py-3.5 lw-text-center last:lw-border-r-[0px]', {\n 'lw-bg-border-primary': emptyIndicator,\n 'lw-shadow-innerBorderBgColor': emptyIndicator && hovered,\n 'lw-bg-border-primary lw-font-semibold': hovered,\n 'lw-sticky lw-left-0 lw-z-10': sticky,\n 'lw-bg-bg-primary': sticky && !hovered,\n })}\n >\n {label}\n </span>\n);\n\nexport { TextCell };\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,WAAA,GAAAF,sBAAA,CAAAC,OAAA;AAAoC,SAAAD,uBAAAG,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAGpC,MAAMG,QAAQ,GAAGC,IAAA;EAAA,IAAC;IAChBC,KAAK;IACLC,cAAc;IACdC,OAAO;IACPC;EACa,CAAC,GAAAJ,IAAA;EAAA,OACdR,MAAA,CAAAM,OAAA,CAAAO,aAAA;IAAMC,SAAS,EAAE,IAAAC,mBAAU,EAAC,oJAAoJ,EAAE;MAChL,sBAAsB,EAAEL,cAAc;MACtC,8BAA8B,EAAEA,cAAc,IAAIC,OAAO;MACzD,uCAAuC,EAAEA,OAAO;MAChD,6BAA6B,EAAEC,MAAM;MACrC,kBAAkB,EAAEA,MAAM,IAAI,CAACD;IACjC,CAAC;EAAE,GAEAF,KACG,CAAC;AAAA,CACR;AAACO,OAAA,CAAAT,QAAA,GAAAA,QAAA","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","names":[],"sources":["../../../../src/CurrencyCrossTableWidget/components/types.ts"],"sourcesContent":["import { DataRecord, LoaderSize } from '@oanda/labs-widget-common';\nimport { Division } from '../../gql/types/graphql';\n\nexport interface CellValidationWrapperProps {\n currency: string;\n pair: string;\n instrument: string;\n target: EventTarget | null;\n
|
|
1
|
+
{"version":3,"file":"types.js","names":[],"sources":["../../../../src/CurrencyCrossTableWidget/components/types.ts"],"sourcesContent":["import { DataRecord, LoaderSize } from '@oanda/labs-widget-common';\nimport { Division } from '../../gql/types/graphql';\n\nexport interface CellValidationWrapperProps {\n currency: string;\n pair: string;\n instrument: string;\n target: EventTarget | null;\n division: Division;\n setSelectedCurrency: React.Dispatch<React.SetStateAction<string>>;\n setSelectedPair: React.Dispatch<React.SetStateAction<string>>;\n}\nexport interface CellWithDataProps {\n currency: string;\n pair: string;\n instrumentForCalculations: string;\n record: DataRecord;\n target: EventTarget | null;\n division: Division;\n setSelectedCurrency: React.Dispatch<React.SetStateAction<string>>;\n setSelectedPair: React.Dispatch<React.SetStateAction<string>>;\n}\n\nexport interface CellProps {\n children: React.ReactNode;\n isLoading?: boolean;\n isError?: boolean;\n loaderSize?: LoaderSize;\n hovered: boolean;\n mouseEnterHandler: () => void;\n mouseLeaveHandler: () => void;\n}\n\nexport interface TextCellProps {\n label?: string;\n emptyIndicator?: boolean;\n hovered?: boolean;\n sticky?: boolean;\n}\n"],"mappings":"","ignoreList":[]}
|
|
@@ -25,20 +25,22 @@ const Main = _ref => {
|
|
|
25
25
|
}, instruments);
|
|
26
26
|
return React.createElement("div", {
|
|
27
27
|
"data-testid": "currency-cross-table-wrapper",
|
|
28
|
-
className: "lw-w-full"
|
|
28
|
+
className: "lw-w-full lw-overflow-x-auto lw-overflow-y-hidden lw-border lw-border-b-0 lw-border-solid lw-border-border-primary"
|
|
29
29
|
}, React.createElement("div", {
|
|
30
|
-
className: "lw-flex lw-
|
|
31
|
-
}, React.createElement(TextCell,
|
|
30
|
+
className: "lw-flex lw-w-max lw-min-w-full"
|
|
31
|
+
}, React.createElement(TextCell, {
|
|
32
|
+
sticky: true
|
|
33
|
+
}), currencies.map(pair => React.createElement(TextCell, {
|
|
32
34
|
key: pair,
|
|
33
35
|
label: pair,
|
|
34
36
|
hovered: pair === selectedPair
|
|
35
37
|
}))), currencies.map((currency, index, arr) => React.createElement("div", {
|
|
36
38
|
key: currency,
|
|
37
|
-
className: "lw-flex lw-
|
|
39
|
+
className: "lw-flex lw-w-max lw-min-w-full"
|
|
38
40
|
}, React.createElement(TextCell, {
|
|
39
41
|
label: currency,
|
|
40
|
-
|
|
41
|
-
|
|
42
|
+
hovered: currency === selectedCurrency,
|
|
43
|
+
sticky: true
|
|
42
44
|
}), arr.map(pair => React.createElement(Fragment, {
|
|
43
45
|
key: `${currency}_${pair}`
|
|
44
46
|
}, currency !== pair ? React.createElement(Suspense, null, React.createElement(CellValidationWrapper, {
|
|
@@ -46,12 +48,10 @@ const Main = _ref => {
|
|
|
46
48
|
pair: pair,
|
|
47
49
|
instrument: `${currency}${divisionMapper(division)}${pair}`,
|
|
48
50
|
target: target,
|
|
49
|
-
additionalBorderBottom: index === arr.length - 1,
|
|
50
51
|
setSelectedCurrency: setSelectedCurrency,
|
|
51
52
|
setSelectedPair: setSelectedPair,
|
|
52
53
|
division: division
|
|
53
54
|
})) : React.createElement(TextCell, {
|
|
54
|
-
additionalBorderBottom: index === arr.length - 1,
|
|
55
55
|
emptyIndicator: true
|
|
56
56
|
}))))));
|
|
57
57
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Main.js","names":["React","Fragment","Suspense","useEffect","useState","useLiveRatesQuery","TextCell","CellValidationWrapper","divisionMapper","Main","_ref","instruments","currencies","division","selectedCurrency","setSelectedCurrency","selectedPair","setSelectedPair","hasInstruments","length","target","setQuery","createElement","className","map","pair","key","label","hovered","currency","index","arr","
|
|
1
|
+
{"version":3,"file":"Main.js","names":["React","Fragment","Suspense","useEffect","useState","useLiveRatesQuery","TextCell","CellValidationWrapper","divisionMapper","Main","_ref","instruments","currencies","division","selectedCurrency","setSelectedCurrency","selectedPair","setSelectedPair","hasInstruments","length","target","setQuery","createElement","className","sticky","map","pair","key","label","hovered","currency","index","arr","instrument","emptyIndicator"],"sources":["../../../src/CurrencyCrossTableWidget/Main.tsx"],"sourcesContent":["import React, {\n Fragment, Suspense, useEffect, useState,\n} from 'react';\nimport { useLiveRatesQuery } from '@oanda/labs-widget-common';\nimport { MainProps } from './types';\nimport { TextCell } from './components';\nimport { CellValidationWrapper } from './components/CellValidationWrapper';\nimport { divisionMapper } from './utils';\n\nconst Main = ({\n instruments,\n currencies,\n division,\n}: MainProps) => {\n const [selectedCurrency, setSelectedCurrency] = useState('');\n const [selectedPair, setSelectedPair] = useState('');\n\n const hasInstruments = instruments.length > 0;\n\n const { target, setQuery } = useLiveRatesQuery();\n\n useEffect(() => {\n if (hasInstruments) {\n setQuery({ instruments });\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, instruments);\n\n return (\n <div data-testid=\"currency-cross-table-wrapper\" className=\"lw-w-full lw-overflow-x-auto lw-overflow-y-hidden lw-border lw-border-b-0 lw-border-solid lw-border-border-primary\">\n <div className=\"lw-flex lw-w-max lw-min-w-full\">\n <TextCell sticky />\n {currencies.map(((pair) => (\n <TextCell\n key={pair}\n label={pair}\n hovered={pair === selectedPair}\n />\n )))}\n </div>\n {currencies.map(((currency, index, arr) => (\n <div\n key={currency}\n className=\"lw-flex lw-w-max lw-min-w-full\"\n >\n <TextCell\n label={currency}\n hovered={currency === selectedCurrency}\n sticky\n />\n {arr.map((pair) => (\n <Fragment key={`${currency}_${pair}`}>\n {currency !== pair ? (\n <Suspense>\n <CellValidationWrapper\n currency={currency}\n pair={pair}\n instrument={`${currency}${divisionMapper(division)}${pair}`}\n target={target}\n setSelectedCurrency={setSelectedCurrency}\n setSelectedPair={setSelectedPair}\n division={division}\n />\n </Suspense>\n ) : (\n <TextCell\n emptyIndicator\n />\n )}\n </Fragment>\n ))}\n </div>\n )))}\n </div>\n );\n};\n\nexport { Main };\n"],"mappings":"AAAA,OAAOA,KAAK,IACVC,QAAQ,EAAEC,QAAQ,EAAEC,SAAS,EAAEC,QAAQ,QAClC,OAAO;AACd,SAASC,iBAAiB,QAAQ,2BAA2B;AAE7D,SAASC,QAAQ,QAAQ,cAAc;AACvC,SAASC,qBAAqB,QAAQ,oCAAoC;AAC1E,SAASC,cAAc,QAAQ,SAAS;AAExC,MAAMC,IAAI,GAAGC,IAAA,IAII;EAAA,IAJH;IACZC,WAAW;IACXC,UAAU;IACVC;EACS,CAAC,GAAAH,IAAA;EACV,MAAM,CAACI,gBAAgB,EAAEC,mBAAmB,CAAC,GAAGX,QAAQ,CAAC,EAAE,CAAC;EAC5D,MAAM,CAACY,YAAY,EAAEC,eAAe,CAAC,GAAGb,QAAQ,CAAC,EAAE,CAAC;EAEpD,MAAMc,cAAc,GAAGP,WAAW,CAACQ,MAAM,GAAG,CAAC;EAE7C,MAAM;IAAEC,MAAM;IAAEC;EAAS,CAAC,GAAGhB,iBAAiB,CAAC,CAAC;EAEhDF,SAAS,CAAC,MAAM;IACd,IAAIe,cAAc,EAAE;MAClBG,QAAQ,CAAC;QAAEV;MAAY,CAAC,CAAC;IAC3B;EAEF,CAAC,EAAEA,WAAW,CAAC;EAEf,OACEX,KAAA,CAAAsB,aAAA;IAAK,eAAY,8BAA8B;IAACC,SAAS,EAAC;EAAoH,GAC5KvB,KAAA,CAAAsB,aAAA;IAAKC,SAAS,EAAC;EAAgC,GAC7CvB,KAAA,CAAAsB,aAAA,CAAChB,QAAQ;IAACkB,MAAM;EAAA,CAAE,CAAC,EAClBZ,UAAU,CAACa,GAAG,CAAGC,IAAI,IACpB1B,KAAA,CAAAsB,aAAA,CAAChB,QAAQ;IACPqB,GAAG,EAAED,IAAK;IACVE,KAAK,EAAEF,IAAK;IACZG,OAAO,EAAEH,IAAI,KAAKV;EAAa,CAChC,CACD,CACC,CAAC,EACLJ,UAAU,CAACa,GAAG,CAAE,CAACK,QAAQ,EAAEC,KAAK,EAAEC,GAAG,KACpChC,KAAA,CAAAsB,aAAA;IACEK,GAAG,EAAEG,QAAS;IACdP,SAAS,EAAC;EAAgC,GAE1CvB,KAAA,CAAAsB,aAAA,CAAChB,QAAQ;IACPsB,KAAK,EAAEE,QAAS;IAChBD,OAAO,EAAEC,QAAQ,KAAKhB,gBAAiB;IACvCU,MAAM;EAAA,CACP,CAAC,EACDQ,GAAG,CAACP,GAAG,CAAEC,IAAI,IACZ1B,KAAA,CAAAsB,aAAA,CAACrB,QAAQ;IAAC0B,GAAG,EAAE,GAAGG,QAAQ,IAAIJ,IAAI;EAAG,GAClCI,QAAQ,KAAKJ,IAAI,GAChB1B,KAAA,CAAAsB,aAAA,CAACpB,QAAQ,QACPF,KAAA,CAAAsB,aAAA,CAACf,qBAAqB;IACpBuB,QAAQ,EAAEA,QAAS;IACnBJ,IAAI,EAAEA,IAAK;IACXO,UAAU,EAAE,GAAGH,QAAQ,GAAGtB,cAAc,CAACK,QAAQ,CAAC,GAAGa,IAAI,EAAG;IAC5DN,MAAM,EAAEA,MAAO;IACfL,mBAAmB,EAAEA,mBAAoB;IACzCE,eAAe,EAAEA,eAAgB;IACjCJ,QAAQ,EAAEA;EAAS,CACpB,CACO,CAAC,GAEXb,KAAA,CAAAsB,aAAA,CAAChB,QAAQ;IACP4B,cAAc;EAAA,CACf,CAEK,CACX,CACE,CACL,CACC,CAAC;AAEV,CAAC;AAED,SAASzB,IAAI","ignoreList":[]}
|
|
@@ -6,15 +6,13 @@ const Cell = _ref => {
|
|
|
6
6
|
children,
|
|
7
7
|
isError,
|
|
8
8
|
isLoading,
|
|
9
|
-
additionalBorderBottom,
|
|
10
9
|
hovered,
|
|
11
10
|
mouseEnterHandler,
|
|
12
11
|
mouseLeaveHandler
|
|
13
12
|
} = _ref;
|
|
14
13
|
return React.createElement("div", {
|
|
15
|
-
className: classnames('lw-flex lw-h-[
|
|
16
|
-
'lw-border-
|
|
17
|
-
'lw-font-semibold': hovered
|
|
14
|
+
className: classnames('lw-flex lw-h-11 lw-min-w-[70px] lw-flex-1 lw-items-center lw-justify-center lw-border-b lw-border-r lw-border-solid lw-border-border-primary last:lw-border-r-[0px]', {
|
|
15
|
+
'lw-bg-border-primary lw-font-semibold lw-shadow-innerBorderBgColor': hovered
|
|
18
16
|
}),
|
|
19
17
|
onMouseEnter: mouseEnterHandler,
|
|
20
18
|
onMouseLeave: mouseLeaveHandler
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Cell.js","names":["React","classnames","CELL_EMPTY_VALUE","CELL_LOADING_VALUE","Cell","_ref","children","isError","isLoading","
|
|
1
|
+
{"version":3,"file":"Cell.js","names":["React","classnames","CELL_EMPTY_VALUE","CELL_LOADING_VALUE","Cell","_ref","children","isError","isLoading","hovered","mouseEnterHandler","mouseLeaveHandler","createElement","className","onMouseEnter","onMouseLeave"],"sources":["../../../../src/CurrencyCrossTableWidget/components/Cell.tsx"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport { CellProps } from './types';\nimport { CELL_EMPTY_VALUE, CELL_LOADING_VALUE } from '../constant';\n\nconst Cell = ({\n children,\n isError,\n isLoading,\n hovered,\n mouseEnterHandler,\n mouseLeaveHandler,\n}: CellProps) => (\n <div\n className={classnames('lw-flex lw-h-11 lw-min-w-[70px] lw-flex-1 lw-items-center lw-justify-center lw-border-b lw-border-r lw-border-solid lw-border-border-primary last:lw-border-r-[0px]', {\n 'lw-bg-border-primary lw-font-semibold lw-shadow-innerBorderBgColor': hovered,\n })}\n onMouseEnter={mouseEnterHandler}\n onMouseLeave={mouseLeaveHandler}\n >\n {isLoading && <div className=\"lw-px-3 lw-py-3.5\">{CELL_LOADING_VALUE}</div>}\n {!isLoading && !isError && children}\n {!isLoading && isError && (\n <span>{CELL_EMPTY_VALUE}</span>\n )}\n </div>\n);\n\nexport { Cell };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AAEnC,SAASC,gBAAgB,EAAEC,kBAAkB,QAAQ,aAAa;AAElE,MAAMC,IAAI,GAAGC,IAAA;EAAA,IAAC;IACZC,QAAQ;IACRC,OAAO;IACPC,SAAS;IACTC,OAAO;IACPC,iBAAiB;IACjBC;EACS,CAAC,GAAAN,IAAA;EAAA,OACVL,KAAA,CAAAY,aAAA;IACEC,SAAS,EAAEZ,UAAU,CAAC,qKAAqK,EAAE;MAC3L,oEAAoE,EAAEQ;IACxE,CAAC,CAAE;IACHK,YAAY,EAAEJ,iBAAkB;IAChCK,YAAY,EAAEJ;EAAkB,GAE/BH,SAAS,IAAIR,KAAA,CAAAY,aAAA;IAAKC,SAAS,EAAC;EAAmB,GAAEV,kBAAwB,CAAC,EAC1E,CAACK,SAAS,IAAI,CAACD,OAAO,IAAID,QAAQ,EAClC,CAACE,SAAS,IAAID,OAAO,IACpBP,KAAA,CAAAY,aAAA,eAAOV,gBAAuB,CAE7B,CAAC;AAAA,CACP;AAED,SAASE,IAAI","ignoreList":[]}
|
|
@@ -9,7 +9,6 @@ const CellValidationWrapper = _ref => {
|
|
|
9
9
|
pair,
|
|
10
10
|
instrument,
|
|
11
11
|
target,
|
|
12
|
-
additionalBorderBottom,
|
|
13
12
|
setSelectedCurrency,
|
|
14
13
|
setSelectedPair,
|
|
15
14
|
division
|
|
@@ -34,7 +33,6 @@ const CellValidationWrapper = _ref => {
|
|
|
34
33
|
},
|
|
35
34
|
instrumentForCalculations: instrumentForCalculations,
|
|
36
35
|
target: target,
|
|
37
|
-
additionalBorderBottom: additionalBorderBottom,
|
|
38
36
|
setSelectedCurrency: setSelectedCurrency,
|
|
39
37
|
setSelectedPair: setSelectedPair,
|
|
40
38
|
division: division
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CellValidationWrapper.js","names":["React","useSuspenseQuery","validateInstruments","CellWithData","divisionMapper","CellValidationWrapper","_ref","currency","pair","instrument","target","
|
|
1
|
+
{"version":3,"file":"CellValidationWrapper.js","names":["React","useSuspenseQuery","validateInstruments","CellWithData","divisionMapper","CellValidationWrapper","_ref","currency","pair","instrument","target","setSelectedCurrency","setSelectedPair","division","error","variables","instruments","fetchPolicy","errorPolicy","instrumentForCalculations","createElement","record","displayName"],"sources":["../../../../src/CurrencyCrossTableWidget/components/CellValidationWrapper.tsx"],"sourcesContent":["import React from 'react';\nimport { useSuspenseQuery } from '@apollo/client';\nimport { CellValidationWrapperProps } from './types';\nimport { ValidateInstrumentsQuery, ValidateInstrumentsQueryVariables } from '../../gql/types/graphql';\nimport { validateInstruments } from '../../gql/validateInstruments';\nimport { CellWithData } from './CellWithData';\nimport { divisionMapper } from '../utils';\n\nconst CellValidationWrapper = ({\n currency,\n pair,\n instrument,\n target,\n setSelectedCurrency,\n setSelectedPair,\n division,\n}: CellValidationWrapperProps) => {\n const { error } = useSuspenseQuery<\n ValidateInstrumentsQuery,\n ValidateInstrumentsQueryVariables\n >(validateInstruments, {\n variables: {\n instruments: [instrument],\n division,\n },\n fetchPolicy: 'network-only',\n errorPolicy: 'all',\n });\n\n const instrumentForCalculations = error ? `${pair}${divisionMapper(division)}${currency}` : '';\n\n return (\n <CellWithData\n currency={currency}\n pair={pair}\n record={{\n instrument,\n displayName: `${currency}${divisionMapper(division)}${pair}`,\n }}\n instrumentForCalculations={instrumentForCalculations}\n target={target}\n setSelectedCurrency={setSelectedCurrency}\n setSelectedPair={setSelectedPair}\n division={division}\n />\n );\n};\n\nexport { CellValidationWrapper };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,gBAAgB,QAAQ,gBAAgB;AAGjD,SAASC,mBAAmB,QAAQ,+BAA+B;AACnE,SAASC,YAAY,QAAQ,gBAAgB;AAC7C,SAASC,cAAc,QAAQ,UAAU;AAEzC,MAAMC,qBAAqB,GAAGC,IAAA,IAQI;EAAA,IARH;IAC7BC,QAAQ;IACRC,IAAI;IACJC,UAAU;IACVC,MAAM;IACNC,mBAAmB;IACnBC,eAAe;IACfC;EAC0B,CAAC,GAAAP,IAAA;EAC3B,MAAM;IAAEQ;EAAM,CAAC,GAAGb,gBAAgB,CAGhCC,mBAAmB,EAAE;IACrBa,SAAS,EAAE;MACTC,WAAW,EAAE,CAACP,UAAU,CAAC;MACzBI;IACF,CAAC;IACDI,WAAW,EAAE,cAAc;IAC3BC,WAAW,EAAE;EACf,CAAC,CAAC;EAEF,MAAMC,yBAAyB,GAAGL,KAAK,GAAG,GAAGN,IAAI,GAAGJ,cAAc,CAACS,QAAQ,CAAC,GAAGN,QAAQ,EAAE,GAAG,EAAE;EAE9F,OACEP,KAAA,CAAAoB,aAAA,CAACjB,YAAY;IACXI,QAAQ,EAAEA,QAAS;IACnBC,IAAI,EAAEA,IAAK;IACXa,MAAM,EAAE;MACNZ,UAAU;MACVa,WAAW,EAAE,GAAGf,QAAQ,GAAGH,cAAc,CAACS,QAAQ,CAAC,GAAGL,IAAI;IAC5D,CAAE;IACFW,yBAAyB,EAAEA,yBAA0B;IACrDT,MAAM,EAAEA,MAAO;IACfC,mBAAmB,EAAEA,mBAAoB;IACzCC,eAAe,EAAEA,eAAgB;IACjCC,QAAQ,EAAEA;EAAS,CACpB,CAAC;AAEN,CAAC;AAED,SAASR,qBAAqB","ignoreList":[]}
|
|
@@ -9,7 +9,6 @@ const CellWithData = _ref => {
|
|
|
9
9
|
record,
|
|
10
10
|
instrumentForCalculations,
|
|
11
11
|
target,
|
|
12
|
-
additionalBorderBottom,
|
|
13
12
|
setSelectedCurrency,
|
|
14
13
|
setSelectedPair
|
|
15
14
|
} = _ref;
|
|
@@ -40,7 +39,6 @@ const CellWithData = _ref => {
|
|
|
40
39
|
return React.createElement(Cell, {
|
|
41
40
|
isLoading: checkLoading('buy'),
|
|
42
41
|
isError: !!liveRatesError,
|
|
43
|
-
additionalBorderBottom: additionalBorderBottom,
|
|
44
42
|
hovered: hovered,
|
|
45
43
|
mouseEnterHandler: handleMouseEnter,
|
|
46
44
|
mouseLeaveHandler: handleMouseLeave
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CellWithData.js","names":["React","useState","Price","useLiveRatesMessage","Cell","getBuyPrice","getPriceMovement","CellWithData","_ref","currency","pair","record","instrumentForCalculations","target","
|
|
1
|
+
{"version":3,"file":"CellWithData.js","names":["React","useState","Price","useLiveRatesMessage","Cell","getBuyPrice","getPriceMovement","CellWithData","_ref","currency","pair","record","instrumentForCalculations","target","setSelectedCurrency","setSelectedPair","hovered","setHovered","instrumentForUpdates","instrument","update","error","liveRatesError","updatedRecord","displayName","buy","ask","buyPriceMovement","askPriceMovement","displayPrecision","checkLoading","id","undefined","handleMouseEnter","handleMouseLeave","createElement","isLoading","isError","mouseEnterHandler","mouseLeaveHandler","priceMovement","movementIndicator","toFixed"],"sources":["../../../../src/CurrencyCrossTableWidget/components/CellWithData.tsx"],"sourcesContent":["import React, { useState } from 'react';\nimport { Price, useLiveRatesMessage } from '@oanda/labs-widget-common';\nimport { Cell } from './Cell';\nimport { CellWithDataProps } from './types';\nimport { getBuyPrice, getPriceMovement } from '../utils';\n\nconst CellWithData = ({\n currency,\n pair,\n record,\n instrumentForCalculations,\n target,\n setSelectedCurrency,\n setSelectedPair,\n}: CellWithDataProps) => {\n const [hovered, setHovered] = useState(false);\n\n const instrumentForUpdates = instrumentForCalculations || record.instrument;\n\n const { update, error: liveRatesError } = useLiveRatesMessage(\n instrumentForUpdates,\n target,\n );\n\n const updatedRecord: Record<string, any> = {\n displayName: record.displayName,\n instrument: record.instrument,\n buy: update?.ask,\n buyPriceMovement: update?.askPriceMovement,\n displayPrecision: update?.displayPrecision,\n };\n\n const checkLoading = (id: string) => (!liveRatesError && updatedRecord?.[id] === undefined);\n\n const handleMouseEnter = () => {\n setHovered(true);\n setSelectedCurrency(currency);\n setSelectedPair(pair);\n };\n\n const handleMouseLeave = () => {\n setHovered(false);\n setSelectedCurrency('');\n setSelectedPair('');\n };\n\n return (\n <Cell\n isLoading={checkLoading('buy')}\n isError={!!liveRatesError}\n hovered={hovered}\n mouseEnterHandler={handleMouseEnter}\n mouseLeaveHandler={handleMouseLeave}\n >\n <Price priceMovement={getPriceMovement(updatedRecord.buyPriceMovement, !!instrumentForCalculations)} movementIndicator=\"background\">\n <span>\n {getBuyPrice(\n updatedRecord.buy,\n !!instrumentForCalculations,\n ).toFixed(updatedRecord.displayPrecision)}\n </span>\n </Price>\n </Cell>\n );\n};\n\nexport { CellWithData };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,QAAQ,QAAQ,OAAO;AACvC,SAASC,KAAK,EAAEC,mBAAmB,QAAQ,2BAA2B;AACtE,SAASC,IAAI,QAAQ,QAAQ;AAE7B,SAASC,WAAW,EAAEC,gBAAgB,QAAQ,UAAU;AAExD,MAAMC,YAAY,GAAGC,IAAA,IAQI;EAAA,IARH;IACpBC,QAAQ;IACRC,IAAI;IACJC,MAAM;IACNC,yBAAyB;IACzBC,MAAM;IACNC,mBAAmB;IACnBC;EACiB,CAAC,GAAAP,IAAA;EAClB,MAAM,CAACQ,OAAO,EAAEC,UAAU,CAAC,GAAGhB,QAAQ,CAAC,KAAK,CAAC;EAE7C,MAAMiB,oBAAoB,GAAGN,yBAAyB,IAAID,MAAM,CAACQ,UAAU;EAE3E,MAAM;IAAEC,MAAM;IAAEC,KAAK,EAAEC;EAAe,CAAC,GAAGnB,mBAAmB,CAC3De,oBAAoB,EACpBL,MACF,CAAC;EAED,MAAMU,aAAkC,GAAG;IACzCC,WAAW,EAAEb,MAAM,CAACa,WAAW;IAC/BL,UAAU,EAAER,MAAM,CAACQ,UAAU;IAC7BM,GAAG,EAAEL,MAAM,EAAEM,GAAG;IAChBC,gBAAgB,EAAEP,MAAM,EAAEQ,gBAAgB;IAC1CC,gBAAgB,EAAET,MAAM,EAAES;EAC5B,CAAC;EAED,MAAMC,YAAY,GAAIC,EAAU,IAAM,CAACT,cAAc,IAAIC,aAAa,GAAGQ,EAAE,CAAC,KAAKC,SAAU;EAE3F,MAAMC,gBAAgB,GAAGA,CAAA,KAAM;IAC7BhB,UAAU,CAAC,IAAI,CAAC;IAChBH,mBAAmB,CAACL,QAAQ,CAAC;IAC7BM,eAAe,CAACL,IAAI,CAAC;EACvB,CAAC;EAED,MAAMwB,gBAAgB,GAAGA,CAAA,KAAM;IAC7BjB,UAAU,CAAC,KAAK,CAAC;IACjBH,mBAAmB,CAAC,EAAE,CAAC;IACvBC,eAAe,CAAC,EAAE,CAAC;EACrB,CAAC;EAED,OACEf,KAAA,CAAAmC,aAAA,CAAC/B,IAAI;IACHgC,SAAS,EAAEN,YAAY,CAAC,KAAK,CAAE;IAC/BO,OAAO,EAAE,CAAC,CAACf,cAAe;IAC1BN,OAAO,EAAEA,OAAQ;IACjBsB,iBAAiB,EAAEL,gBAAiB;IACpCM,iBAAiB,EAAEL;EAAiB,GAEpClC,KAAA,CAAAmC,aAAA,CAACjC,KAAK;IAACsC,aAAa,EAAElC,gBAAgB,CAACiB,aAAa,CAACI,gBAAgB,EAAE,CAAC,CAACf,yBAAyB,CAAE;IAAC6B,iBAAiB,EAAC;EAAY,GACjIzC,KAAA,CAAAmC,aAAA,eACG9B,WAAW,CACVkB,aAAa,CAACE,GAAG,EACjB,CAAC,CAACb,yBACJ,CAAC,CAAC8B,OAAO,CAACnB,aAAa,CAACM,gBAAgB,CACpC,CACD,CACH,CAAC;AAEX,CAAC;AAED,SAAStB,YAAY","ignoreList":[]}
|
|
@@ -4,14 +4,16 @@ const TextCell = _ref => {
|
|
|
4
4
|
let {
|
|
5
5
|
label,
|
|
6
6
|
emptyIndicator,
|
|
7
|
-
|
|
8
|
-
|
|
7
|
+
hovered,
|
|
8
|
+
sticky
|
|
9
9
|
} = _ref;
|
|
10
10
|
return React.createElement("span", {
|
|
11
|
-
className: classnames('lw-flex-1 lw-border-r lw-border-solid lw-border-border-primary lw-py-3.5 lw-text-center', {
|
|
12
|
-
'lw-border-b': additionalBorderBottom,
|
|
11
|
+
className: classnames('lw-h-11 lw-min-w-[70px] lw-flex-1 lw-border-b lw-border-r lw-border-solid lw-border-border-primary lw-py-3.5 lw-text-center last:lw-border-r-[0px]', {
|
|
13
12
|
'lw-bg-border-primary': emptyIndicator,
|
|
14
|
-
'lw-
|
|
13
|
+
'lw-shadow-innerBorderBgColor': emptyIndicator && hovered,
|
|
14
|
+
'lw-bg-border-primary lw-font-semibold': hovered,
|
|
15
|
+
'lw-sticky lw-left-0 lw-z-10': sticky,
|
|
16
|
+
'lw-bg-bg-primary': sticky && !hovered
|
|
15
17
|
})
|
|
16
18
|
}, label);
|
|
17
19
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TextCell.js","names":["React","classnames","TextCell","_ref","label","emptyIndicator","
|
|
1
|
+
{"version":3,"file":"TextCell.js","names":["React","classnames","TextCell","_ref","label","emptyIndicator","hovered","sticky","createElement","className"],"sources":["../../../../src/CurrencyCrossTableWidget/components/TextCell.tsx"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport { TextCellProps } from './types';\n\nconst TextCell = ({\n label,\n emptyIndicator,\n hovered,\n sticky,\n}: TextCellProps) => (\n <span className={classnames('lw-h-11 lw-min-w-[70px] lw-flex-1 lw-border-b lw-border-r lw-border-solid lw-border-border-primary lw-py-3.5 lw-text-center last:lw-border-r-[0px]', {\n 'lw-bg-border-primary': emptyIndicator,\n 'lw-shadow-innerBorderBgColor': emptyIndicator && hovered,\n 'lw-bg-border-primary lw-font-semibold': hovered,\n 'lw-sticky lw-left-0 lw-z-10': sticky,\n 'lw-bg-bg-primary': sticky && !hovered,\n })}\n >\n {label}\n </span>\n);\n\nexport { TextCell };\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,OAAOC,UAAU,MAAM,YAAY;AAGnC,MAAMC,QAAQ,GAAGC,IAAA;EAAA,IAAC;IAChBC,KAAK;IACLC,cAAc;IACdC,OAAO;IACPC;EACa,CAAC,GAAAJ,IAAA;EAAA,OACdH,KAAA,CAAAQ,aAAA;IAAMC,SAAS,EAAER,UAAU,CAAC,oJAAoJ,EAAE;MAChL,sBAAsB,EAAEI,cAAc;MACtC,8BAA8B,EAAEA,cAAc,IAAIC,OAAO;MACzD,uCAAuC,EAAEA,OAAO;MAChD,6BAA6B,EAAEC,MAAM;MACrC,kBAAkB,EAAEA,MAAM,IAAI,CAACD;IACjC,CAAC;EAAE,GAEAF,KACG,CAAC;AAAA,CACR;AAED,SAASF,QAAQ","ignoreList":[]}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.js","names":[],"sources":["../../../../src/CurrencyCrossTableWidget/components/types.ts"],"sourcesContent":["import { DataRecord, LoaderSize } from '@oanda/labs-widget-common';\nimport { Division } from '../../gql/types/graphql';\n\nexport interface CellValidationWrapperProps {\n currency: string;\n pair: string;\n instrument: string;\n target: EventTarget | null;\n
|
|
1
|
+
{"version":3,"file":"types.js","names":[],"sources":["../../../../src/CurrencyCrossTableWidget/components/types.ts"],"sourcesContent":["import { DataRecord, LoaderSize } from '@oanda/labs-widget-common';\nimport { Division } from '../../gql/types/graphql';\n\nexport interface CellValidationWrapperProps {\n currency: string;\n pair: string;\n instrument: string;\n target: EventTarget | null;\n division: Division;\n setSelectedCurrency: React.Dispatch<React.SetStateAction<string>>;\n setSelectedPair: React.Dispatch<React.SetStateAction<string>>;\n}\nexport interface CellWithDataProps {\n currency: string;\n pair: string;\n instrumentForCalculations: string;\n record: DataRecord;\n target: EventTarget | null;\n division: Division;\n setSelectedCurrency: React.Dispatch<React.SetStateAction<string>>;\n setSelectedPair: React.Dispatch<React.SetStateAction<string>>;\n}\n\nexport interface CellProps {\n children: React.ReactNode;\n isLoading?: boolean;\n isError?: boolean;\n loaderSize?: LoaderSize;\n hovered: boolean;\n mouseEnterHandler: () => void;\n mouseLeaveHandler: () => void;\n}\n\nexport interface TextCellProps {\n label?: string;\n emptyIndicator?: boolean;\n hovered?: boolean;\n sticky?: boolean;\n}\n"],"mappings":"","ignoreList":[]}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { CellProps } from './types';
|
|
3
|
-
declare const Cell: ({ children, isError, isLoading,
|
|
3
|
+
declare const Cell: ({ children, isError, isLoading, hovered, mouseEnterHandler, mouseLeaveHandler, }: CellProps) => React.JSX.Element;
|
|
4
4
|
export { Cell };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { CellValidationWrapperProps } from './types';
|
|
3
|
-
declare const CellValidationWrapper: ({ currency, pair, instrument, target,
|
|
3
|
+
declare const CellValidationWrapper: ({ currency, pair, instrument, target, setSelectedCurrency, setSelectedPair, division, }: CellValidationWrapperProps) => React.JSX.Element;
|
|
4
4
|
export { CellValidationWrapper };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { CellWithDataProps } from './types';
|
|
3
|
-
declare const CellWithData: ({ currency, pair, record, instrumentForCalculations, target,
|
|
3
|
+
declare const CellWithData: ({ currency, pair, record, instrumentForCalculations, target, setSelectedCurrency, setSelectedPair, }: CellWithDataProps) => React.JSX.Element;
|
|
4
4
|
export { CellWithData };
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import React from 'react';
|
|
2
2
|
import { TextCellProps } from './types';
|
|
3
|
-
declare const TextCell: ({ label, emptyIndicator,
|
|
3
|
+
declare const TextCell: ({ label, emptyIndicator, hovered, sticky, }: TextCellProps) => React.JSX.Element;
|
|
4
4
|
export { TextCell };
|
|
@@ -5,7 +5,6 @@ export interface CellValidationWrapperProps {
|
|
|
5
5
|
pair: string;
|
|
6
6
|
instrument: string;
|
|
7
7
|
target: EventTarget | null;
|
|
8
|
-
additionalBorderBottom?: boolean;
|
|
9
8
|
division: Division;
|
|
10
9
|
setSelectedCurrency: React.Dispatch<React.SetStateAction<string>>;
|
|
11
10
|
setSelectedPair: React.Dispatch<React.SetStateAction<string>>;
|
|
@@ -16,7 +15,6 @@ export interface CellWithDataProps {
|
|
|
16
15
|
instrumentForCalculations: string;
|
|
17
16
|
record: DataRecord;
|
|
18
17
|
target: EventTarget | null;
|
|
19
|
-
additionalBorderBottom?: boolean;
|
|
20
18
|
division: Division;
|
|
21
19
|
setSelectedCurrency: React.Dispatch<React.SetStateAction<string>>;
|
|
22
20
|
setSelectedPair: React.Dispatch<React.SetStateAction<string>>;
|
|
@@ -26,7 +24,6 @@ export interface CellProps {
|
|
|
26
24
|
isLoading?: boolean;
|
|
27
25
|
isError?: boolean;
|
|
28
26
|
loaderSize?: LoaderSize;
|
|
29
|
-
additionalBorderBottom?: boolean;
|
|
30
27
|
hovered: boolean;
|
|
31
28
|
mouseEnterHandler: () => void;
|
|
32
29
|
mouseLeaveHandler: () => void;
|
|
@@ -34,6 +31,6 @@ export interface CellProps {
|
|
|
34
31
|
export interface TextCellProps {
|
|
35
32
|
label?: string;
|
|
36
33
|
emptyIndicator?: boolean;
|
|
37
|
-
additionalBorderBottom?: boolean;
|
|
38
34
|
hovered?: boolean;
|
|
35
|
+
sticky?: boolean;
|
|
39
36
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@oanda/labs-currency-cross-table",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.8",
|
|
4
4
|
"description": "Labs Currency Cross Table",
|
|
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.
|
|
15
|
+
"@oanda/labs-widget-common": "^1.0.157",
|
|
16
16
|
"@oanda/mono-i18n": "10.0.1",
|
|
17
17
|
"graphql": "16.8.1"
|
|
18
18
|
},
|
|
@@ -20,5 +20,5 @@
|
|
|
20
20
|
"@graphql-codegen/cli": "5.0.0",
|
|
21
21
|
"@graphql-codegen/client-preset": "4.1.0"
|
|
22
22
|
},
|
|
23
|
-
"gitHead": "
|
|
23
|
+
"gitHead": "60a2bfe5c3adb01f35e853dd1596a444033f4847"
|
|
24
24
|
}
|
|
@@ -27,9 +27,9 @@ const Main = ({
|
|
|
27
27
|
}, instruments);
|
|
28
28
|
|
|
29
29
|
return (
|
|
30
|
-
<div data-testid="currency-cross-table-wrapper" className="lw-w-full">
|
|
31
|
-
<div className="lw-flex lw-
|
|
32
|
-
<TextCell />
|
|
30
|
+
<div data-testid="currency-cross-table-wrapper" className="lw-w-full lw-overflow-x-auto lw-overflow-y-hidden lw-border lw-border-b-0 lw-border-solid lw-border-border-primary">
|
|
31
|
+
<div className="lw-flex lw-w-max lw-min-w-full">
|
|
32
|
+
<TextCell sticky />
|
|
33
33
|
{currencies.map(((pair) => (
|
|
34
34
|
<TextCell
|
|
35
35
|
key={pair}
|
|
@@ -41,12 +41,12 @@ const Main = ({
|
|
|
41
41
|
{currencies.map(((currency, index, arr) => (
|
|
42
42
|
<div
|
|
43
43
|
key={currency}
|
|
44
|
-
className="lw-flex lw-
|
|
44
|
+
className="lw-flex lw-w-max lw-min-w-full"
|
|
45
45
|
>
|
|
46
46
|
<TextCell
|
|
47
47
|
label={currency}
|
|
48
|
-
additionalBorderBottom={index === arr.length - 1}
|
|
49
48
|
hovered={currency === selectedCurrency}
|
|
49
|
+
sticky
|
|
50
50
|
/>
|
|
51
51
|
{arr.map((pair) => (
|
|
52
52
|
<Fragment key={`${currency}_${pair}`}>
|
|
@@ -57,7 +57,6 @@ const Main = ({
|
|
|
57
57
|
pair={pair}
|
|
58
58
|
instrument={`${currency}${divisionMapper(division)}${pair}`}
|
|
59
59
|
target={target}
|
|
60
|
-
additionalBorderBottom={index === arr.length - 1}
|
|
61
60
|
setSelectedCurrency={setSelectedCurrency}
|
|
62
61
|
setSelectedPair={setSelectedPair}
|
|
63
62
|
division={division}
|
|
@@ -65,7 +64,6 @@ const Main = ({
|
|
|
65
64
|
</Suspense>
|
|
66
65
|
) : (
|
|
67
66
|
<TextCell
|
|
68
|
-
additionalBorderBottom={index === arr.length - 1}
|
|
69
67
|
emptyIndicator
|
|
70
68
|
/>
|
|
71
69
|
)}
|
|
@@ -7,15 +7,13 @@ const Cell = ({
|
|
|
7
7
|
children,
|
|
8
8
|
isError,
|
|
9
9
|
isLoading,
|
|
10
|
-
additionalBorderBottom,
|
|
11
10
|
hovered,
|
|
12
11
|
mouseEnterHandler,
|
|
13
12
|
mouseLeaveHandler,
|
|
14
13
|
}: CellProps) => (
|
|
15
14
|
<div
|
|
16
|
-
className={classnames('lw-flex lw-h-[
|
|
17
|
-
'lw-border-
|
|
18
|
-
'lw-font-semibold': hovered,
|
|
15
|
+
className={classnames('lw-flex lw-h-11 lw-min-w-[70px] lw-flex-1 lw-items-center lw-justify-center lw-border-b lw-border-r lw-border-solid lw-border-border-primary last:lw-border-r-[0px]', {
|
|
16
|
+
'lw-bg-border-primary lw-font-semibold lw-shadow-innerBorderBgColor': hovered,
|
|
19
17
|
})}
|
|
20
18
|
onMouseEnter={mouseEnterHandler}
|
|
21
19
|
onMouseLeave={mouseLeaveHandler}
|
|
@@ -11,7 +11,6 @@ const CellValidationWrapper = ({
|
|
|
11
11
|
pair,
|
|
12
12
|
instrument,
|
|
13
13
|
target,
|
|
14
|
-
additionalBorderBottom,
|
|
15
14
|
setSelectedCurrency,
|
|
16
15
|
setSelectedPair,
|
|
17
16
|
division,
|
|
@@ -40,7 +39,6 @@ const CellValidationWrapper = ({
|
|
|
40
39
|
}}
|
|
41
40
|
instrumentForCalculations={instrumentForCalculations}
|
|
42
41
|
target={target}
|
|
43
|
-
additionalBorderBottom={additionalBorderBottom}
|
|
44
42
|
setSelectedCurrency={setSelectedCurrency}
|
|
45
43
|
setSelectedPair={setSelectedPair}
|
|
46
44
|
division={division}
|
|
@@ -10,7 +10,6 @@ const CellWithData = ({
|
|
|
10
10
|
record,
|
|
11
11
|
instrumentForCalculations,
|
|
12
12
|
target,
|
|
13
|
-
additionalBorderBottom,
|
|
14
13
|
setSelectedCurrency,
|
|
15
14
|
setSelectedPair,
|
|
16
15
|
}: CellWithDataProps) => {
|
|
@@ -49,7 +48,6 @@ const CellWithData = ({
|
|
|
49
48
|
<Cell
|
|
50
49
|
isLoading={checkLoading('buy')}
|
|
51
50
|
isError={!!liveRatesError}
|
|
52
|
-
additionalBorderBottom={additionalBorderBottom}
|
|
53
51
|
hovered={hovered}
|
|
54
52
|
mouseEnterHandler={handleMouseEnter}
|
|
55
53
|
mouseLeaveHandler={handleMouseLeave}
|
|
@@ -5,13 +5,15 @@ import { TextCellProps } from './types';
|
|
|
5
5
|
const TextCell = ({
|
|
6
6
|
label,
|
|
7
7
|
emptyIndicator,
|
|
8
|
-
additionalBorderBottom,
|
|
9
8
|
hovered,
|
|
9
|
+
sticky,
|
|
10
10
|
}: TextCellProps) => (
|
|
11
|
-
<span className={classnames('lw-flex-1 lw-border-r lw-border-solid lw-border-border-primary lw-py-3.5 lw-text-center', {
|
|
12
|
-
'lw-border-b': additionalBorderBottom,
|
|
11
|
+
<span className={classnames('lw-h-11 lw-min-w-[70px] lw-flex-1 lw-border-b lw-border-r lw-border-solid lw-border-border-primary lw-py-3.5 lw-text-center last:lw-border-r-[0px]', {
|
|
13
12
|
'lw-bg-border-primary': emptyIndicator,
|
|
14
|
-
'lw-
|
|
13
|
+
'lw-shadow-innerBorderBgColor': emptyIndicator && hovered,
|
|
14
|
+
'lw-bg-border-primary lw-font-semibold': hovered,
|
|
15
|
+
'lw-sticky lw-left-0 lw-z-10': sticky,
|
|
16
|
+
'lw-bg-bg-primary': sticky && !hovered,
|
|
15
17
|
})}
|
|
16
18
|
>
|
|
17
19
|
{label}
|
|
@@ -6,7 +6,6 @@ export interface CellValidationWrapperProps {
|
|
|
6
6
|
pair: string;
|
|
7
7
|
instrument: string;
|
|
8
8
|
target: EventTarget | null;
|
|
9
|
-
additionalBorderBottom? : boolean;
|
|
10
9
|
division: Division;
|
|
11
10
|
setSelectedCurrency: React.Dispatch<React.SetStateAction<string>>;
|
|
12
11
|
setSelectedPair: React.Dispatch<React.SetStateAction<string>>;
|
|
@@ -17,7 +16,6 @@ export interface CellWithDataProps {
|
|
|
17
16
|
instrumentForCalculations: string;
|
|
18
17
|
record: DataRecord;
|
|
19
18
|
target: EventTarget | null;
|
|
20
|
-
additionalBorderBottom? : boolean;
|
|
21
19
|
division: Division;
|
|
22
20
|
setSelectedCurrency: React.Dispatch<React.SetStateAction<string>>;
|
|
23
21
|
setSelectedPair: React.Dispatch<React.SetStateAction<string>>;
|
|
@@ -28,7 +26,6 @@ export interface CellProps {
|
|
|
28
26
|
isLoading?: boolean;
|
|
29
27
|
isError?: boolean;
|
|
30
28
|
loaderSize?: LoaderSize;
|
|
31
|
-
additionalBorderBottom? : boolean;
|
|
32
29
|
hovered: boolean;
|
|
33
30
|
mouseEnterHandler: () => void;
|
|
34
31
|
mouseLeaveHandler: () => void;
|
|
@@ -37,6 +34,6 @@ export interface CellProps {
|
|
|
37
34
|
export interface TextCellProps {
|
|
38
35
|
label?: string;
|
|
39
36
|
emptyIndicator?: boolean;
|
|
40
|
-
additionalBorderBottom? : boolean;
|
|
41
37
|
hovered?: boolean;
|
|
38
|
+
sticky?: boolean;
|
|
42
39
|
}
|