@npm_leadtech/legal-lib-components 5.68.0 → 5.69.0

package/dist/src/components/atoms/Video/Video.d.ts

@@ -1,4 +1,4 @@
 import React from 'react';
 import { type VideoProps } from './VideoProps.types';
-declare const Video: ({ videoSrcURL, videoMimeType, title, controls, autoPlay, loop, muted, track }: VideoProps) => React.JSX.Element | null;
+declare const Video: ({ videoSrcURL, videoMimeType, title, controls, autoPlay, loop, muted, track, preload, poster }: VideoProps) => React.JSX.Element | null;
 export default Video;

package/dist/src/components/atoms/Video/Video.js

@@ -1,9 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-const Video = ({ videoSrcURL, videoMimeType = 'video/webm', title = '', controls = true, autoPlay = false, loop = false, muted = false, track }) => {
+const Video = ({ videoSrcURL, videoMimeType = 'video/webm', title = '', controls = true, autoPlay = false, loop = false, muted = false, track, preload = 'auto', poster = '' }) => {
     if (!videoSrcURL)
         return null;
     return (
     // eslint-disable-next-line jsx-a11y/media-has-caption
-    _jsxs("video", { "data-testid": 'video', title: title, controls: controls, autoPlay: autoPlay, loop: loop, muted: muted, children: [_jsx("source", { src: videoSrcURL, type: videoMimeType }), track && _jsx("track", { src: track.src, kind: track.kind, srcLang: track.srclang, label: track.label }), "Your browser does not support the video tag."] }));
+    _jsxs("video", { "data-testid": 'video', title: title, controls: controls, autoPlay: autoPlay, loop: loop, muted: muted, preload: preload, poster: poster, children: [_jsx("source", { src: videoSrcURL, type: videoMimeType }), track && _jsx("track", { src: track.src, kind: track.kind, srcLang: track.srclang, label: track.label }), "Your browser does not support the video tag."] }));
 };
 export default Video;

package/dist/src/components/atoms/Video/Video.tsx

@@ -10,12 +10,23 @@ const Video = ({
   autoPlay = false,
   loop = false,
   muted = false,
-  track
+  track,
+  preload = 'auto',
+  poster = ''
 }: VideoProps): React.JSX.Element | null => {
   if (!videoSrcURL) return null
   return (
     // eslint-disable-next-line jsx-a11y/media-has-caption
-    <video data-testid='video' title={title} controls={controls} autoPlay={autoPlay} loop={loop} muted={muted}>
+    <video
+      data-testid='video'
+      title={title}
+      controls={controls}
+      autoPlay={autoPlay}
+      loop={loop}
+      muted={muted}
+      preload={preload}
+      poster={poster}
+    >
       <source src={videoSrcURL} type={videoMimeType} />
       {track && <track src={track.src} kind={track.kind} srcLang={track.srclang} label={track.label} />}
       Your browser does not support the video tag.

package/dist/src/components/atoms/Video/VideoProps.types.d.ts

@@ -14,4 +14,6 @@ export interface VideoProps {
         srclang: string;
         label: string;
     };
+    preload?: 'auto' | 'metadata' | 'none';
+    poster?: string;
 }

package/dist/src/components/atoms/Video/VideoProps.types.ts

@@ -14,4 +14,6 @@ export interface VideoProps {
     srclang: string
     label: string
   }
+  preload?: 'auto' | 'metadata' | 'none'
+  poster?: string
 }

package/dist/src/components/sections/StepsRatafiaSection/StepsRatafiaSection.js

@@ -3,11 +3,11 @@ import { StepsRatafiaContent } from '../../organisms';
 import { StepsRatafiaSectionStyled } from './StepsRatafiaSection.styled';
 import { Video } from '../../atoms';
 import classNames from 'classnames';
-const StepsRatafiaSection = ({ title, steps, videoUrl, mainImage, description }) => {
+const StepsRatafiaSection = ({ title, steps, videoUrl, mainImage, description, videoPosterUrl }) => {
     const isEsignatureLanding = !videoUrl;
     const classnames = classNames({
         '--is-esignature': isEsignatureLanding
     });
-    return (_jsx(StepsRatafiaSectionStyled, { className: 'steps-ratafia-section', children: _jsxs("div", { className: `steps-ratafia-section__wrapper ${classnames}`, children: [!isEsignatureLanding ? (_jsx("div", { className: 'steps-ratafia-section__wrapper__video', children: _jsx(Video, { videoSrcURL: videoUrl, autoPlay: true, loop: true }) })) : (_jsx("div", { className: 'steps-ratafia-section__wrapper__image', children: mainImage })), _jsx("div", { className: 'steps-ratafia-section__wrapper__content', children: _jsx(StepsRatafiaContent, { title: title, steps: steps, description: description }) })] }) }));
+    return (_jsx(StepsRatafiaSectionStyled, { className: 'steps-ratafia-section', children: _jsxs("div", { className: `steps-ratafia-section__wrapper ${classnames}`, children: [!isEsignatureLanding ? (_jsx("div", { className: 'steps-ratafia-section__wrapper__video', children: _jsx(Video, { videoSrcURL: videoUrl, preload: 'none', poster: videoPosterUrl }) })) : (_jsx("div", { className: 'steps-ratafia-section__wrapper__image', children: mainImage })), _jsx("div", { className: 'steps-ratafia-section__wrapper__content', children: _jsx(StepsRatafiaContent, { title: title, steps: steps, description: description }) })] }) }));
 };
 export default StepsRatafiaSection;

package/dist/src/components/sections/StepsRatafiaSection/StepsRatafiaSection.tsx

@@ -6,7 +6,14 @@ import { StepsRatafiaSectionStyled } from './StepsRatafiaSection.styled'
 import { Video } from '../../atoms'
 import classNames from 'classnames'
 
-const StepsRatafiaSection: FC<StepsRatafiaSectionProps> = ({ title, steps, videoUrl, mainImage, description }) => {
+const StepsRatafiaSection: FC<StepsRatafiaSectionProps> = ({
+  title,
+  steps,
+  videoUrl,
+  mainImage,
+  description,
+  videoPosterUrl
+}) => {
   const isEsignatureLanding = !videoUrl
   const classnames = classNames({
     '--is-esignature': isEsignatureLanding
@@ -17,7 +24,7 @@ const StepsRatafiaSection: FC<StepsRatafiaSectionProps> = ({ title, steps, video
       <div className={`steps-ratafia-section__wrapper ${classnames}`}>
         {!isEsignatureLanding ? (
           <div className='steps-ratafia-section__wrapper__video'>
-            <Video videoSrcURL={videoUrl} autoPlay loop />
+            <Video videoSrcURL={videoUrl} preload='none' poster={videoPosterUrl} />
           </div>
         ) : (
           <div className='steps-ratafia-section__wrapper__image'>{mainImage}</div>

package/dist/src/components/sections/StepsRatafiaSection/StepsRatafiaSectionProps.types.d.ts

@@ -6,4 +6,5 @@ export interface StepsRatafiaSectionProps {
     videoUrl: string;
     mainImage?: React.ReactNode;
     description?: React.ReactNode;
+    videoPosterUrl?: string;
 }

package/dist/src/components/sections/StepsRatafiaSection/StepsRatafiaSectionProps.types.ts

@@ -7,4 +7,5 @@ export interface StepsRatafiaSectionProps {
   videoUrl: string
   mainImage?: React.ReactNode
   description?: React.ReactNode
+  videoPosterUrl?: string
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@npm_leadtech/legal-lib-components",
-  "version": "5.68.0",
+  "version": "5.69.0",
   "license": "ISC",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",