hds-web 1.33.1 → 1.33.2

package/src/HDS/components/Breadcrumbs/breadCrumbs.js

@@ -1,63 +0,0 @@
-import React from 'react';
-import { Icon } from "../common-components/Icon"
-import PropTypes from 'prop-types';
-// const pages = [
-//   { name: 'Events', href: '#', current: false },
-//   { name: '', href: '#', current: false },
-//   { name: 'Hasura Con 23', href: '#', current: true },
-// ]
-
-const BUTTON_CLASSES = {
-  'A': 'text-blue-600',
-  'B': 'bg-blue-100 text-blue-600 rounded-full',
-  'C': 'bg-neutral-100 text-neutral-800 rounded-full'
-}
-
-export default function Breadcrumbs(props) {
-  const pages = Array.isArray(props.pages) ? props.pages : [];
-  const {
-    dividerIconVariant,
-    buttonVariant
-  } = props
-
-  return (
-    <nav className="flex" aria-label="Breadcrumb">
-      <ol role="list" className="flex items-center space-x-4">
-        <li>
-          <div>
-            <a href="#" className="text-pink-400 hover:text-gray-500">
-
-              <Icon height='h-5' variant={'homeline'} strokeColor={'#4D5761'} />
-              <span className="sr-only">Home</span>
-            </a>
-          </div>
-        </li>
-        {pages.map((page) => (
-          <li key={page.name}>
-            <div className="flex items-center">
-            <div className='-ml-0.5 mr-2 h-4 w-4'>
-            <Icon variant={dividerIconVariant} strokeColor={`#4D5761`} />
-          </div>
-              <a
-                href={page.href}
-                className={`${BUTTON_CLASSES[`${buttonVariant}`]} ml-4 py-1 px-2 text-sm-medium hover:text-gray-700`}
-                aria-current={page.current ? 'page' : undefined}
-              >
-                {page.name}
-              </a>
-            </div>
-          </li>
-        ))}
-      </ol>
-    </nav>
-  )
-}
-
-Breadcrumbs.propTypes = {
-  dividerIconVariant: PropTypes.string,
-
-};
-
-Breadcrumbs.defaultProps = {
-  dividerIconVariant: 'chevronright',
-};

package/src/HDS/components/Breadcrumbs/index.js

@@ -1 +0,0 @@
-export {default as BreadCrumbs} from './breadCrumbs';

package/src/HDS/components/Buttons/button.js

