hds-web 1.16.7 → 1.16.8

package/package.json

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

package/src/HDS/assets/icons/queries.svg

@@ -1,3 +1,3 @@
 <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M9.08997 9.00007C9.32507 8.33174 9.78912 7.76818 10.3999 7.40921C11.0107 7.05023 11.7289 6.91901 12.4271 7.03879C13.1254 7.15856 13.7588 7.5216 14.215 8.0636C14.6713 8.60561 14.921 9.2916 14.92 10.0001C14.92 12.0001 11.92 13.0001 11.92 13.0001M12 17.0001H12.01M3 7.94153V16.0586C3 16.4013 3 16.5726 3.05048 16.7254C3.09515 16.8606 3.16816 16.9847 3.26463 17.0893C3.37369 17.2077 3.52345 17.2909 3.82297 17.4573L11.223 21.5684C11.5066 21.726 11.6484 21.8047 11.7985 21.8356C11.9315 21.863 12.0685 21.863 12.2015 21.8356C12.3516 21.8047 12.4934 21.726 12.777 21.5684L20.177 17.4573C20.4766 17.2909 20.6263 17.2077 20.7354 17.0893C20.8318 16.9847 20.9049 16.8606 20.9495 16.7254C21 16.5726 21 16.4013 21 16.0586V7.94153C21 7.59889 21 7.42756 20.9495 7.27477C20.9049 7.13959 20.8318 7.01551 20.7354 6.91082C20.6263 6.79248 20.4766 6.70928 20.177 6.54288L12.777 2.43177C12.4934 2.27421 12.3516 2.19543 12.2015 2.16454C12.0685 2.13721 11.9315 2.13721 11.7985 2.16454C11.6484 2.19543 11.5066 2.27421 11.223 2.43177L3.82297 6.54288C3.52345 6.70928 3.37369 6.79248 3.26463 6.91082C3.16816 7.01551 3.09515 7.13959 3.05048 7.27477C3 7.42756 3 7.59889 3 7.94153Z" stroke="#1F2A37" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M9.08997 8.99959C9.32507 8.33125 9.78912 7.76769 10.3999 7.40872C11.0107 7.04974 11.7289 6.91852 12.4271 7.0383C13.1254 7.15807 13.7588 7.52111 14.215 8.06311C14.6713 8.60512 14.921 9.29111 14.92 9.99959C14.92 11.9996 11.92 12.9996 11.92 12.9996M12 16.9996H12.01M3 7.94104V16.0582C3 16.4008 3 16.5721 3.05048 16.7249C3.09515 16.8601 3.16816 16.9842 3.26463 17.0889C3.37369 17.2072 3.52345 17.2904 3.82297 17.4568L11.223 21.5679C11.5066 21.7255 11.6484 21.8042 11.7985 21.8351C11.9315 21.8625 12.0685 21.8625 12.2015 21.8351C12.3516 21.8042 12.4934 21.7255 12.777 21.5679L20.177 17.4568C20.4766 17.2904 20.6263 17.2072 20.7354 17.0889C20.8318 16.9842 20.9049 16.8601 20.9495 16.7249C21 16.5721 21 16.4008 21 16.0582V7.94104C21 7.5984 21 7.42708 20.9495 7.27428C20.9049 7.1391 20.8318 7.01502 20.7354 6.91033C20.6263 6.79199 20.4766 6.70879 20.177 6.54239L12.777 2.43128C12.4934 2.27372 12.3516 2.19494 12.2015 2.16406C12.0685 2.13672 11.9315 2.13672 11.7985 2.16406C11.6484 2.19494 11.5066 2.27372 11.223 2.43128L3.82297 6.54239C3.52345 6.70879 3.37369 6.79199 3.26463 6.91033C3.16816 7.01502 3.09515 7.1391 3.05048 7.27428C3 7.42708 3 7.5984 3 7.94104Z"   stroke-linecap="round" stroke-linejoin="round"/>
 </svg>

package/src/HDS/assets/icons/x-close.svg

@@ -1,3 +1,3 @@
 <svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
-<path d="M18 6L6 18M6 6L18 18"  stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M18 6L6 18M6 6L18 18"  stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
 </svg>

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

