hds-web 1.2.2 → 1.2.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hds-web",
-  "version": "1.2.2",
+  "version": "1.2.4",
   "private": false,
   "main": "dist/index.js",
   "module": "dist/index.es.js",

package/src/HDS/assets/icons/hasura-1.svg

@@ -1,3 +1,3 @@
-<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M5.04272 3.01211C6.48206 2.0875 8.19783 1.54417 10.0375 1.54417H10.2472C12.0869 1.54417 13.8027 2.07797 15.242 3.01211C15.69 3.29807 16.281 3.20275 16.6051 2.79287L17.7871 0.953183C17.8824 0.819734 18.0254 0.724414 18.1874 0.714882C18.3495 0.70535 18.5115 0.772074 18.6068 0.905523C19.56 2.2972 19.8269 5.45231 19.3027 7.07276C19.112 7.64469 19.0644 8.2452 19.1692 8.82666C19.2836 9.40812 19.3885 10.104 19.3885 10.5901C19.3885 15.5944 15.2992 19.6455 10.2472 19.6455H10.0375C4.98552 19.6455 0.896274 15.5944 0.896274 10.5901C0.896274 10.104 1.01066 9.40812 1.11551 8.82666C1.22036 8.2452 1.16317 7.64469 0.982062 7.07276C0.457799 5.45231 0.734229 2.2972 1.6779 0.905523C1.76369 0.762542 1.93527 0.70535 2.09731 0.714882C2.25936 0.733946 2.41187 0.819734 2.49766 0.953183L3.67963 2.79287C4.01326 3.20275 4.59471 3.29807 5.04272 3.01211ZM11.108 14.2727V7H9.28977L7.5 8.09375V9.76989L9.09091 8.81818H9.13352V14.2727H11.108Z" fill="#80A3FF"/>
 </svg>

package/src/HDS/assets/icons/hasura-2.svg

@@ -1,3 +1,3 @@
-<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M5.04272 3.01211C6.48206 2.0875 8.19783 1.54417 10.0375 1.54417H10.2472C12.0869 1.54417 13.8027 2.07797 15.242 3.01211C15.69 3.29807 16.281 3.20275 16.6051 2.79287L17.7871 0.953183C17.8824 0.819734 18.0254 0.724414 18.1874 0.714882C18.3495 0.70535 18.5115 0.772074 18.6068 0.905523C19.56 2.2972 19.8269 5.45231 19.3027 7.07276C19.112 7.64469 19.0644 8.2452 19.1692 8.82666C19.2836 9.40812 19.3885 10.104 19.3885 10.5901C19.3885 15.5944 15.2992 19.6455 10.2472 19.6455H10.0375C4.98552 19.6455 0.896274 15.5944 0.896274 10.5901C0.896274 10.104 1.01066 9.40812 1.11551 8.82666C1.22036 8.2452 1.16317 7.64469 0.982062 7.07276C0.457799 5.45231 0.734229 2.2972 1.6779 0.905523C1.76369 0.762542 1.93527 0.70535 2.09731 0.714882C2.25936 0.733946 2.41187 0.819734 2.49766 0.953183L3.67963 2.79287C4.01326 3.20275 4.59471 3.29807 5.04272 3.01211ZM7.14205 12.9517V14.3722H12.7244V12.7955H9.88352V12.7528L10.5653 12.1847C11.1193 11.723 11.5466 11.3253 11.8473 10.9915C12.148 10.6577 12.3563 10.3535 12.4723 10.0788C12.5883 9.80185 12.6463 9.52367 12.6463 9.24432C12.6463 8.79214 12.5291 8.39796 12.2947 8.06179C12.0627 7.72562 11.7325 7.4652 11.304 7.28054C10.8778 7.09351 10.3736 7 9.79119 7C9.22775 7 8.73651 7.09943 8.31747 7.2983C7.89844 7.49716 7.5741 7.78125 7.34446 8.15057C7.11482 8.51989 7 8.96023 7 9.47159H8.875C8.875 9.26799 8.91288 9.09517 8.98864 8.95312C9.06439 8.81108 9.17093 8.70336 9.30824 8.62997C9.44792 8.55658 9.6089 8.51989 9.79119 8.51989C9.97348 8.51989 10.1345 8.55658 10.2741 8.62997C10.4138 8.70099 10.5227 8.80279 10.6009 8.93537C10.6813 9.06794 10.7216 9.22775 10.7216 9.41477C10.7216 9.58523 10.6861 9.74029 10.6151 9.87997C10.5464 10.0196 10.447 10.1558 10.3168 10.2884C10.1889 10.4186 10.035 10.5582 9.85511 10.7074L7.14205 12.9517Z" fill="#80A3FF"/>
 </svg>