@@ -1,239 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { Icon } from '../common-components/Icon';
-import { HDSColor } from '../../foundation/ColorPalette';
-
-const ANIMATED_ARR_CLASSES = {
-  'icon1':{
-    'sm':'h-5 w-5 ',
-    'md': 'h-5 w-5',
-    'lg': 'h-6 w-6'
-  },
-  'icon2':{
-    'sm':'h-5 w-5 -mt-5',
-    'md': 'h-5 w-5 -mt-5',
-    'lg': 'h-6 w-6 -mt-6'
-  },
-
-}
-
-const Buttonclasses = {
-  'primary': {
-    'default': {
-      'base': 'db:w-fit tb:w-fit w-full justify-center justify-center bg-blue-500 text-neutral-0',
-      'hover': 'hover:bg-blue-700 hover:text-neutral-0 hover:shadow-md hover:shadow hover:transition-all hover:ease-out hover:duration-300',
-      'focus': 'focus:bg-blue-600 focus:shadow-[0_0px_0px_4px_#DFE8FF] focus:text-neutral-0 focus:outline-none active:bg-blue-600 active:text-neutral-0 active:outline-none',
-
-    },
-    'disabled': 'bg-neutral-200 text-neutral-400',
-  },
-  'tonal': {
-    'default': {
-      'base': 'db:w-fit tb:w-fit w-full justify-center bg-blue-200 text-blue-600',
-      'hover': 'hover:bg-blue-700 hover:text-neutral-0 hover:shadow-md hover:shadow hover:transition-all hover:ease-out hover:duration-300',
-      'focus': 'focus:bg-blue-100 focus:text-blue-600 focus:shadow-[0px_0px_0px_4px_#DFE8FF] focus:outline-none',
-    },
-    'disabled': 'bg-neutral-200 text-neutral-400',
-  },
-  'secondary': {
-    'default': {
-      'base': 'db:w-fit tb:w-fit w-full justify-center border-2 border-blue-500 text-blue-500',
-      'hover': 'hover:text-neutral-0 hover:bg-blue-700 hover:border-2 hover:border-blue-700 hover:shadow-md hover:shadow hover:transition-all hover:ease-out hover:duration-200 ',
-      'focus': 'focus:bg-blue-200 focus:text-blue-500 focus:border-2 border-blue-500 focus:shadow-[0px_0px_0px_4px_#DFE8FF] focus:outline-none focus:text-blue-500',
-    },
-    'disabled': 'bg-neutral-200 text-neutral-400',
-  },
-  'secondaryWhite': {
-    'default': {
-      'base': 'db:w-fit tb:w-fit w-full justify-center border-2 border-neutral-0 text-neutral-0 ',
-
-      'hover': 'hover:text-neutral-0 hover:border-opacity-0 hover:shadow-md hover:shadow hover:transition-all hover:ease-out hover:duration-300',
-      
-      'focus': 'focus:text-neutrak-0 focus:border-2 border-neutral-0 focus:outline-none focus:text-neutral-0',
-    },
-    'disabled': 'bg-neutral-200 text-neutral-400',
-  },
-  
-  'ghost': {
-    'default': {
-      'base': 'db:w-fit tb:w-fit w-full  justify-center text-neutral-0',
-      'hover': ' ',
-      'focus': 'focus:outline-none',
-    },
-    'disabled': ' bg-neutral-200 text-neutral-400',
-  },
-  'ghostBlue': {
-    'default': {
-      'base': 'db:w-fit tb:w-fit w-full  justify-center border-none hover:border-opacity-100 hover:border-2 rounded-full text-blue-500',
-      'hover': 'hover:bg-blue-700 hover:text-neutral-0 hover:shadow-md hover:shadow hover:transition-all hover:ease-out hover:duration-300',
-      'focus': 'focus:outline-none',
-    },
-    'disabled': ' bg-neutral-200 text-neutral-400',
-  },
-  'primaryLink': {
-    'default': {
-      'base': 'db:w-fit tb:w-fit w-full justify-center ',
-      'hover': '',
-      'focus': 'focus:shadow-[0px_0px_0px_4px_#DFE8FF] focus:outline-none focus:text-blue-600',
-    },
-    'disabled': 'text-neutral-300',
-  },
-  'secondaryLink': {
-    'default': {
-      'base': 'db:w-fit tb:w-fit w-full  justify-center ',
-      'hover': '',
-      'focus': 'focus:text-neutral-900 focus:outline-none focus:shadow-[0px_0px_0px_4px_#E5E7EB]',
-    },
-    'disabled': 'text-neutral-300',
-  },
-  'iconOnly': {
-    'default': {
-      'base': 'w-fit justify-center justify-center bg-blue-200 rounded-full p-1.5',
-
-      'hover': 'hover:bg-blue-600 hover:shadow-md hover:shadow hover:transition-all hover:ease-in-out hover:duration-300',
-
-      'focus': 'focus:bg-blue-600 focus:shadow-[0_0px_0px_4px_#DFE8FF] focus:text-neutral-0 focus:outline-none',
-    },
-    'disabled': 'bg-neutral-200 text-neutral-400',
-    'icon':{
-      'sm':'h-5 w-5 p-0',
-      'md': 'h-5 w-5 p-2.5',
-      'lg': 'h-6 w-6 p-3'
-    },
-  },
-  'buttonSizes' : {
-    'default': {
-      'sm': 'text-hds-d-body3c-medium py-1.5 pr-2.5 pl-4 rounded-full',
-      'md': 'text-hds-d-body3c-medium rounded-full py-2.5 pl-5 pr-3',
-      'lg': 'text-hds-d-body1c-medium rounded-full py-3 pl-6 pr-4'
-    },
-    'iconOnly': {
-      'sm': 'rounded-full',
-      'md': 'rounded-full p-2.5',
-      'lg': 'trounded-full p-3'
-    },
-    'links': {
-      'sm': 'text-hds-d-body3c-medium rounded-full',
-      'md': 'text-hds-d-body3c-medium rounded-full',
-      'lg': 'text-hds-d-body1c-medium rounded-full'
-    },
-  }
-}
-export default function Button(props) {
-  const {
-    btnTextColorClass,
-    btnTextHoverClass,
-    btnBgColorClass,
-    btnbgHoverClass,
-    rightIconVariant,
-    rightIconColor,
-    leftIconVariant,
-    leftIconColor,
-    type,
-    state,
-    size,
-    label,
-    rightAnimatedArrow,
-    rightAnimatedArrowColor,
-    animatedHoverStroke,
-    className,
-    ...rest // destructuring rest of the props
-  } = props
-
-  let defaultClasses = '';
-
-  if (state === 'default') {
-    const baseClasses = Buttonclasses[type][state]['base'];
-    const hoverClasses = Buttonclasses[type][state]['hover'];
-    const focusClasses = Buttonclasses[type][state]['focus'];
-    defaultClasses = `${baseClasses} ${hoverClasses} ${focusClasses}`;
-  } else if (state === 'disabled') {
-    defaultClasses = Buttonclasses[type][state];
-  }
-
-  let sizeType = 'default';
-  if(type==='iconOnly'){sizeType='iconOnly'}
-  if(type==='secondaryLink' || type==='primaryLink' ){sizeType='links'}
-
-
-  const buttonClasses = [
-    'inline-flex items-center whitespace-pre',
-    'rounded-full',
-    btnBgColorClass,
-    btnTextColorClass,
-    Buttonclasses['buttonSizes'][`${sizeType}`][`${size}`],
-    'group',
-    defaultClasses,
-    className,
-    HDSColor(btnTextHoverClass),
-    HDSColor(btnbgHoverClass)
-
-  ].join(' ');
-
-  return (
-    <div>
-      <button
-        type="button"
-        className={buttonClasses}
-        {...rest}
-      >
-        {leftIconVariant && leftIconVariant !== 'none' && type!='iconOnly' && (
-          <div className={`-ml-0.5 mr-2 ${ANIMATED_ARR_CLASSES['icon1'][`${size}`]} `}>
-            <Icon variant={leftIconVariant} strokeColor={leftIconColor} />
-          </div>
-        )}
-
-         {leftIconVariant && leftIconVariant !== 'none' && type=='iconOnly' && (
-          <div className={``}>
-            <Icon variant={leftIconVariant} height={`${ANIMATED_ARR_CLASSES['icon1'][`${size}`]} group-active:stroke-neutral-0 stroke-[1.5px] group-hover:transition-all group-hover:ease-in-out group-hover:duration-100 group-hover:stroke-neutral-0 group-focus:stroke-neutral-0`} strokeColor={leftIconColor} />
-          </div>
-        )}
-        {label}
-
-        {rightAnimatedArrow && rightAnimatedArrow !== 'none'  && type!=='iconOnly' && (
-          <div className={ `group-hover:transition-all ${animatedHoverStroke}`}>
-            <Icon className='z-10 stroke-2 group-hover:translate-x-[0.15rem] group-hover:transition-all group-hover:duration-300' height={`${ANIMATED_ARR_CLASSES['icon1'][`${size}`]} ${animatedHoverStroke}`} variant={'chevronright'} strokeColor={rightAnimatedArrowColor} />
-
-            <Icon className='invisible stroke-2 group-hover:transition-all group-hover:delay-100 group-hover:visible ' height={`${ANIMATED_ARR_CLASSES['icon2'][`${size}`]} ${animatedHoverStroke}`} variant='minus01' strokeColor={rightAnimatedArrowColor} />
-
-          </div>
-        )}
-
-        {rightIconVariant && rightIconVariant !== 'none'  && type!='iconOnly' && (
-           <div className='ml-1.5 h-4 w-4 '>
-           <Icon variant={rightIconVariant} strokeColor={rightIconColor} />
-         </div>
-        )}
-      </button>
-    </div>
-  );
-};
-
-Button.propTypes = {
-  size: PropTypes.oneOf(['sm', 'md', 'lg', 'xl', '2xl']),
-  label: PropTypes.string.isRequired,
-  type: PropTypes.string.isRequired,
-  state: PropTypes.oneOf(['default', 'disabled']),
-  leftIconVariant: PropTypes.string,
-  rightIconVariant: PropTypes.string,
-  animatedHoverStroke: PropTypes.string
-
-
-};
-
-Button.defaultProps = {
-  size: 'md',
-  type: 'primary',
-  leftIconVariant: 'none',
-  rightIconVariant: 'none',
-  rightIconColor: '#FFFFFF',
-  leftIconColor: '#FFFFFF',
-  state: 'default',
-  label: 'Button',
-  rightAnimatedArrow: 'true' ,
-  rightAnimatedArrowColor: '#FFFFFF',
-  animatedHoverStroke: 'group-hover:stroke-neutral-0',
-
-  btnTextHoverClass: 'hover:text-neutral-0'
-  
-};