@@ -8,7 +8,7 @@ export default function DropdownA(props) {
   return (
     <div>
 
-      <div className='tb-l:flex mb-2 tb-l:mb-0 flex w-full tb-l:bg-neutral-150 flex-col tb-l:flex-row max-w-7xl tb-l:gap-2 rounded-2xl '>
+      <div className='tb-l:flex mb-2 tb-l:mb-0 flex w-full gap-2 tb:bg-neutral-150 flex-col tb-l:flex-row max-w-7xl rounded-2xl '>
 
         {props.primaryCard &&
           <div className="">
@@ -20,7 +20,7 @@ export default function DropdownA(props) {
 
           </div>
         }
-        <div className="tb-l:flex-row tb-l:flex mt-2 flex flex-col gap-2 tb-l:mt-0">
+        <div className="tb-l:flex-row tb-l:flex mt-2 flex flex-col gap-2 tb:mt-0">
           {props.secondaryCardArr && props.secondaryCardArr.map((item, index) => (
 
             <div key={index} className={'rounded-2xl ' + (item.card_bg) ? 'bg-neutral-0 rounded-2xl' : (HDSColor(item.card_bg))}>

package/src/HDS/components/Cards/TalkDetailCard/talkDetailCard.js

@@ -1,14 +1,41 @@
-import React from "react";
+import React, { useState, useEffect} from "react";
 import PropTypes from 'prop-types';
 import { HDSColor } from '../../../foundation/ColorPalette';
+import { Icon } from "../../common-components/Icon"
 import { Badges } from '../../BadgesCaption';
 import { ProfileAvatar } from '../../Avatars'
 import { Typography } from "../../../foundation/Typography";
 import ReactMarkdown from "react-markdown";
 
 
+import { HDSPaperForm } from "../../../helpers/Paperform"
+
+
 export default function TalkDetailCard(props) {
+  const isBrowser = typeof window !== "undefined";
   const badgeLeftIconColor = HDSColor(props.badgeLeftIconColor);
+  const [isConsentForm, setIsConsentForm] = useState(false);
+  const onSubmitCB = () => {
+    if (isBrowser) {
+      window.localStorage.setItem("hasCon2023TalkVideoConsent", "true");
+    }
+  };
+  useEffect(() => {
+    if (isBrowser) {
+      if (
+        "localStorage" in window &&
+        window.localStorage &&
+        "getItem" in window.localStorage
+      ) {
+        const hasCon2023TalkVideoConsent1 = window.localStorage.getItem(
+          "hasCon2023TalkVideoConsent"
+        );
+        if (hasCon2023TalkVideoConsent1) {
+          setIsConsentForm(true);
+        }
+      }
+    }
+  }, []);
   return (
     <div className="grid grid-cols-1 tb:grid-cols-2 gap-6 db:gap-28 tb:gap-16">
       <div>
@@ -25,7 +52,7 @@ export default function TalkDetailCard(props) {
                 children={value.label}
 
               />
-              
+
             </div>
           ))
         }
@@ -54,7 +81,7 @@ export default function TalkDetailCard(props) {
           props.speaker_card && (
             <div className="border-t border-neutral-200 border-b pb-6 tb:border-0 tb:pb-0">
               <Typography textStyle='h6' as='h6' className='uppercase   text-neutral-500 pb-6 pt-6 tb:pt-14'>speakers</Typography>
-            
+
                 {
                   props.speaker_card.map((speaker, i) => (
                     <div key={i} className='pb-4 last:pb-0'>
@@ -69,12 +96,46 @@ export default function TalkDetailCard(props) {
                     </div>
                   ))
                 }
-         
+
             </div>
           )
         }
       </div>
       <div>
+        {
+          props.videoUrl && (
+            <div className="pb-6">
+              {
+                isConsentForm ? (
+                  <>
+                    <div className="relative pb-[56.2%]">
+                      <iframe
+                        loading="lazy"
+                        title={props.title}
+                        src={props.videoUrl}
+                        frameBorder="0"
+                        allowFullScreen
+                        className="absolute w-full h-full"
+                      />
+                    </div>
+                  </>
+                ) : (
+                  <>
+                    <Typography textStyle="h6" as="h6" className="text-neutral-800 uppercase flex items-center">
+                      <Icon height="w-6 h-6 mr-3 stroke-neutral-800 stroke-[1.5px]" variant="ticket01" strokeColor="#1F2A37" />
+                      {props.formTitle}
+                    </Typography>
+                      <HDSPaperForm
+                      onSubmitCB={onSubmitCB}
+                      formId={props.paperformId}
+                      styleClass="paper-form-wrapper"
+                    />
+                  </>
+                )
+              }
+            </div>
+          )
+        }
         <Typography textStyle="h4" as="h4" className="text-neutral-800 pb-4">About the Talk</Typography>
         {
           props.description && (
@@ -96,4 +157,4 @@ TalkDetailCard.defaultProps = {
   // title: 'Deploying Hasura apps the fast way with the new Vercel integration',
   // social_share: '',
   // speaker_card: '',
-};
+};