Merge branch 'main' into meenu-create-new-cta-variant

libs/blocks/CHANGELOG.md

@@ -2,6 +2,19 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [0.93.0](https://github.com/deriv-com/deriv-com-v2/compare/blocks-0.92.0...blocks-0.93.0) (2024-02-14)
+
+
+### Bug Fixes
+
+* ts fix ([4b304fc](https://github.com/deriv-com/deriv-com-v2/commit/4b304fcd5c37f2fcbbbf5ab918e45a3aa386d0fd))
+
+## [0.92.0](https://github.com/deriv-com/deriv-com-v2/compare/blocks-0.91.0...blocks-0.92.0) (2024-02-08)
+
+## [0.91.0](https://github.com/deriv-com/deriv-com-v2/compare/blocks-0.90.0...blocks-0.91.0) (2024-02-08)
+
+## [0.90.0](https://github.com/deriv-com/deriv-com-v2/compare/blocks-0.89.0...blocks-0.90.0) (2024-02-07)
+
 ## [0.89.0](https://github.com/deriv-com/deriv-com-v2/compare/blocks-0.88.0...blocks-0.89.0) (2024-02-02)
 
 ## [0.88.0](https://github.com/deriv-com/deriv-com-v2/compare/blocks-0.87.0...blocks-0.88.0) (2024-02-02)

libs/blocks/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deriv-com/blocks",
-  "version": "0.89.0",
+  "version": "0.93.0",
   "private": false,
   "main": "./index.js",
   "exports": {

libs/blocks/src/lib/features/card-feature/index.tsx

@@ -6,25 +6,8 @@ import {
   Text,
   qtMerge,
 } from '@deriv/quill-design';
-import { ComponentProps, ReactNode } from 'react';
-import {
-  CardContent,
-  CardVariantType,
-  CardsContainer,
-} from '@deriv-com/components';
-
-type SectionProps = Omit<ComponentProps<typeof Section>, 'title'>;
-
-export type FeatureCardProps = SectionProps & {
-  title?: ReactNode;
-  description?: ReactNode;
-  cta?: ReactNode;
-  className?: string;
-  cards?: CardContent[];
-  cols?: 'two' | 'three' | 'four';
-  variant?: CardVariantType;
-  hasPadding?: boolean;
-};
+import { CardsContainer } from '@deriv-com/components';
+import { FeatureCardProps } from '../types';
 
 const Card = ({
   title,

libs/blocks/src/lib/features/content-left/index.tsx

@@ -1,15 +1,6 @@
 import { FluidContainer, Heading, Section, Text } from '@deriv/quill-design';
 import clsx from 'clsx';
-import React, { ReactNode } from 'react';
-
-export interface ContentLeftProps {
-  title: ReactNode;
-  className?: string;
-  description?: ReactNode;
-  content?: React.FC;
-  children?: ReactNode;
-  variant?: 'content-left' | 'content-right';
-}
+import { ContentLeftProps } from '../types';
 
 // trigger deployment - 5
 const ContentLeft = ({

libs/blocks/src/lib/features/content-right/index.tsx

@@ -1,4 +1,5 @@
-import ContentLeft, { ContentLeftProps } from '../content-left';
+import ContentLeft from '../content-left';
+import { ContentLeftProps } from '../types';
 
 const ContentRight = ({
   title,

libs/blocks/src/lib/features/content-slider/index.tsx

@@ -1,19 +1,7 @@
 import clsx from 'clsx';
 import { FluidContainer, Heading, Section, Text } from '@deriv/quill-design';
-import { ReactNode } from 'react';
-import {
-  CardSlider,
-  CardSliderProps,
-  CardVariantType,
-} from '@deriv-com/components';
-
-export interface ContentSliderProps<T extends CardVariantType> {
-  title?: ReactNode;
-  description?: ReactNode;
-  cta?: () => ReactNode;
-  className?: string;
-  cardSliderProps?: CardSliderProps<T>;
-}
+import { CardSlider, CardVariantType } from '@deriv-com/components';
+import { ContentSliderProps } from '../types';
 
 const ContentSlider = <T extends CardVariantType>({
   title,

libs/blocks/src/lib/features/index.ts

@@ -25,3 +25,5 @@ Features.ContentRight = ContentRight;
 Features.ContentSlider = ContentSlider;
 
 export default Features;
+
+export * from './types';

libs/blocks/src/lib/features/types.ts

@@ -0,0 +1,37 @@
+import {
+  CardContent,
+  CardSliderProps,
+  CardVariantType,
+} from '@deriv-com/components';
+import { Section } from '@deriv/quill-design';
+import { ComponentProps, ReactNode } from 'react';
+
+type SectionProps = Omit<ComponentProps<typeof Section>, 'title'>;
+
+export type FeatureCardProps = SectionProps & {
+  title?: ReactNode;
+  description?: ReactNode;
+  cta?: ReactNode;
+  className?: string;
+  cards?: CardContent[];
+  cols?: 'two' | 'three' | 'four';
+  variant?: CardVariantType;
+  hasPadding?: boolean;
+};
+
+export interface ContentLeftProps {
+  title: ReactNode;
+  className?: string;
+  description?: ReactNode;
+  content?: React.FC;
+  children?: ReactNode;
+  variant?: 'content-left' | 'content-right';
+}
+
+export interface ContentSliderProps<T extends CardVariantType> {
+  title?: ReactNode;
+  description?: ReactNode;
+  cta?: () => ReactNode;
+  className?: string;
+  cardSliderProps?: CardSliderProps<T>;
+}

libs/blocks/src/lib/hero/index.tsx

@@ -6,8 +6,8 @@ import ContentLess from './content-less';
 import { ReactNode } from 'react';
 
 export type HeroBlockProps = {
-  title?: string;
-  description?: string;
+  title?: ReactNode | string;
+  description?: ReactNode | string;
   containerClassName?: string;
   content?: ReactNode;
   children?: ReactNode;

libs/blocks/src/lib/platform/card/index.tsx

@@ -1,25 +1,12 @@
-import { ReactNode } from 'react';
 import {
   FluidContainer,
   Heading,
   Section,
   Text,
   qtMerge,
 } from '@deriv/quill-design';
-import {
-  CardContent,
-  CardVariantType,
-  CardsContainer,
-} from '@deriv-com/components';
-
-export type PlatformBlockCardProps = {
-  header?: ReactNode;
-  description?: ReactNode;
-  className?: string;
-  cards?: CardContent[];
-  cols?: 'two' | 'three' | 'four';
-  variant?: CardVariantType;
-};
+import { CardsContainer } from '@deriv-com/components';
+import { PlatformBlockCardProps } from '../types';
 
 const PlatformBlockCard = ({
   header,

libs/blocks/src/lib/platform/index.tsx

@@ -2,6 +2,8 @@ import { ReactNode } from 'react';
 import PlatformBlockTab from './tab';
 import PlatformBlockCard from './card';
 
+export * from './types';
+
 export type PlatformBlockType = {
   Tab: typeof PlatformBlockTab;
   Card: typeof PlatformBlockCard;

libs/blocks/src/lib/platform/tab/index.tsx

@@ -1,4 +1,3 @@
-import { ComponentProps, ReactNode } from 'react';
 import {
   FluidContainer,
   Heading,
@@ -7,13 +6,7 @@ import {
   qtMerge,
 } from '@deriv/quill-design';
 import { Tab } from '@deriv-com/components';
-
-export type PlatformBlockTabProps = ComponentProps<typeof Tab.Base> & {
-  header?: ReactNode;
-  description?: ReactNode;
-  className?: string;
-  children: ReactNode;
-};
+import { PlatformBlockTabProps } from '../types';
 
 const PlatformBlockTab = ({
   header,

libs/blocks/src/lib/platform/types.ts

@@ -0,0 +1,19 @@
+import { CardContent, CardVariantType, Tab } from '@deriv-com/components';
+
+import { ComponentProps, ReactNode } from 'react';
+
+export type PlatformBlockCardProps = {
+  header?: ReactNode;
+  description?: ReactNode;
+  className?: string;
+  cards?: CardContent[];
+  cols?: 'two' | 'three' | 'four';
+  variant?: CardVariantType;
+};
+
+export type PlatformBlockTabProps = ComponentProps<typeof Tab.Base> & {
+  header?: ReactNode;
+  description?: ReactNode;
+  className?: string;
+  children: ReactNode;
+};

libs/components/CHANGELOG.md

@@ -2,6 +2,22 @@
 
 This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
 
+## [0.54.0](https://github.com/deriv-com/deriv-com-v2/compare/components-0.53.0...components-0.54.0) (2024-02-13)
+
+
+### Bug Fixes
+
+* added width ([d3b4d40](https://github.com/deriv-com/deriv-com-v2/commit/d3b4d4035b85536b16e3e9aafcb239bb25895bc5))
+
+## [0.53.0](https://github.com/deriv-com/deriv-com-v2/compare/components-0.52.0...components-0.53.0) (2024-02-13)
+
+
+### Bug Fixes
+
+* added condition for horizontal ([fdde7e8](https://github.com/deriv-com/deriv-com-v2/commit/fdde7e88cc511af024fb131368f5ef2f190cf2d0))
+* refactor ([ff65319](https://github.com/deriv-com/deriv-com-v2/commit/ff65319a8bce259dae1b0de04025cdae5d177811))
+* removed icon class name ([143c428](https://github.com/deriv-com/deriv-com-v2/commit/143c428ce48a05a71522fa3e0e7264b9ac3af15b))
+
 ## [0.52.0](https://github.com/deriv-com/deriv-com-v2/compare/components-0.51.0...components-0.52.0) (2024-01-31)
 
 

libs/components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@deriv-com/components",
-  "version": "0.52.0",
+  "version": "0.54.0",
   "private": false,
   "main": "./index.js",
   "exports": {

libs/components/src/lib/rating/index.tsx

@@ -67,6 +67,16 @@ const StarBox = ({ percent, colorKey = 0, size = 'md' }: StarBoxProps) => {
     md: 'lg:px-700 lg:py-800 px-500 py-400',
   };
 
+  const iconProps = {
+    fill: '#ffffff',
+    fillOpacity: 1,
+    width: 100,
+    ...(size === 'md' && {
+      height: 100,
+      className: StarClassName[size],
+    }),
+  };
+
   return (
     <div
       className={qtMerge(
@@ -88,13 +98,7 @@ const StarBox = ({ percent, colorKey = 0, size = 'md' }: StarBoxProps) => {
         )}
       />
       <div className="absolute left-50 top-50 flex h-full w-full items-center justify-center">
-        <LabelPairedTrustpilotMdIcon
-          width={100}
-          height={100}
-          className={StarClassName[size]}
-          fill="#ffffff"
-          fillOpacity={1}
-        />
+        <LabelPairedTrustpilotMdIcon {...iconProps} />
       </div>
     </div>
   );