package/src/HDS/components/Buttons/index.js

@@ -1,2 +0,0 @@
-export {default as HDSButton} from './button';
-export { default as HDSButtonVariants } from './specialBtn';

package/src/HDS/components/Buttons/specialBtn.js

@@ -1,38 +0,0 @@
-import React from "react";
-import { HDSColor } from "../../foundation/ColorPalette";
-import { Typography } from "../../foundation/Typography";
-import { Icon } from "../common-components";
-
-export default function ButtonVariants(props) {
-    const {
-        variant,
-        label,
-        labelColor,
-        iconVariant,
-        iconStrokeClass,
-        onClick
-    } = props;
-    const addToCalendar = () => (
-        <div>
-            <button
-                onClick={onClick}
-                className=" border-2 border-blue-500 rounded-full hover:bg-blue-500 group">
-                <div className="flex py-2 pl-[18px] pr-3 items-center">
-                    <Typography textStyle='body3-medium' className={HDSColor(labelColor) + ' group-hover:text-neutral-0'}>
-                        {label}
-                    </Typography>
-                    <Icon variant={iconVariant} strokeClass={HDSColor(iconStrokeClass)} className='h-5 w-5 stroke-2 group-hover:stroke-neutral-0' />
-                </div>
-            </button>
-        </div>
-    )
-    return (
-        <>
-            {variant && variant === 'calendarButton' && 
-            <>
-                {addToCalendar()}
-            </>
-        }
-        </>
-    )
-}

