@oanda/labs-widget-common 1.0.213 → 1.0.215
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 +1692 -0
- package/dist/main/components/InstrumentRate/InstrumentRate.js +4 -5
- package/dist/main/components/InstrumentRate/InstrumentRate.js.map +1 -1
- package/dist/main/components/LabelWrapper/LabelWrapper.js +1 -1
- package/dist/main/components/LabelWrapper/LabelWrapper.js.map +1 -1
- package/dist/main/components/Truncate/Truncate.js +10 -11
- package/dist/main/components/Truncate/Truncate.js.map +1 -1
- package/dist/module/components/InstrumentRate/InstrumentRate.js +4 -5
- package/dist/module/components/InstrumentRate/InstrumentRate.js.map +1 -1
- package/dist/module/components/LabelWrapper/LabelWrapper.js +1 -1
- package/dist/module/components/LabelWrapper/LabelWrapper.js.map +1 -1
- package/dist/module/components/Truncate/Truncate.js +10 -11
- package/dist/module/components/Truncate/Truncate.js.map +1 -1
- package/package.json +2 -2
- package/src/components/InstrumentRate/InstrumentRate.tsx +8 -8
- package/src/components/LabelWrapper/LabelWrapper.tsx +8 -5
- package/src/components/Truncate/Truncate.tsx +2 -3
- package/test/components/InstrumentRate/InstrumentRate.test.tsx +3 -3
|
@@ -25,19 +25,18 @@ const InstrumentRate = _ref => {
|
|
|
25
25
|
} = (0, _providers.useLayoutProvider)();
|
|
26
26
|
const checkLoading = id => !isError && record?.[id] === undefined;
|
|
27
27
|
const isExpanded = size === 'full' || size === 'fullWithChart';
|
|
28
|
-
const isCompact = size === 'compact';
|
|
29
28
|
return _react.default.createElement("div", {
|
|
30
29
|
className: (0, _tailwind.cn)('lw-flex lw-flex-col', isExpanded && 'lw-h-full'),
|
|
31
30
|
"data-testid": "instrument-rate-wrapper"
|
|
32
31
|
}, _react.default.createElement("div", {
|
|
33
|
-
className: (0, _tailwind.cn)('lw-flex lw-gap-x-2', isExpanded && 'lw-h-1/2
|
|
32
|
+
className: (0, _tailwind.cn)('lw-flex lw-gap-x-2 lw-text-xl', isExpanded && 'lw-h-1/2', !slim && 'lw-py-2', slim && 'lw-py-1'),
|
|
34
33
|
"data-testid": "instrument-rate-wrapper-label"
|
|
35
34
|
}, _react.default.createElement(_LabelWrapper.LabelWrapper, {
|
|
36
35
|
isError: !!isError,
|
|
37
36
|
isLoading: checkLoading('instrument'),
|
|
38
37
|
size: _LabelWrapper.LabelSize.lg
|
|
39
38
|
}, _react.default.createElement("span", {
|
|
40
|
-
className: "lw-
|
|
39
|
+
className: "lw-font-bold"
|
|
41
40
|
}, _react.default.createElement(_Truncate.Truncate, {
|
|
42
41
|
maxWidth: 100,
|
|
43
42
|
text: record.displayName,
|
|
@@ -47,12 +46,12 @@ const InstrumentRate = _ref => {
|
|
|
47
46
|
isLoading: checkLoading('buy'),
|
|
48
47
|
size: _LabelWrapper.LabelSize.lg
|
|
49
48
|
}, _react.default.createElement("div", {
|
|
50
|
-
className: "lw-
|
|
49
|
+
className: "lw-font-bold"
|
|
51
50
|
}, _react.default.createElement(_Price.Price, {
|
|
52
51
|
movementIndicator: "text",
|
|
53
52
|
priceMovement: record.buyPriceMovement
|
|
54
53
|
}, _react.default.createElement("span", null, record.buy?.toFixed(record.displayPrecision)))))), isExpanded && _react.default.createElement("div", {
|
|
55
|
-
className: (0, _tailwind.cn)('lw-flex lw-h-1/2 lw-w-fit lw-items-center lw-gap-x-2 lw-
|
|
54
|
+
className: (0, _tailwind.cn)('lw-flex lw-h-1/2 lw-w-fit lw-items-center lw-gap-x-2 lw-pr-2.5', !isDark && 'lw-bg-whiteOpacity', isDark && 'lw-bg-blackOpacity', !slim && 'lw-py-1', slim && 'lw-pb-1'),
|
|
56
55
|
"data-testid": "instrument-rate-wrapper-expanded"
|
|
57
56
|
}, _react.default.createElement(_LabelWrapper.LabelWrapper, {
|
|
58
57
|
isError: !!isError,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InstrumentRate.js","names":["_react","_interopRequireDefault","require","_providers","_tailwind","_LabelWrapper","_Price","_Truncate","e","__esModule","default","InstrumentRate","_ref","isError","record","tooltipId","size","slim","colorIndicator","indicator","isDark","useLayoutProvider","checkLoading","id","undefined","isExpanded","
|
|
1
|
+
{"version":3,"file":"InstrumentRate.js","names":["_react","_interopRequireDefault","require","_providers","_tailwind","_LabelWrapper","_Price","_Truncate","e","__esModule","default","InstrumentRate","_ref","isError","record","tooltipId","size","slim","colorIndicator","indicator","isDark","useLayoutProvider","checkLoading","id","undefined","isExpanded","createElement","className","cn","LabelWrapper","isLoading","LabelSize","lg","Truncate","maxWidth","text","displayName","Price","movementIndicator","priceMovement","buyPriceMovement","buy","toFixed","displayPrecision","sm","dailyPercentChange","withoutLoader","dailyPipsChange","exports"],"sources":["../../../../src/components/InstrumentRate/InstrumentRate.tsx"],"sourcesContent":["import React from 'react';\n\nimport { useLayoutProvider } from '../../providers';\nimport { cn } from '../../tailwind';\nimport { LabelSize, LabelWrapper } from '../LabelWrapper';\nimport { Price } from '../Price';\nimport { Truncate } from '../Truncate';\nimport type { InstrumentRateProps } from './types';\n\nconst InstrumentRate = ({\n isError,\n record,\n tooltipId,\n size,\n slim,\n colorIndicator: indicator,\n}: InstrumentRateProps) => {\n const { isDark } = useLayoutProvider();\n const checkLoading = (id: string) => !isError && record?.[id] === undefined;\n const isExpanded = size === 'full' || size === 'fullWithChart';\n\n return (\n <div\n className={cn('lw-flex lw-flex-col', isExpanded && 'lw-h-full')}\n data-testid=\"instrument-rate-wrapper\"\n >\n <div\n className={cn(\n 'lw-flex lw-gap-x-2 lw-text-xl',\n isExpanded && 'lw-h-1/2',\n !slim && 'lw-py-2',\n slim && 'lw-py-1'\n )}\n data-testid=\"instrument-rate-wrapper-label\"\n >\n <LabelWrapper\n isError={!!isError}\n isLoading={checkLoading('instrument')}\n size={LabelSize.lg}\n >\n <span className=\"lw-font-bold\">\n <Truncate\n maxWidth={100}\n text={record.displayName}\n tooltipId={tooltipId}\n />\n </span>\n </LabelWrapper>\n <LabelWrapper\n isError={!!isError}\n isLoading={checkLoading('buy')}\n size={LabelSize.lg}\n >\n <div className=\"lw-font-bold\">\n <Price\n movementIndicator=\"text\"\n priceMovement={record.buyPriceMovement}\n >\n <span>{record.buy?.toFixed(record.displayPrecision)}</span>\n </Price>\n </div>\n </LabelWrapper>\n </div>\n {isExpanded && (\n <div\n className={cn(\n 'lw-flex lw-h-1/2 lw-w-fit lw-items-center lw-gap-x-2 lw-pr-2.5',\n !isDark && 'lw-bg-whiteOpacity',\n isDark && 'lw-bg-blackOpacity',\n !slim && 'lw-py-1',\n slim && 'lw-pb-1'\n )}\n data-testid=\"instrument-rate-wrapper-expanded\"\n >\n <LabelWrapper\n isError={!!isError}\n isLoading={checkLoading('dailyPercentChange')}\n size={LabelSize.sm}\n >\n <span\n className={cn(\n 'lw-font-bold',\n indicator > 0 && 'lw-text-text-ok',\n indicator < 0 && 'lw-text-text-danger',\n indicator === 0 && 'lw-text-text-disabled'\n )}\n >\n {record.dailyPercentChange}\n </span>\n </LabelWrapper>\n <LabelWrapper\n withoutLoader\n isError={!!isError}\n isLoading={checkLoading('dailyPipsChange')}\n size={LabelSize.sm}\n >\n <span\n className={cn(\n 'lw-font-bold',\n indicator > 0 && 'lw-text-text-ok',\n indicator < 0 && 'lw-text-text-danger',\n indicator === 0 && 'lw-text-text-disabled'\n )}\n >\n {`(${record.dailyPipsChange})`}\n </span>\n </LabelWrapper>\n </div>\n )}\n </div>\n );\n};\n\nexport { InstrumentRate };\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -20,7 +20,7 @@ const LabelWrapper = _ref => {
|
|
|
20
20
|
withoutLoader = false
|
|
21
21
|
} = _ref;
|
|
22
22
|
return _react.default.createElement("div", {
|
|
23
|
-
className: (0, _classnames.default)('lw-h-[inherit] lw-py-0 lw-font-sans', {
|
|
23
|
+
className: (0, _classnames.default)('lw-flex lw-h-[inherit] lw-min-h-[28px] lw-items-center lw-py-0 lw-font-sans', {
|
|
24
24
|
'lw-min-w-[100px]': size === _types.LabelSize.lg,
|
|
25
25
|
'lw-min-w-[70px]': size === _types.LabelSize.md,
|
|
26
26
|
'lw-min-w-[50px]': size === _types.LabelSize.sm
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LabelWrapper.js","names":["_classnames","_interopRequireDefault","require","_react","_constant","_Loader","_types","e","__esModule","default","LabelWrapper","_ref","loaderSize","LoaderSize","md","size","LabelSize","children","isError","isLoading","withoutLoader","createElement","className","classnames","lg","sm","Loader","CELL_EMPTY_VALUE","exports"],"sources":["../../../../src/components/LabelWrapper/LabelWrapper.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport React from 'react';\n\nimport { CELL_EMPTY_VALUE } from '../constant';\nimport { Loader, LoaderSize } from '../Loader';\nimport type { LabelWrapperProps } from './types';\nimport { LabelSize } from './types';\n\nconst LabelWrapper = ({\n loaderSize = LoaderSize.md,\n size = LabelSize.md,\n children,\n isError,\n isLoading,\n withoutLoader = false,\n}: LabelWrapperProps) => (\n <div\n className={classnames('lw-h-[inherit] lw-py-0 lw-font-sans'
|
|
1
|
+
{"version":3,"file":"LabelWrapper.js","names":["_classnames","_interopRequireDefault","require","_react","_constant","_Loader","_types","e","__esModule","default","LabelWrapper","_ref","loaderSize","LoaderSize","md","size","LabelSize","children","isError","isLoading","withoutLoader","createElement","className","classnames","lg","sm","Loader","CELL_EMPTY_VALUE","exports"],"sources":["../../../../src/components/LabelWrapper/LabelWrapper.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport React from 'react';\n\nimport { CELL_EMPTY_VALUE } from '../constant';\nimport { Loader, LoaderSize } from '../Loader';\nimport type { LabelWrapperProps } from './types';\nimport { LabelSize } from './types';\n\nconst LabelWrapper = ({\n loaderSize = LoaderSize.md,\n size = LabelSize.md,\n children,\n isError,\n isLoading,\n withoutLoader = false,\n}: LabelWrapperProps) => (\n <div\n className={classnames(\n 'lw-flex lw-h-[inherit] lw-min-h-[28px] lw-items-center lw-py-0 lw-font-sans',\n {\n 'lw-min-w-[100px]': size === LabelSize.lg,\n 'lw-min-w-[70px]': size === LabelSize.md,\n 'lw-min-w-[50px]': size === LabelSize.sm,\n }\n )}\n data-testid=\"label-wrapper\"\n >\n <div className={classnames('lw-flex lw-h-[inherit] lw-items-center')}>\n {isLoading && !withoutLoader && <Loader size={loaderSize} />}\n {!isLoading && !isError && children}\n {!isLoading && isError && <span>{CELL_EMPTY_VALUE}</span>}\n </div>\n </div>\n);\n\nexport { LabelWrapper };\n"],"mappings":";;;;;;AAAA,IAAAA,WAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAF,sBAAA,CAAAC,OAAA;AAEA,IAAAE,SAAA,GAAAF,OAAA;AACA,IAAAG,OAAA,GAAAH,OAAA;AAEA,IAAAI,MAAA,GAAAJ,OAAA;AAAoC,SAAAD,uBAAAM,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEpC,MAAMG,YAAY,GAAGC,IAAA;EAAA,IAAC;IACpBC,UAAU,GAAGC,kBAAU,CAACC,EAAE;IAC1BC,IAAI,GAAGC,gBAAS,CAACF,EAAE;IACnBG,QAAQ;IACRC,OAAO;IACPC,SAAS;IACTC,aAAa,GAAG;EACC,CAAC,GAAAT,IAAA;EAAA,OAClBR,MAAA,CAAAM,OAAA,CAAAY,aAAA;IACEC,SAAS,EAAE,IAAAC,mBAAU,EACnB,6EAA6E,EAC7E;MACE,kBAAkB,EAAER,IAAI,KAAKC,gBAAS,CAACQ,EAAE;MACzC,iBAAiB,EAAET,IAAI,KAAKC,gBAAS,CAACF,EAAE;MACxC,iBAAiB,EAAEC,IAAI,KAAKC,gBAAS,CAACS;IACxC,CACF,CAAE;IACF,eAAY;EAAe,GAE3BtB,MAAA,CAAAM,OAAA,CAAAY,aAAA;IAAKC,SAAS,EAAE,IAAAC,mBAAU,EAAC,wCAAwC;EAAE,GAClEJ,SAAS,IAAI,CAACC,aAAa,IAAIjB,MAAA,CAAAM,OAAA,CAAAY,aAAA,CAAChB,OAAA,CAAAqB,MAAM;IAACX,IAAI,EAAEH;EAAW,CAAE,CAAC,EAC3D,CAACO,SAAS,IAAI,CAACD,OAAO,IAAID,QAAQ,EAClC,CAACE,SAAS,IAAID,OAAO,IAAIf,MAAA,CAAAM,OAAA,CAAAY,aAAA,eAAOM,0BAAuB,CACrD,CACF,CAAC;AAAA,CACP;AAACC,OAAA,CAAAlB,YAAA,GAAAA,YAAA","ignoreList":[]}
|
|
@@ -29,17 +29,16 @@ const Truncate = exports.Truncate = (0, _react.memo)(_ref => {
|
|
|
29
29
|
ref,
|
|
30
30
|
onResize
|
|
31
31
|
});
|
|
32
|
-
return
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
);
|
|
32
|
+
return _react.default.createElement("span", {
|
|
33
|
+
ref: ref,
|
|
34
|
+
className: (0, _classnames.default)('lw-block lw-w-max lw-truncate', className),
|
|
35
|
+
"data-testid": "truncate",
|
|
36
|
+
"data-tooltip-content": text,
|
|
37
|
+
"data-tooltip-id": isTruncated ? tooltipId : undefined,
|
|
38
|
+
style: {
|
|
39
|
+
maxWidth: `${maxWidth}px`
|
|
40
|
+
}
|
|
41
|
+
}, text);
|
|
43
42
|
});
|
|
44
43
|
Truncate.displayName = 'Truncate';
|
|
45
44
|
//# sourceMappingURL=Truncate.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Truncate.js","names":["_classnames","_interopRequireDefault","require","_react","_interopRequireWildcard","_usehooksTs","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Truncate","exports","memo","_ref","maxWidth","text","tooltipId","className","isTruncated","setIsTruncated","useState","ref","useRef","onResize","useDebounceCallback","_ref2","width","useResizeObserver","createElement","classnames","undefined","style","displayName"],"sources":["../../../../src/components/Truncate/Truncate.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport React, { memo, useRef, useState } from 'react';\nimport { useDebounceCallback, useResizeObserver } from 'usehooks-ts';\n\nimport type { TruncateProps } from './types';\n\nconst Truncate = memo(\n ({ maxWidth = 150, text, tooltipId, className }: TruncateProps) => {\n const [isTruncated, setIsTruncated] = useState(false);\n const ref = useRef<HTMLAnchorElement>(null);\n\n const onResize = useDebounceCallback(({ width }) => {\n setIsTruncated(width >= maxWidth);\n }, 50);\n\n useResizeObserver({\n ref,\n onResize,\n });\n\n return (\n
|
|
1
|
+
{"version":3,"file":"Truncate.js","names":["_classnames","_interopRequireDefault","require","_react","_interopRequireWildcard","_usehooksTs","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Truncate","exports","memo","_ref","maxWidth","text","tooltipId","className","isTruncated","setIsTruncated","useState","ref","useRef","onResize","useDebounceCallback","_ref2","width","useResizeObserver","createElement","classnames","undefined","style","displayName"],"sources":["../../../../src/components/Truncate/Truncate.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport React, { memo, useRef, useState } from 'react';\nimport { useDebounceCallback, useResizeObserver } from 'usehooks-ts';\n\nimport type { TruncateProps } from './types';\n\nconst Truncate = memo(\n ({ maxWidth = 150, text, tooltipId, className }: TruncateProps) => {\n const [isTruncated, setIsTruncated] = useState(false);\n const ref = useRef<HTMLAnchorElement>(null);\n\n const onResize = useDebounceCallback(({ width }) => {\n setIsTruncated(width >= maxWidth);\n }, 50);\n\n useResizeObserver({\n ref,\n onResize,\n });\n\n return (\n <span\n ref={ref}\n className={classnames('lw-block lw-w-max lw-truncate', className)}\n data-testid=\"truncate\"\n data-tooltip-content={text}\n data-tooltip-id={isTruncated ? tooltipId : undefined}\n style={{ maxWidth: `${maxWidth}px` }}\n >\n {text}\n </span>\n );\n }\n);\n\nTruncate.displayName = 'Truncate';\n\nexport { Truncate };\n"],"mappings":";;;;;;AAAA,IAAAA,WAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,MAAA,GAAAC,uBAAA,CAAAF,OAAA;AACA,IAAAG,WAAA,GAAAH,OAAA;AAAqE,SAAAI,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAH,wBAAAG,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAAA,SAAAd,uBAAAM,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAI,UAAA,GAAAJ,CAAA,KAAAK,OAAA,EAAAL,CAAA;AAIrE,MAAMmB,QAAQ,GAAAC,OAAA,CAAAD,QAAA,GAAG,IAAAE,WAAI,EACnBC,IAAA,IAAmE;EAAA,IAAlE;IAAEC,QAAQ,GAAG,GAAG;IAAEC,IAAI;IAAEC,SAAS;IAAEC;EAAyB,CAAC,GAAAJ,IAAA;EAC5D,MAAM,CAACK,WAAW,EAAEC,cAAc,CAAC,GAAG,IAAAC,eAAQ,EAAC,KAAK,CAAC;EACrD,MAAMC,GAAG,GAAG,IAAAC,aAAM,EAAoB,IAAI,CAAC;EAE3C,MAAMC,QAAQ,GAAG,IAAAC,+BAAmB,EAACC,KAAA,IAAe;IAAA,IAAd;MAAEC;IAAM,CAAC,GAAAD,KAAA;IAC7CN,cAAc,CAACO,KAAK,IAAIZ,QAAQ,CAAC;EACnC,CAAC,EAAE,EAAE,CAAC;EAEN,IAAAa,6BAAiB,EAAC;IAChBN,GAAG;IACHE;EACF,CAAC,CAAC;EAEF,OACEpC,MAAA,CAAAS,OAAA,CAAAgC,aAAA;IACEP,GAAG,EAAEA,GAAI;IACTJ,SAAS,EAAE,IAAAY,mBAAU,EAAC,+BAA+B,EAAEZ,SAAS,CAAE;IAClE,eAAY,UAAU;IACtB,wBAAsBF,IAAK;IAC3B,mBAAiBG,WAAW,GAAGF,SAAS,GAAGc,SAAU;IACrDC,KAAK,EAAE;MAAEjB,QAAQ,EAAE,GAAGA,QAAQ;IAAK;EAAE,GAEpCC,IACG,CAAC;AAEX,CACF,CAAC;AAEDL,QAAQ,CAACsB,WAAW,GAAG,UAAU","ignoreList":[]}
|
|
@@ -18,19 +18,18 @@ const InstrumentRate = _ref => {
|
|
|
18
18
|
} = useLayoutProvider();
|
|
19
19
|
const checkLoading = id => !isError && record?.[id] === undefined;
|
|
20
20
|
const isExpanded = size === 'full' || size === 'fullWithChart';
|
|
21
|
-
const isCompact = size === 'compact';
|
|
22
21
|
return React.createElement("div", {
|
|
23
22
|
className: cn('lw-flex lw-flex-col', isExpanded && 'lw-h-full'),
|
|
24
23
|
"data-testid": "instrument-rate-wrapper"
|
|
25
24
|
}, React.createElement("div", {
|
|
26
|
-
className: cn('lw-flex lw-gap-x-2', isExpanded && 'lw-h-1/2
|
|
25
|
+
className: cn('lw-flex lw-gap-x-2 lw-text-xl', isExpanded && 'lw-h-1/2', !slim && 'lw-py-2', slim && 'lw-py-1'),
|
|
27
26
|
"data-testid": "instrument-rate-wrapper-label"
|
|
28
27
|
}, React.createElement(LabelWrapper, {
|
|
29
28
|
isError: !!isError,
|
|
30
29
|
isLoading: checkLoading('instrument'),
|
|
31
30
|
size: LabelSize.lg
|
|
32
31
|
}, React.createElement("span", {
|
|
33
|
-
className: "lw-
|
|
32
|
+
className: "lw-font-bold"
|
|
34
33
|
}, React.createElement(Truncate, {
|
|
35
34
|
maxWidth: 100,
|
|
36
35
|
text: record.displayName,
|
|
@@ -40,12 +39,12 @@ const InstrumentRate = _ref => {
|
|
|
40
39
|
isLoading: checkLoading('buy'),
|
|
41
40
|
size: LabelSize.lg
|
|
42
41
|
}, React.createElement("div", {
|
|
43
|
-
className: "lw-
|
|
42
|
+
className: "lw-font-bold"
|
|
44
43
|
}, React.createElement(Price, {
|
|
45
44
|
movementIndicator: "text",
|
|
46
45
|
priceMovement: record.buyPriceMovement
|
|
47
46
|
}, React.createElement("span", null, record.buy?.toFixed(record.displayPrecision)))))), isExpanded && React.createElement("div", {
|
|
48
|
-
className: cn('lw-flex lw-h-1/2 lw-w-fit lw-items-center lw-gap-x-2 lw-
|
|
47
|
+
className: cn('lw-flex lw-h-1/2 lw-w-fit lw-items-center lw-gap-x-2 lw-pr-2.5', !isDark && 'lw-bg-whiteOpacity', isDark && 'lw-bg-blackOpacity', !slim && 'lw-py-1', slim && 'lw-pb-1'),
|
|
49
48
|
"data-testid": "instrument-rate-wrapper-expanded"
|
|
50
49
|
}, React.createElement(LabelWrapper, {
|
|
51
50
|
isError: !!isError,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"InstrumentRate.js","names":["React","useLayoutProvider","cn","LabelSize","LabelWrapper","Price","Truncate","InstrumentRate","_ref","isError","record","tooltipId","size","slim","colorIndicator","indicator","isDark","checkLoading","id","undefined","isExpanded","
|
|
1
|
+
{"version":3,"file":"InstrumentRate.js","names":["React","useLayoutProvider","cn","LabelSize","LabelWrapper","Price","Truncate","InstrumentRate","_ref","isError","record","tooltipId","size","slim","colorIndicator","indicator","isDark","checkLoading","id","undefined","isExpanded","createElement","className","isLoading","lg","maxWidth","text","displayName","movementIndicator","priceMovement","buyPriceMovement","buy","toFixed","displayPrecision","sm","dailyPercentChange","withoutLoader","dailyPipsChange"],"sources":["../../../../src/components/InstrumentRate/InstrumentRate.tsx"],"sourcesContent":["import React from 'react';\n\nimport { useLayoutProvider } from '../../providers';\nimport { cn } from '../../tailwind';\nimport { LabelSize, LabelWrapper } from '../LabelWrapper';\nimport { Price } from '../Price';\nimport { Truncate } from '../Truncate';\nimport type { InstrumentRateProps } from './types';\n\nconst InstrumentRate = ({\n isError,\n record,\n tooltipId,\n size,\n slim,\n colorIndicator: indicator,\n}: InstrumentRateProps) => {\n const { isDark } = useLayoutProvider();\n const checkLoading = (id: string) => !isError && record?.[id] === undefined;\n const isExpanded = size === 'full' || size === 'fullWithChart';\n\n return (\n <div\n className={cn('lw-flex lw-flex-col', isExpanded && 'lw-h-full')}\n data-testid=\"instrument-rate-wrapper\"\n >\n <div\n className={cn(\n 'lw-flex lw-gap-x-2 lw-text-xl',\n isExpanded && 'lw-h-1/2',\n !slim && 'lw-py-2',\n slim && 'lw-py-1'\n )}\n data-testid=\"instrument-rate-wrapper-label\"\n >\n <LabelWrapper\n isError={!!isError}\n isLoading={checkLoading('instrument')}\n size={LabelSize.lg}\n >\n <span className=\"lw-font-bold\">\n <Truncate\n maxWidth={100}\n text={record.displayName}\n tooltipId={tooltipId}\n />\n </span>\n </LabelWrapper>\n <LabelWrapper\n isError={!!isError}\n isLoading={checkLoading('buy')}\n size={LabelSize.lg}\n >\n <div className=\"lw-font-bold\">\n <Price\n movementIndicator=\"text\"\n priceMovement={record.buyPriceMovement}\n >\n <span>{record.buy?.toFixed(record.displayPrecision)}</span>\n </Price>\n </div>\n </LabelWrapper>\n </div>\n {isExpanded && (\n <div\n className={cn(\n 'lw-flex lw-h-1/2 lw-w-fit lw-items-center lw-gap-x-2 lw-pr-2.5',\n !isDark && 'lw-bg-whiteOpacity',\n isDark && 'lw-bg-blackOpacity',\n !slim && 'lw-py-1',\n slim && 'lw-pb-1'\n )}\n data-testid=\"instrument-rate-wrapper-expanded\"\n >\n <LabelWrapper\n isError={!!isError}\n isLoading={checkLoading('dailyPercentChange')}\n size={LabelSize.sm}\n >\n <span\n className={cn(\n 'lw-font-bold',\n indicator > 0 && 'lw-text-text-ok',\n indicator < 0 && 'lw-text-text-danger',\n indicator === 0 && 'lw-text-text-disabled'\n )}\n >\n {record.dailyPercentChange}\n </span>\n </LabelWrapper>\n <LabelWrapper\n withoutLoader\n isError={!!isError}\n isLoading={checkLoading('dailyPipsChange')}\n size={LabelSize.sm}\n >\n <span\n className={cn(\n 'lw-font-bold',\n indicator > 0 && 'lw-text-text-ok',\n indicator < 0 && 'lw-text-text-danger',\n indicator === 0 && 'lw-text-text-disabled'\n )}\n >\n {`(${record.dailyPipsChange})`}\n </span>\n </LabelWrapper>\n </div>\n )}\n </div>\n );\n};\n\nexport { InstrumentRate };\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -13,7 +13,7 @@ const LabelWrapper = _ref => {
|
|
|
13
13
|
withoutLoader = false
|
|
14
14
|
} = _ref;
|
|
15
15
|
return React.createElement("div", {
|
|
16
|
-
className: classnames('lw-h-[inherit] lw-py-0 lw-font-sans', {
|
|
16
|
+
className: classnames('lw-flex lw-h-[inherit] lw-min-h-[28px] lw-items-center lw-py-0 lw-font-sans', {
|
|
17
17
|
'lw-min-w-[100px]': size === LabelSize.lg,
|
|
18
18
|
'lw-min-w-[70px]': size === LabelSize.md,
|
|
19
19
|
'lw-min-w-[50px]': size === LabelSize.sm
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LabelWrapper.js","names":["classnames","React","CELL_EMPTY_VALUE","Loader","LoaderSize","LabelSize","LabelWrapper","_ref","loaderSize","md","size","children","isError","isLoading","withoutLoader","createElement","className","lg","sm"],"sources":["../../../../src/components/LabelWrapper/LabelWrapper.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport React from 'react';\n\nimport { CELL_EMPTY_VALUE } from '../constant';\nimport { Loader, LoaderSize } from '../Loader';\nimport type { LabelWrapperProps } from './types';\nimport { LabelSize } from './types';\n\nconst LabelWrapper = ({\n loaderSize = LoaderSize.md,\n size = LabelSize.md,\n children,\n isError,\n isLoading,\n withoutLoader = false,\n}: LabelWrapperProps) => (\n <div\n className={classnames('lw-h-[inherit] lw-py-0 lw-font-sans'
|
|
1
|
+
{"version":3,"file":"LabelWrapper.js","names":["classnames","React","CELL_EMPTY_VALUE","Loader","LoaderSize","LabelSize","LabelWrapper","_ref","loaderSize","md","size","children","isError","isLoading","withoutLoader","createElement","className","lg","sm"],"sources":["../../../../src/components/LabelWrapper/LabelWrapper.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport React from 'react';\n\nimport { CELL_EMPTY_VALUE } from '../constant';\nimport { Loader, LoaderSize } from '../Loader';\nimport type { LabelWrapperProps } from './types';\nimport { LabelSize } from './types';\n\nconst LabelWrapper = ({\n loaderSize = LoaderSize.md,\n size = LabelSize.md,\n children,\n isError,\n isLoading,\n withoutLoader = false,\n}: LabelWrapperProps) => (\n <div\n className={classnames(\n 'lw-flex lw-h-[inherit] lw-min-h-[28px] lw-items-center lw-py-0 lw-font-sans',\n {\n 'lw-min-w-[100px]': size === LabelSize.lg,\n 'lw-min-w-[70px]': size === LabelSize.md,\n 'lw-min-w-[50px]': size === LabelSize.sm,\n }\n )}\n data-testid=\"label-wrapper\"\n >\n <div className={classnames('lw-flex lw-h-[inherit] lw-items-center')}>\n {isLoading && !withoutLoader && <Loader size={loaderSize} />}\n {!isLoading && !isError && children}\n {!isLoading && isError && <span>{CELL_EMPTY_VALUE}</span>}\n </div>\n </div>\n);\n\nexport { LabelWrapper };\n"],"mappings":"AAAA,OAAOA,UAAU,MAAM,YAAY;AACnC,OAAOC,KAAK,MAAM,OAAO;AAEzB,SAASC,gBAAgB,QAAQ,aAAa;AAC9C,SAASC,MAAM,EAAEC,UAAU,QAAQ,WAAW;AAE9C,SAASC,SAAS,QAAQ,SAAS;AAEnC,MAAMC,YAAY,GAAGC,IAAA;EAAA,IAAC;IACpBC,UAAU,GAAGJ,UAAU,CAACK,EAAE;IAC1BC,IAAI,GAAGL,SAAS,CAACI,EAAE;IACnBE,QAAQ;IACRC,OAAO;IACPC,SAAS;IACTC,aAAa,GAAG;EACC,CAAC,GAAAP,IAAA;EAAA,OAClBN,KAAA,CAAAc,aAAA;IACEC,SAAS,EAAEhB,UAAU,CACnB,6EAA6E,EAC7E;MACE,kBAAkB,EAAEU,IAAI,KAAKL,SAAS,CAACY,EAAE;MACzC,iBAAiB,EAAEP,IAAI,KAAKL,SAAS,CAACI,EAAE;MACxC,iBAAiB,EAAEC,IAAI,KAAKL,SAAS,CAACa;IACxC,CACF,CAAE;IACF,eAAY;EAAe,GAE3BjB,KAAA,CAAAc,aAAA;IAAKC,SAAS,EAAEhB,UAAU,CAAC,wCAAwC;EAAE,GAClEa,SAAS,IAAI,CAACC,aAAa,IAAIb,KAAA,CAAAc,aAAA,CAACZ,MAAM;IAACO,IAAI,EAAEF;EAAW,CAAE,CAAC,EAC3D,CAACK,SAAS,IAAI,CAACD,OAAO,IAAID,QAAQ,EAClC,CAACE,SAAS,IAAID,OAAO,IAAIX,KAAA,CAAAc,aAAA,eAAOb,gBAAuB,CACrD,CACF,CAAC;AAAA,CACP;AAED,SAASI,YAAY","ignoreList":[]}
|
|
@@ -20,17 +20,16 @@ const Truncate = memo(_ref => {
|
|
|
20
20
|
ref,
|
|
21
21
|
onResize
|
|
22
22
|
});
|
|
23
|
-
return
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
);
|
|
23
|
+
return React.createElement("span", {
|
|
24
|
+
ref: ref,
|
|
25
|
+
className: classnames('lw-block lw-w-max lw-truncate', className),
|
|
26
|
+
"data-testid": "truncate",
|
|
27
|
+
"data-tooltip-content": text,
|
|
28
|
+
"data-tooltip-id": isTruncated ? tooltipId : undefined,
|
|
29
|
+
style: {
|
|
30
|
+
maxWidth: `${maxWidth}px`
|
|
31
|
+
}
|
|
32
|
+
}, text);
|
|
34
33
|
});
|
|
35
34
|
Truncate.displayName = 'Truncate';
|
|
36
35
|
export { Truncate };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Truncate.js","names":["classnames","React","memo","useRef","useState","useDebounceCallback","useResizeObserver","Truncate","_ref","maxWidth","text","tooltipId","className","isTruncated","setIsTruncated","ref","onResize","_ref2","width","createElement","undefined","style","displayName"],"sources":["../../../../src/components/Truncate/Truncate.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport React, { memo, useRef, useState } from 'react';\nimport { useDebounceCallback, useResizeObserver } from 'usehooks-ts';\n\nimport type { TruncateProps } from './types';\n\nconst Truncate = memo(\n ({ maxWidth = 150, text, tooltipId, className }: TruncateProps) => {\n const [isTruncated, setIsTruncated] = useState(false);\n const ref = useRef<HTMLAnchorElement>(null);\n\n const onResize = useDebounceCallback(({ width }) => {\n setIsTruncated(width >= maxWidth);\n }, 50);\n\n useResizeObserver({\n ref,\n onResize,\n });\n\n return (\n
|
|
1
|
+
{"version":3,"file":"Truncate.js","names":["classnames","React","memo","useRef","useState","useDebounceCallback","useResizeObserver","Truncate","_ref","maxWidth","text","tooltipId","className","isTruncated","setIsTruncated","ref","onResize","_ref2","width","createElement","undefined","style","displayName"],"sources":["../../../../src/components/Truncate/Truncate.tsx"],"sourcesContent":["import classnames from 'classnames';\nimport React, { memo, useRef, useState } from 'react';\nimport { useDebounceCallback, useResizeObserver } from 'usehooks-ts';\n\nimport type { TruncateProps } from './types';\n\nconst Truncate = memo(\n ({ maxWidth = 150, text, tooltipId, className }: TruncateProps) => {\n const [isTruncated, setIsTruncated] = useState(false);\n const ref = useRef<HTMLAnchorElement>(null);\n\n const onResize = useDebounceCallback(({ width }) => {\n setIsTruncated(width >= maxWidth);\n }, 50);\n\n useResizeObserver({\n ref,\n onResize,\n });\n\n return (\n <span\n ref={ref}\n className={classnames('lw-block lw-w-max lw-truncate', className)}\n data-testid=\"truncate\"\n data-tooltip-content={text}\n data-tooltip-id={isTruncated ? tooltipId : undefined}\n style={{ maxWidth: `${maxWidth}px` }}\n >\n {text}\n </span>\n );\n }\n);\n\nTruncate.displayName = 'Truncate';\n\nexport { Truncate };\n"],"mappings":"AAAA,OAAOA,UAAU,MAAM,YAAY;AACnC,OAAOC,KAAK,IAAIC,IAAI,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AACrD,SAASC,mBAAmB,EAAEC,iBAAiB,QAAQ,aAAa;AAIpE,MAAMC,QAAQ,GAAGL,IAAI,CACnBM,IAAA,IAAmE;EAAA,IAAlE;IAAEC,QAAQ,GAAG,GAAG;IAAEC,IAAI;IAAEC,SAAS;IAAEC;EAAyB,CAAC,GAAAJ,IAAA;EAC5D,MAAM,CAACK,WAAW,EAAEC,cAAc,CAAC,GAAGV,QAAQ,CAAC,KAAK,CAAC;EACrD,MAAMW,GAAG,GAAGZ,MAAM,CAAoB,IAAI,CAAC;EAE3C,MAAMa,QAAQ,GAAGX,mBAAmB,CAACY,KAAA,IAAe;IAAA,IAAd;MAAEC;IAAM,CAAC,GAAAD,KAAA;IAC7CH,cAAc,CAACI,KAAK,IAAIT,QAAQ,CAAC;EACnC,CAAC,EAAE,EAAE,CAAC;EAENH,iBAAiB,CAAC;IAChBS,GAAG;IACHC;EACF,CAAC,CAAC;EAEF,OACEf,KAAA,CAAAkB,aAAA;IACEJ,GAAG,EAAEA,GAAI;IACTH,SAAS,EAAEZ,UAAU,CAAC,+BAA+B,EAAEY,SAAS,CAAE;IAClE,eAAY,UAAU;IACtB,wBAAsBF,IAAK;IAC3B,mBAAiBG,WAAW,GAAGF,SAAS,GAAGS,SAAU;IACrDC,KAAK,EAAE;MAAEZ,QAAQ,EAAE,GAAGA,QAAQ;IAAK;EAAE,GAEpCC,IACG,CAAC;AAEX,CACF,CAAC;AAEDH,QAAQ,CAACe,WAAW,GAAG,UAAU;AAEjC,SAASf,QAAQ","ignoreList":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@oanda/labs-widget-common",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.215",
|
|
4
4
|
"description": "Labs Widget Common",
|
|
5
5
|
"main": "dist/main/index.js",
|
|
6
6
|
"module": "dist/module/index.js",
|
|
@@ -21,5 +21,5 @@
|
|
|
21
21
|
"tailwind-merge": "2.2.2",
|
|
22
22
|
"usehooks-ts": "3.0.2"
|
|
23
23
|
},
|
|
24
|
-
"gitHead": "
|
|
24
|
+
"gitHead": "fe66bb5a199db202fa18133426a3b6d368897363"
|
|
25
25
|
}
|
|
@@ -18,7 +18,6 @@ const InstrumentRate = ({
|
|
|
18
18
|
const { isDark } = useLayoutProvider();
|
|
19
19
|
const checkLoading = (id: string) => !isError && record?.[id] === undefined;
|
|
20
20
|
const isExpanded = size === 'full' || size === 'fullWithChart';
|
|
21
|
-
const isCompact = size === 'compact';
|
|
22
21
|
|
|
23
22
|
return (
|
|
24
23
|
<div
|
|
@@ -27,9 +26,9 @@ const InstrumentRate = ({
|
|
|
27
26
|
>
|
|
28
27
|
<div
|
|
29
28
|
className={cn(
|
|
30
|
-
'lw-flex lw-gap-x-2',
|
|
31
|
-
isExpanded && 'lw-h-1/2
|
|
32
|
-
!slim &&
|
|
29
|
+
'lw-flex lw-gap-x-2 lw-text-xl',
|
|
30
|
+
isExpanded && 'lw-h-1/2',
|
|
31
|
+
!slim && 'lw-py-2',
|
|
33
32
|
slim && 'lw-py-1'
|
|
34
33
|
)}
|
|
35
34
|
data-testid="instrument-rate-wrapper-label"
|
|
@@ -39,7 +38,7 @@ const InstrumentRate = ({
|
|
|
39
38
|
isLoading={checkLoading('instrument')}
|
|
40
39
|
size={LabelSize.lg}
|
|
41
40
|
>
|
|
42
|
-
<span className="lw-
|
|
41
|
+
<span className="lw-font-bold">
|
|
43
42
|
<Truncate
|
|
44
43
|
maxWidth={100}
|
|
45
44
|
text={record.displayName}
|
|
@@ -52,7 +51,7 @@ const InstrumentRate = ({
|
|
|
52
51
|
isLoading={checkLoading('buy')}
|
|
53
52
|
size={LabelSize.lg}
|
|
54
53
|
>
|
|
55
|
-
<div className="lw-
|
|
54
|
+
<div className="lw-font-bold">
|
|
56
55
|
<Price
|
|
57
56
|
movementIndicator="text"
|
|
58
57
|
priceMovement={record.buyPriceMovement}
|
|
@@ -65,10 +64,11 @@ const InstrumentRate = ({
|
|
|
65
64
|
{isExpanded && (
|
|
66
65
|
<div
|
|
67
66
|
className={cn(
|
|
68
|
-
'lw-flex lw-h-1/2 lw-w-fit lw-items-center lw-gap-x-2 lw-
|
|
67
|
+
'lw-flex lw-h-1/2 lw-w-fit lw-items-center lw-gap-x-2 lw-pr-2.5',
|
|
69
68
|
!isDark && 'lw-bg-whiteOpacity',
|
|
70
69
|
isDark && 'lw-bg-blackOpacity',
|
|
71
|
-
slim && 'lw-py-1
|
|
70
|
+
!slim && 'lw-py-1',
|
|
71
|
+
slim && 'lw-pb-1'
|
|
72
72
|
)}
|
|
73
73
|
data-testid="instrument-rate-wrapper-expanded"
|
|
74
74
|
>
|
|
@@ -15,11 +15,14 @@ const LabelWrapper = ({
|
|
|
15
15
|
withoutLoader = false,
|
|
16
16
|
}: LabelWrapperProps) => (
|
|
17
17
|
<div
|
|
18
|
-
className={classnames(
|
|
19
|
-
'lw-min-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
18
|
+
className={classnames(
|
|
19
|
+
'lw-flex lw-h-[inherit] lw-min-h-[28px] lw-items-center lw-py-0 lw-font-sans',
|
|
20
|
+
{
|
|
21
|
+
'lw-min-w-[100px]': size === LabelSize.lg,
|
|
22
|
+
'lw-min-w-[70px]': size === LabelSize.md,
|
|
23
|
+
'lw-min-w-[50px]': size === LabelSize.sm,
|
|
24
|
+
}
|
|
25
|
+
)}
|
|
23
26
|
data-testid="label-wrapper"
|
|
24
27
|
>
|
|
25
28
|
<div className={classnames('lw-flex lw-h-[inherit] lw-items-center')}>
|
|
@@ -19,8 +19,7 @@ const Truncate = memo(
|
|
|
19
19
|
});
|
|
20
20
|
|
|
21
21
|
return (
|
|
22
|
-
|
|
23
|
-
<a
|
|
22
|
+
<span
|
|
24
23
|
ref={ref}
|
|
25
24
|
className={classnames('lw-block lw-w-max lw-truncate', className)}
|
|
26
25
|
data-testid="truncate"
|
|
@@ -29,7 +28,7 @@ const Truncate = memo(
|
|
|
29
28
|
style={{ maxWidth: `${maxWidth}px` }}
|
|
30
29
|
>
|
|
31
30
|
{text}
|
|
32
|
-
</
|
|
31
|
+
</span>
|
|
33
32
|
);
|
|
34
33
|
}
|
|
35
34
|
);
|
|
@@ -56,7 +56,7 @@ describe('InstrumentRate components', () => {
|
|
|
56
56
|
expect(wrapper).toBeInTheDocument();
|
|
57
57
|
expect(wrapper).toHaveClass('lw-flex', 'lw-flex-col');
|
|
58
58
|
expect(wrapper).not.toHaveClass('lw-h-full');
|
|
59
|
-
expect(getByTestId('instrument-rate-wrapper-label')).toHaveClass('lw-py-
|
|
59
|
+
expect(getByTestId('instrument-rate-wrapper-label')).toHaveClass('lw-py-2');
|
|
60
60
|
});
|
|
61
61
|
|
|
62
62
|
it('renders with full size', () => {
|
|
@@ -66,7 +66,7 @@ describe('InstrumentRate components', () => {
|
|
|
66
66
|
expect(wrapper).toHaveClass('lw-flex', 'lw-flex-col', 'lw-h-full');
|
|
67
67
|
expect(getByTestId('instrument-rate-wrapper-label')).toHaveClass(
|
|
68
68
|
'lw-h-1/2',
|
|
69
|
-
'lw-
|
|
69
|
+
'lw-py-2'
|
|
70
70
|
);
|
|
71
71
|
});
|
|
72
72
|
|
|
@@ -77,7 +77,7 @@ describe('InstrumentRate components', () => {
|
|
|
77
77
|
expect(wrapper).toHaveClass('lw-flex', 'lw-flex-col', 'lw-h-full');
|
|
78
78
|
expect(getByTestId('instrument-rate-wrapper-label')).toHaveClass(
|
|
79
79
|
'lw-h-1/2',
|
|
80
|
-
'lw-
|
|
80
|
+
'lw-py-2'
|
|
81
81
|
);
|
|
82
82
|
});
|
|
83
83
|
|