package/src/HDS/assets/icons/hasura-3.svg

@@ -1,3 +1,3 @@
-<svg width="21" height="21" viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg viewBox="0 0 21 21" fill="none" xmlns="http://www.w3.org/2000/svg">
 <path fill-rule="evenodd" clip-rule="evenodd" d="M5.04272 3.01211C6.48206 2.0875 8.19783 1.54417 10.0375 1.54417H10.2472C12.0869 1.54417 13.8027 2.07797 15.242 3.01211C15.69 3.29807 16.281 3.20275 16.6051 2.79287L17.7871 0.953183C17.8824 0.819734 18.0254 0.724414 18.1874 0.714882C18.3495 0.70535 18.5115 0.772074 18.6068 0.905523C19.56 2.2972 19.8269 5.45231 19.3027 7.07276C19.112 7.64469 19.0644 8.2452 19.1692 8.82666C19.2836 9.40812 19.3885 10.104 19.3885 10.5901C19.3885 15.5944 15.2992 19.6455 10.2472 19.6455H10.0375C4.98552 19.6455 0.896274 15.5944 0.896274 10.5901C0.896274 10.104 1.01066 9.40812 1.11551 8.82666C1.22036 8.2452 1.16317 7.64469 0.982062 7.07276C0.457799 5.45231 0.734229 2.2972 1.6779 0.905523C1.76369 0.762542 1.93527 0.70535 2.09731 0.714882C2.25936 0.733946 2.41187 0.819734 2.49766 0.953183L3.67963 2.79287C4.01326 3.20275 4.59471 3.29807 5.04272 3.01211ZM8.42756 14.1768C8.87263 14.3733 9.38163 14.4716 9.95455 14.4716C10.5488 14.4716 11.0732 14.3781 11.5277 14.1911C11.9846 14.004 12.3409 13.746 12.5966 13.4169C12.8546 13.0878 12.9825 12.7102 12.9801 12.2841C12.9848 11.839 12.8393 11.4697 12.5433 11.1761C12.2474 10.8802 11.8059 10.7003 11.2188 10.6364V10.5795C11.652 10.5322 12.0095 10.3783 12.2912 10.1179C12.5753 9.85748 12.715 9.52367 12.7102 9.11648C12.7126 8.70691 12.5966 8.34351 12.3622 8.02628C12.1302 7.70668 11.8071 7.45573 11.3928 7.27344C10.9808 7.09115 10.5062 7 9.96875 7C9.41951 7 8.933 7.09706 8.50923 7.29119C8.08546 7.48532 7.75166 7.75284 7.50781 8.09375C7.26634 8.43466 7.14441 8.82765 7.14205 9.27273H9.03125C9.03362 9.12595 9.07505 8.99574 9.15554 8.8821C9.23603 8.76847 9.34612 8.67969 9.4858 8.61577C9.62784 8.55185 9.78883 8.51989 9.96875 8.51989C10.1345 8.51989 10.2801 8.55066 10.4055 8.61222C10.5334 8.67377 10.6328 8.759 10.7038 8.8679C10.7749 8.9768 10.8092 9.10227 10.8068 9.24432C10.8092 9.3911 10.7678 9.52131 10.6825 9.63494C10.5997 9.74858 10.4825 9.83736 10.331 9.90128C10.1818 9.9652 10.009 9.99716 9.8125 9.99716H9.07386V11.3608H9.8125C10.0256 11.3608 10.2138 11.3928 10.3771 11.4567C10.5405 11.5206 10.6671 11.6094 10.7571 11.723C10.8494 11.8366 10.8944 11.9669 10.892 12.1136C10.8944 12.2628 10.8565 12.3954 10.7784 12.5114C10.7003 12.6274 10.5914 12.7185 10.4517 12.7848C10.312 12.8487 10.151 12.8807 9.96875 12.8807C9.77936 12.8807 9.61127 12.8499 9.46449 12.7884C9.31771 12.7268 9.2017 12.6416 9.11648 12.5327C9.03362 12.4214 8.991 12.2959 8.98864 12.1562H7C7.00237 12.6084 7.13021 13.0085 7.38352 13.3565C7.63684 13.7045 7.98485 13.978 8.42756 14.1768Z" fill="#80A3FF"/>
 </svg>

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