package/src/HDS/components/Cards/Announcement/announcementMd.js

@@ -1,88 +0,0 @@
-import React, { useState, useEffect } from "react";
-import { Typography } from "../../../foundation/Typography";
-import { HDSColor } from "../../../foundation/ColorPalette";
-import { Icon } from '../../../components/common-components/Icon';
-
-const tagColorVariants = {
-  blue: 'bg-neutral-0 tb:bg-blue-500 text-blue-500 tb:text-neutral-0',
-  purple: 'bg-neutral-0 tb:bg-purple-500 text-purple-500 tb:text-neutral-0',
-  pink: 'bg-neutral-0 tb:bg-pink-500 text-pink-500 tb:text-neutral-0',
-  amber: 'bg-neutral-0 tb:bg-amber-500 text-amber-500 tb:text-neutral-0',
-  cyan: 'bg-neutral-0 tb:bg-cyan-500 text-cyan-500 tb:text-neutral-0',
-  green: 'bg-neutral-0 tb:bg-green-500 text-green-500 tb:text-neutral-0',
-}
-
-const isBrowser = typeof window !== "undefined";
-
-export default function AnnouncementMd(props) {
-  const [isBannerActive, toggleBanner] = useState(true);
-  const bgClass = props.bgColorClass ? HDSColor(props.bgColorClass) : 'bg-neutral-0';
-  const linkTextClass = props.linkTextColorClass ? HDSColor(props.linkTextColorClass) : 'text-neutral-600';
-  const tagClass = props.tagColor ? props.tagColor : 'purple';
-  const iconBgClass = props.iconBgColor ? HDSColor(props.iconBgColor) : 'bg-blue-200'
-
-  const [isConsentForm, setIsConsentForm] = useState(false);
-  const onCloseBanner = () => {
-    toggleBanner(false);
-    if (isBrowser) {
-      window.sessionStorage.setItem("announcementConsent", "true");
-    }
-  };
-
-  useEffect(() => {
-    if (isBrowser) {
-      if (
-        "sessionStorage" in window &&
-        window.sessionStorage &&
-        "getItem" in window.sessionStorage
-      ) {
-        const localSessionStorage = window.sessionStorage.getItem(
-          "announcementConsent"
-        );
-        if (localSessionStorage) {
-          setIsConsentForm(true);
-        }
-      }
-    }
-  }, []);
-
-  if (isBannerActive && !isConsentForm) {
-    return (
-      <div className="py-6">
-        <div className={`${bgClass} flex justify-between relative rounded-2xl tb:rounded-full shadow p-4 tb:justify-center tb:items-center`}>
-          <div className="tb:items-center flex tb:justify-center">
-            {
-              props.brandImg && (
-                <div className="tb:pb-0 tb:pl-14 pr-2">
-                  <img className="mt-[2px] tb:mt-0 min-h-[20px] min-w-[20px] max-w-[20px] max-h-[20px] tb:min-h-[32px] tb:min-w-[32px] tb:max-w-[32px] tb:max-h-[32px]" src={props.brandImg} alt={props.brandImgAlt} />
-                </div>
-              )
-            }
-            {
-              props.iconBgColor && (
-                <div className={`${iconBgClass} mt-[2px] tb:mt-0 ml-0 mb-1 tb:mb-0 tb:ml-14 mr-2 w-5 h-5 tb:w-8 tb:h-8 min-w-[20px] tb:min-w-[32px] rounded-full flex items-center justify-center`}>
-                  <Icon height={'block w-4 h-4 tb:w-5 tb:h-5 stroke-[2px] transition ease-in-out'} variant={props.iconVariant} strokeClass='stroke-neutral-1000' />
-                </div>
-              )
-            }
-            {
-              props.tagText && (
-                <Typography textStyle="body2-medium" className={`inline-flex py-1 px-0 tb:px-3 ml-0 tb:ml-14 tb-m:ml-6 rounded-full mr-4 min-w-fit ${tagColorVariants[tagClass]}`}>{props.tagText}</Typography>
-              )
-            }
-            <a href={props.linkUrl} className="block pb-0">
-              <Typography textStyle="body2-medium" className={`${linkTextClass} group flex items-center [&>div]:inline-block`}>
-                {props.linkText}
-                <Icon height={' hds-hidden tb:block w-6 h-6 stroke-[2px] ml-3 transition ease-in-out group-hover:translate-x-[5px]'} variant='arrownarrowright' strokeClass='stroke-blue-500' />
-              </Typography>
-            </a>
-          </div>
-          <div className="static mt-[2px] tb:mt-0 ml-3 tb:ml-0 tb:absolute top-1/2 tb:-translate-y-1/2 tb:left-6 cursor-pointer w-5 h-5 min-w-[20px] tb:w-8 tb:min-w-[32px] tb:h-8 rounded-full bg-neutral-100 flex items-center justify-center" onClick={()=>onCloseBanner()}>
-            <Icon height={'block w-4 h-4 tb:w-6 tb:h-6 stroke-[2px] transition ease-in-out'} variant='xclose' strokeClass='stroke-neutral-800' />
-          </div>
-        </div>
-      </div>
-    )
-  }
-  return null;
-}

