Merge pull request #356 from deriv-com/meenu-export-hero-block-types

libs/blocks/src/lib/hero/content-bottom/index.tsx

@@ -1,19 +1,13 @@
 import { Heading, qtMerge } from '@deriv/quill-design';
 import BlockWrapper from '../../block-wrapper';
-
-export interface ContentBottomProps {
-  title: string;
-  className?: string;
-  containerClassName?: string;
-  children: React.ReactNode;
-}
+import { HeroBlockProps } from '..';
 
 const ContentBottom = ({
   className = '',
   containerClassName = '',
   title,
   children,
-}: ContentBottomProps) => {
+}: HeroBlockProps) => {
   return (
     <BlockWrapper background="light" className={className}>
       <div className={qtMerge('flex flex-col gap-gap-3xl', containerClassName)}>

libs/blocks/src/lib/hero/content-less/index.tsx

@@ -1,19 +1,13 @@
 import Content from '../content';
 import BlockWrapper from '../../block-wrapper';
-
-export interface ContentLessProps {
-  title: React.ReactNode;
-  description?: React.ReactNode;
-  className?: string;
-  children?: React.ReactNode;
-}
+import { HeroBlockProps } from '..';
 
 const ContentLess = ({
   className,
   title,
   description,
   children,
-}: ContentLessProps) => {
+}: HeroBlockProps) => {
   return (
     <BlockWrapper className={className} background="light">
       <Content title={title} description={description} center={true}>

libs/blocks/src/lib/hero/content-limit/index.tsx

@@ -2,16 +2,9 @@ import React from 'react';
 import Content from '../content';
 import { FluidContainer, Section, qtMerge } from '@deriv/quill-design';
 import clsx from 'clsx';
+import { HeroBlockProps } from '..';
 
-export interface ContentLimitProps {
-  className?: string;
-  title?: string;
-  description?: string;
-  content?: React.ReactNode;
-  children?: React.ReactNode;
-}
-
-const ContentLimit: React.FC<ContentLimitProps> = ({
+const ContentLimit: React.FC<HeroBlockProps> = ({
   title,
   description,
   content,

libs/blocks/src/lib/hero/content-limitless/index.tsx

@@ -1,15 +1,9 @@
 import { FluidContainer, Section } from '@deriv/quill-design';
-import { ReactNode } from 'react';
 import clsx from 'clsx';
 import Content from '../content';
-export interface ContentLimitlessProps {
-  title?: string;
-  description?: string;
-  content?: ReactNode;
-  children?: ReactNode;
-  className?: string;
-}
-const ContentLimitless: React.FC<ContentLimitlessProps> = ({
+import { HeroBlockProps } from '..';
+
+const ContentLimitless: React.FC<HeroBlockProps> = ({
   title,
   description,
   content,

libs/blocks/src/lib/hero/content-top/index.tsx

@@ -1,6 +1,7 @@
-import ContentBottom, { ContentBottomProps } from '../content-bottom';
+import { HeroBlockProps } from '..';
+import ContentBottom from '../content-bottom';
 
-const ContentTop = ({ className, title, children }: ContentBottomProps) => {
+const ContentTop = ({ className, title, children }: HeroBlockProps) => {
   return (
     <ContentBottom
       title={title}

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

@@ -1,7 +1,7 @@
 import { Heading, Text, qtJoin } from '@deriv/quill-design';
-import { ContentLessProps } from '../content-less';
+import { HeroBlockProps } from '..';
 
-export interface ContentProps extends ContentLessProps {
+export interface ContentProps extends HeroBlockProps {
   center?: boolean;
 }
 

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

@@ -1,24 +1,18 @@
-import ContentLimit, { ContentLimitProps } from './content-limit';
-import ContentLimitless, { ContentLimitlessProps } from './content-limitless';
-import ContentBottom, { ContentBottomProps } from './content-bottom';
+import ContentLimit from './content-limit';
+import ContentLimitless from './content-limitless';
+import ContentBottom from './content-bottom';
 import ContentTop from './content-top';
-import ContentLess, { ContentLessProps } from './content-less';
+import ContentLess from './content-less';
 import { ReactNode } from 'react';
 
-export {
-  ContentLessProps,
-  ContentLimitProps,
-  ContentLimitlessProps,
-  ContentBottomProps,
-};
-export interface HeroProps {
-  className?: string;
-  title?: ReactNode;
-  description?: ReactNode;
+export type HeroBlockProps = {
+  title?: string;
+  description?: string;
+  containerClassName?: string;
   content?: ReactNode;
   children?: ReactNode;
-}
-
+  className?: string;
+};
 export type HeroVariants = {
   ContentLimitless: typeof ContentLimitless;
   ContentLimit: typeof ContentLimit;