@@ -63,7 +63,7 @@ const Buttonclasses = {
   'secondaryLink': {
     'default': {
       'base': 'db:w-fit tb:w-fit w-full  justify-center ',
-      'hover': 'hover:text-neutral-900 ',
+      'hover': '',
       'focus': 'focus:text-neutral-900 focus:outline-none focus:shadow-[0px_0px_0px_4px_#E5E7EB]',
     },
     'disabled': 'text-neutral-300',

package/src/HDS/components/Cards/Feedback/feedback.js

@@ -8,7 +8,7 @@ export default function FeedbackCard(props) {
   return (
     <div className='bg-neutral-0 rounded-3xl shadow p-6 tb-l:p-10'>
       <div className='pb-8'>
-        <img src={props.brandImgUrl} alt={props.brandImgAlt} />
+        <img src={props.brandImgUrl} alt={props.brandImgAlt} className=' h-8 '/>
       </div>
       <div className="pb-10">
         <Typography textStyle="quote" className='text-neutral-1000'>{props.description}</Typography>

package/src/HDS/components/Tables/tableB.js

@@ -13,6 +13,7 @@ const tabs = [
 ]
 
 
+
 const levelCalc = (arr, index) => {
 
     const keyIndex = 'key' + `${index}`;

package/src/HDS/components/Tables/tableC.js

@@ -9,9 +9,7 @@ export default function TableA(props) {
         children
 
     } = props;
-    console.log(tableValue.length);
-    const tableLength = tableValue.length;
-    
+    const firstObjectLength = Object.keys(tableValue[0]).length;
     return (
         <div className=" ">
             <div className="sm:flex sm:items-center ">
@@ -19,51 +17,50 @@ export default function TableA(props) {
                     <h1 className="text-base font-semibold leading-6 text-gray-900">{head}</h1>
                     <p className="mt-2 text-sm text-gray-700">{description}</p>
                 </div>
-                
-            </div>
 
+            </div>
             <div>
-                <div className="border bg-neutral-50 border-neutral-100 rounded-2xl">
+                <div className="border border-neutral-100 rounded-2xl">
                     <table className="min-w-full divide-y divide-neutral-100 ">
-                       <div>
-
-
                         <thead>
                             <tr className='divide-x divide-neutral-100'>
-                                {Object.keys(tableValue[0]).map((key) => (
+                                {Object.keys(tableValue[0]).map((key, index) => (
                                     <th
                                         key={key}
                                         scope="col"
-                                        className="text-left sm:table-cell"
+                                        className={(index === 0) ? 'rounded-tl-2xl text-left sm:table-cell bg-neutral-50' : 'text-left sm:table-cell bg-neutral-50 rounded-tr-2xl'}
                                     >
                                         <Typography className='p-6' textStyle='body3c-bold'>{key}</Typography>
-                                        
+
                                     </th>
                                 ))}
+
                             </tr>
                         </thead>
-                      
-                        <tbody className="divide-y rounded-b-3xl divide-neutral-100 bg-white">
-                            {tableValue.map((value,index) => (
-                                <tr key={index} className='divide-x divide-neutral-100'>
+                        <tbody className="divide-y rounded-b-3xl divide-neutral-100 ">
+                            {tableValue.slice(1).map((value, index) => (
+                                <tr key={index} className='divide-x divide-neutral-100 '>
                                     {Object.keys(value).map((key, index2) => (
+
+
+
                                         <td
-                                             key={index2+index}
+                                            key={index2 + index}
                                             className={
-                                                'p-6 bg-neutral-0 ' + ((index == `${tableValue.length-1}`) ? 'rounded-3xl' : '')
+                                                'p-6 ' + ((index == `${tableValue.length - 2}`) ? 'rounded-3xl' : '')
                                             }
                                         >
-                                            
-                                            <Typography textStyle='body3c-bold' className='bg-transparent text-neutral-800'>{key}</Typography>
-                                            <Typography textStyle='body3' className='text-neutral-800 mt-2'>Endless hours spent writing boilerplate code, resolvers, or mapping logic.</Typography>
+
+                                            <Typography textStyle='body3c-bold' className='bg-transparent text-neutral-800'>{key.toString()}</Typography>
+                                            <Typography textStyle='body3' className='text-neutral-800 mt-2'>{value[key].toString()}</Typography>
 
                                         </td>
+
                                     ))}
                                 </tr>
                             ))}
                         </tbody>
-                        </div>
-                        </table>
+                    </table>
                 </div>
             </div>
         </div>

package/src/HDS/helpers/Media/mediabox.js

@@ -1,7 +1,7 @@
 import React, { useState } from 'react';
 import { Icon } from '../../components/common-components/Icon';
 
-const MediaViewer = ({ img_url, video_url, video_poster, width }) => {
+export default function MediaViewer ({ img_url, video_url, video_poster, width }){
   const [isVideoPlaying, setIsVideoPlaying] = useState(false);
 
   const handleVideoClick = () => {
@@ -16,7 +16,7 @@ const MediaViewer = ({ img_url, video_url, video_poster, width }) => {
     <div>
       {img_url && (
         <div className='flex justify-center'>
-        <img src={img_url} alt="Image" style={{ width }} onClick={handleVideoClick} />
+        <img src={img_url} alt="Image" className='rounded-2xl' onClick={handleVideoClick} />
         </div>
       )}
 
@@ -40,9 +40,8 @@ const MediaViewer = ({ img_url, video_url, video_poster, width }) => {
               <img
                 src={video_poster}
                 alt="Video Poster"
-                style={{ width }}
                 onClick={handleVideoClick}
-                className="cursor-pointer"
+                className="cursor-pointer rounded-2xl"
               />
               </div>
             </div>
@@ -73,4 +72,4 @@ const MediaViewer = ({ img_url, video_url, video_poster, width }) => {
   );
 };
 
-export default MediaViewer;
+

package/src/HDS/helpers/index.js

@@ -1 +1,2 @@
-export * from './Translations';
+export * from './Translations';
+export * from './Media';

package/src/HDS/modules/navCard/navCard.js

@@ -23,7 +23,7 @@ const tabCard = (tabContent) => (
                 size='sm'
                 rightAnimatedArrow={true}
                 rightAnimatedArrowColor='#1E56E3'
-                animatedHoverStroke='group-hover:stroke-neutral-900'
+                animatedHoverStroke='group-hover:stroke-blue-600'
                 className='flex'
                 btnTextColorClass='text-blue-600'
             />

package/src/styles/tailwind.css

@@ -2136,6 +2136,19 @@ select {
   border-top-right-radius: 0.375rem;
 }
 
+.rounded-t-lg {
+  border-top-left-radius: 0.5rem;
+  border-top-right-radius: 0.5rem;
+}
+
+.rounded-tl-2xl {
+  border-top-left-radius: 1rem;
+}
+
+.rounded-tr-2xl {
+  border-top-right-radius: 1rem;
+}
+
 .border {
   border-width: 1px;
 }
@@ -7374,15 +7387,38 @@ select {
   margin-left: 0px;
 }
 
+.first\:rounded-full:first-child {
+  border-radius: 9999px;
+}
+
+.first\:rounded-t-lg:first-child {
+  border-top-left-radius: 0.5rem;
+  border-top-right-radius: 0.5rem;
+}
+
 .first\:bg-blue-500:first-child {
   --tw-bg-opacity: 1;
   background-color: rgb(57 112 253 / var(--tw-bg-opacity));
 }
 
+.first\:bg-green-400:first-child {
+  --tw-bg-opacity: 1;
+  background-color: rgb(57 218 170 / var(--tw-bg-opacity));
+}
+
 .last\:mr-0:last-child {
   margin-right: 0px;
 }
 
+.last\:rounded-full:last-child {
+  border-radius: 9999px;
+}
+
+.last\:rounded-b-2xl:last-child {
+  border-bottom-right-radius: 1rem;
+  border-bottom-left-radius: 1rem;
+}
+
 .last\:border-b-0:last-child {
   border-bottom-width: 0px;
 }
@@ -7569,11 +7605,6 @@ select {
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
-.hover\:text-neutral-900:hover {
-  --tw-text-opacity: 1;
-  color: rgb(17 25 39 / var(--tw-text-opacity));
-}
-
 .hover\:shadow:hover {
   --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
   --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);
@@ -7937,6 +7968,10 @@ select {
   stroke: #111927;
 }
 
+.group:hover .group-hover\:stroke-blue-600 {
+  stroke: #1E56E3;
+}
+
 .group:hover .group-hover\:opacity-30 {
   opacity: 0.3;
 }