package/src/HDS/components/Cards/Announcement/announcementSm.js

@@ -1,41 +0,0 @@
-import React from "react";
-import { Typography } from "../../../foundation/Typography";
-import { HDSColor } from "../../../foundation/ColorPalette";
-import { Icon } from '../../../components/common-components/Icon';
-
-const tagColorVariants = {
-  blue: 'bg-neutral-0 tb:bg-blue-500 text-blue-500 tb:text-neutral-0',
-  purple: 'bg-neutral-0 tb:bg-purple-500 text-purple-500 tb:text-neutral-0',
-  pink: 'bg-neutral-0 tb:bg-pink-500 text-pink-500 tb:text-neutral-0',
-  amber: 'bg-neutral-0 tb:bg-amber-500 text-amber-500 tb:text-neutral-0',
-  cyan: 'bg-neutral-0 tb:bg-cyan-500 text-cyan-500 tb:text-neutral-0',
-  green: 'bg-neutral-0 tb:bg-green-500 text-green-500 tb:text-neutral-0',
-}
-
-export default function AnnouncementSM(props) {
-  const bgClass = props.bgColorClass ? HDSColor(props.bgColorClass) : 'bg-neutral-0';
-  const linkTextClass = props.linkTextColorClass ? HDSColor(props.linkTextColorClass) : 'text-neutral-600';
-  return (
-    <div className={`${bgClass} rounded-2xl tb:rounded-full shadow p-3 tb:py-2 tb:px-2 inline-flex items-center`}>
-      <div className="block items-center tb:flex">
-        {props.tagText && <Typography
-          textStyle="body2-medium"
-          className={`inline-flex pl-0 tb:py-1 tb:px-3 rounded-full mr-4 min-w-fit ${tagColorVariants[props.tagColor]}`}>
-          {props.tagText}
-        </Typography>}
-        <a href={props.linkUrl}
-          className="pl-0 px-3 block tb:px-0 tb:pb-0">
-          <Typography
-            textStyle="body2-medium"
-            className={`${linkTextClass} group flex items-center`}>
-            {props.linkText}
-            <Icon
-              height={'block w-6 h-6 stroke-2 ml-2 mr-1 transition ease-in-out group-hover:translate-x-[5px]'}
-              variant='arrownarrowright'
-              strokeClass='stroke-blue-500' />
-          </Typography>
-        </a>
-      </div>
-    </div>
-  )
-}

