Merge branch 'main' into Jia/update-block-title-max-width

deriv-com · Dec 20, 2023 · 17d5163 · 17d5163
2 parents ca6f7f0 + da4ca9e
commit 17d5163
Show file tree

Hide file tree

Showing 9 changed files with 29 additions and 21 deletions.
diff --git a/libs/blocks/CHANGELOG.md b/libs/blocks/CHANGELOG.md
@@ -2,6 +2,8 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [0.53.0](https://github.com/deriv-com/deriv-com-v2/compare/blocks-0.52.0...blocks-0.53.0) (2023-12-20)
+
 ## [0.52.0](https://github.com/deriv-com/deriv-com-v2/compare/blocks-0.51.0...blocks-0.52.0) (2023-12-18)
 
 

diff --git a/libs/blocks/package.json b/libs/blocks/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@deriv-com/blocks",
-  "version": "0.52.0",
+  "version": "0.53.0",
   "main": "./index.js",
   "exports": {
     ".": {

diff --git a/libs/blocks/src/lib/live-market/tab/tab.stories.tsx b/libs/blocks/src/lib/live-market/tab/tab.stories.tsx
@@ -26,9 +26,9 @@ export const Default: Story = {
         disclaimer="*Prices are used for currency conversion and are published for reference only. Prices shown on our website are indicative and for reference only."
         link={{ href: '/', content: 'More forex' }}
         tabs={[
-          { children: 'Forex' },
-          { children: 'Derived Indices' },
-          { children: 'Etfs' },
+          { content: 'Forex' },
+          { content: 'Derived Indices' },
+          { content: 'Etfs' },
         ]}
       >
         <CardSlider
@@ -50,7 +50,7 @@ export const Default: Story = {
             {
               id: 1,
               instrumentIcon: <MarketForexGbpusdIcon />,
-              instrument: 'GBP/USD',
+              instrument: 'EUR/USD DFX 10 Index',
               changePercentage: '+0.11%',
               status: 'down',
               bidPrice: '1.24112',

diff --git a/libs/blocks/src/lib/platform/tab/tab.stories.tsx b/libs/blocks/src/lib/platform/tab/tab.stories.tsx
@@ -22,11 +22,7 @@ export const Default: Story = {
         header="Header here"
         description="desciption here description here"
         className="bg-background-primary-base"
-        tabs={[
-          { children: 'All' },
-          { children: 'CFDs' },
-          { children: 'Options' },
-        ]}
+        tabs={[{ content: 'All' }, { content: 'CFDs' }, { content: 'Options' }]}
       >
         <CardsContainer
           cols="three"

diff --git a/libs/components/CHANGELOG.md b/libs/components/CHANGELOG.md
@@ -2,6 +2,8 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [0.33.0](https://github.com/deriv-com/deriv-com-v2/compare/components-0.32.0...components-0.33.0) (2023-12-20)
+
 ## [0.32.0](https://github.com/deriv-com/deriv-com-v2/compare/components-0.31.0...components-0.32.0) (2023-12-20)
 
 

diff --git a/libs/components/package.json b/libs/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@deriv-com/components",
-  "version": "0.32.0",
+  "version": "0.33.0",
   "main": "./index.js",
   "exports": {
     ".": {

diff --git a/libs/components/src/lib/card/live-market/index.tsx b/libs/components/src/lib/card/live-market/index.tsx
@@ -63,14 +63,14 @@ export const LiveMarketCard: React.FC<LiveMarketCardProps> = ({
       className={qtMerge(
         'flex flex-col',
         'rounded-xl',
-        'h-[262px] w-[286px]',
+        'h-[284px] w-[296px]',
         'bg-background-primary-container',
         'p-general-xl',
         'gap-gap-xl',
         className,
       )}
     >
-      <div className="flex h-[52px] flex-row gap-gap-sm">
+      <div className="flex h-[52px] shrink-0 grow flex-row gap-gap-sm">
         <div className="flex flex-1 flex-row gap-gap-md">
           <div className={clsx(status === 'closed' && 'opacity-600')}>
             {instrumentIcon}

diff --git a/libs/components/src/lib/tab/base/index.tsx b/libs/components/src/lib/tab/base/index.tsx
@@ -5,10 +5,14 @@ import {
   cloneElement,
   isValidElement,
 } from 'react';
-import { Tab } from '@deriv/quill-design';
+import { Tab, qtJoin } from '@deriv/quill-design';
+
+type TabTrigger = Omit<ComponentProps<typeof Tab.Trigger>, 'children'> & {
+  content: ReactNode;
+};
 
 export interface TabProps {
-  tabs: ComponentProps<typeof Tab.Trigger>[];
+  tabs: TabTrigger[];
   className?: string;
   children: ReactNode;
 }
@@ -17,9 +21,13 @@ export const TabBase = ({ tabs, children, className }: TabProps) => {
   return (
     <Tab.Container className={className}>
       <Tab.List>
-        {tabs.map(({ children, ...rest }, i) => (
-          <Tab.Trigger {...rest} key={i}>
-            {children}
+        {tabs.map(({ content, className, ...rest }, i) => (
+          <Tab.Trigger
+            className={qtJoin('whitespace-nowrap', className)}
+            {...rest}
+            key={i}
+          >
+            {content}
           </Tab.Trigger>
         ))}
       </Tab.List>

diff --git a/libs/components/src/lib/tab/base/tab.stories.tsx b/libs/components/src/lib/tab/base/tab.stories.tsx
@@ -14,9 +14,9 @@ export const Default: Story = {
     return (
       <Tab.Base
         tabs={[
-          { children: 'Home' },
-          { children: 'Profile' },
-          { children: 'Contact' },
+          { content: 'Home' },
+          { content: 'Profile' },
+          { content: 'Contact' },
         ]}
       >
         <div>Home Tab</div>
Original file line number	Diff line number	Diff line change
Expand Up		@@ -2,6 +2,8 @@

		This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).

		## [0.53.0](https://github.com/deriv-com/deriv-com-v2/compare/blocks-0.52.0...blocks-0.53.0) (2023-12-20)

		## [0.52.0](https://github.com/deriv-com/deriv-com-v2/compare/blocks-0.51.0...blocks-0.52.0) (2023-12-18)


Expand Down