package/src/HDS/components/Cards/Announcement/index.js

@@ -1,2 +0,0 @@
-export {default as AnnouncementSM} from './announcementSm';
-export {default as AnnouncementMd} from './announcementMd';

package/src/HDS/components/Cards/BrandCard/brandCard.js

@@ -1,62 +0,0 @@
-import React from "react";
-import { Icon } from "../../common-components/Icon";
-import { HDSColor } from '../../../foundation/ColorPalette';
-import { Typography } from '../../../foundation/Typography';
-import PropTypes from 'prop-types';
-
-
-export default function BrandCard(props) {
-    return (
-        <>
-            {false ?
-                (<div>
-                    <div className="pt-10 db:pt-20">
-                        <Typography textStyle="h6" as="h6" className="pb-6 db:pb-10 text-center text-neutral-400 uppercase">40+ of the fortune100 companies use hasura</Typography>
-                        <div className="  grid grid-cols-2 tb:grid-cols-4 db:grid-cols-4 db:gap-x-8 db:gap-y-2"
-                        >
-                            {
-                                props.imgArray.map((brand, index) => (
-                                    <div key={index}>
-                                        <img src={brand.imgSrc} alt={brand.imgAlt} />
-                                    </div>
-                                ))
-                            }
-                        </div>
-                    </div>
-                </div>
-                )
-                :
-                (
-                    <>
-                        <div className="pt-10 db:pt-20">
-                            <Typography textStyle="h6" as="h6" className="pb-6 db:pb-10 text-center text-neutral-400 uppercase">40+ of the fortune100 companies use hasura</Typography>
-                            <div className="gridAutoClass"
-                            >
-                                {props.imgArray.map((brand, index) => (
-                                    <div key={index} className='border'>
-                                        <img src={brand.imgSrc} alt={brand.imgAlt} />
-                                    </div>
-                                ))
-                                    
-                                }
-                            </div>
-                        </div>
-                    </>
-                )
-
-
-            }
-        </>
-    )
-}
-
-BrandCard.defaultProps = {
-    rotate: 'false',
-    imgArray: [
-        { imgSrc: 'https://res.cloudinary.com/dh8fp23nd/image/upload/v1682487186/hasura-con-2023/costco_eb2lmu.png', imgAlt: '' },
-        { imgSrc: 'https://res.cloudinary.com/dh8fp23nd/image/upload/v1682487186/hasura-con-2023/verizon_sj4rgc.png', imgAlt: '' },
-        { imgSrc: 'https://res.cloudinary.com/dh8fp23nd/image/upload/v1682487186/hasura-con-2023/costco_eb2lmu.png', imgAlt: '' },
-        { imgSrc: 'https://res.cloudinary.com/dh8fp23nd/image/upload/v1682487186/hasura-con-2023/costco_eb2lmu.png', imgAlt: '' },
-        
-    ]
-}

package/src/HDS/components/Cards/BrandCard/index.js

@@ -1 +0,0 @@
-export {default as BrandCard} from './brandCard';

package/src/HDS/components/Cards/CommunityCard/communityCard.js

@@ -1,22 +0,0 @@
-import React from "react";
-import { Typography } from '../../../foundation/Typography'
-
-const Twitter = () => (
-  <svg width="26" height="32" viewBox="0 0 26 32" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M8.67602 24.7482C16.8006 24.7482 21.2437 18.0172 21.2437 12.1806C21.2437 11.9893 21.2398 11.7991 21.2309 11.6096C22.0934 10.9861 22.8431 10.208 23.4345 9.32253C22.6431 9.67415 21.7914 9.91094 20.8979 10.0177C21.8098 9.47092 22.5101 8.60557 22.8404 7.5742C21.9868 8.08033 21.0417 8.44812 20.0358 8.64646C19.2294 7.78796 18.0815 7.25098 16.8114 7.25098C14.3718 7.25098 12.3935 9.22924 12.3935 11.6676C12.3935 12.0143 12.4325 12.3513 12.5079 12.6747C8.83714 12.4903 5.58191 10.7325 3.4036 8.06001C3.02381 8.71257 2.80515 9.47116 2.80515 10.2799C2.80515 11.8123 3.58504 13.1652 4.77092 13.9568C4.04637 13.9345 3.36564 13.7352 2.77038 13.4042C2.7694 13.4225 2.7694 13.4411 2.7694 13.4605C2.7694 15.5999 4.29221 17.3859 6.31308 17.7907C5.94211 17.8918 5.55179 17.9462 5.14875 17.9462C4.86421 17.9462 4.58752 17.9178 4.31841 17.8666C4.88062 19.6213 6.51142 20.8985 8.44486 20.9345C6.93283 22.1194 5.02827 22.8253 2.95892 22.8253C2.60265 22.8253 2.25102 22.805 1.90527 22.7641C3.86002 24.0168 6.18109 24.7482 8.67602 24.7482Z" fill="#00acee" />
-  </svg>
-)
-
-export default function CommunityCard(props) {
-    
-  return (
-    <a href={props.linkUrl}>
-      <div className="p-5 tb:p-8 bg-neutral-0 shadow-sm rounded-3xl mx-5">
-        <Twitter />
-        <Typography textStyle="h5" as="h5" className="text-neutral-1000 py-4">{props.name}</Typography>
-        <Typography textStyle="body1" className="text-neutral-500">{props.tweets}</Typography>
-      </div>
-    </a>
-  )
-
-}

package/src/HDS/components/Cards/CommunityCard/index.js

@@ -1 +0,0 @@
-export {default as CommunityCard} from './communityCard';

package/src/HDS/components/Cards/ConnectorCard/connectorCard.js

@@ -1,70 +0,0 @@
-import React from "react";
-import { Typography } from "../../../foundation/Typography";
-import { Icon } from "../../common-components";
-export default function ConnectorCard(props) {
-    return (
-        <>
-            {
-                props.linkUrl &&
-                (
-                    <a 
-                    href={props.linkUrl} 
-                    className=" flex flex-col gap-10 justify-between h-full">
-                        <div className="flex justify-between">
-                            {/* {props.imgUrl &&
-                                <div className="w-10 h-10 rounded-full border border-neutral-300 ">
-                                    <img
-                                        alt={props.title ?? 'connectorImage'}
-                                        src={props.imgUrl}
-                                        className="rounded-full w-full " />
-
-                                </div>} */}
-                            {props.imgUrl && <div className="flex">
-                                <img alt={props.title ?? 'connectorImage'} src={props.imgUrl} className=" max-h-[25px] object-contain " />
-                            </div>}
-                            {props.checkIcon && <div className="ml-2">
-                                <Icon
-                                    height={'h-6 w-6 stroke-[1.5px]'}
-                                    variant={props.checkIcon}
-                                    strokeClass='stroke-blue-600'
-                                />
-                            </div>}
-                        </div>
-                        <div>
-                            {props.title &&
-                                <Typography
-                                    textStyle='body2-bold'
-                                    className='text-neutral-1000'
-                                >
-                                    {props.title}
-                                </Typography>}
-                            {props.description &&
-                                <Typography
-                                    textStyle='body3'
-                                    className='pt-2 text-neutral-600'
-                                >
-                                    {props.description}
-                                </Typography>}
-                            <div
-                                className="flex flex-row items-center gap-2 pt-3"
-                            >
-                                {props.iconVariant && <Icon
-                                    height={'h-5 w-5 stroke-[1.5px]'}
-                                    variant={props.iconVariant}
-                                    strokeClass='stroke-neutral-600'
-                                />}
-                                {props.iconTag &&
-                                    <Typography
-                                        textStyle='body2-bold'
-                                        className='text-neutral-1000'
-                                    >
-                                        {props.iconTag}
-                                    </Typography>}
-                            </div>
-                        </div>
-                    </a>
-                )
-            }
-        </>
-    )
-}

package/src/HDS/components/Cards/ConnectorCard/index.js

@@ -1 +0,0 @@
-export { default as ConnectorCard } from './connectorCard';

package/src/HDS/components/Cards/Dropdown/index.js

@@ -1 +0,0 @@
-export {default as V3Dropdown} from './v3Dropdown';