@comet/site-react 9.0.0-canary-20251113142723 → 9.0.0-canary-20251124092450

package/lib/blockLoader/blockLoader.d.ts

@@ -15,9 +15,10 @@ interface BlockMeta {
     fields: BlockMetaField[];
     inputFields: BlockMetaField[];
 }
-export type BlockLoader<BlockData = any> = (options: {
+export type BlockLoader<BlockData = any> = (options: BlockLoaderOptions<BlockData>) => Promise<any> | any;
+export type BlockLoaderOptions<BlockData = any> = {
     blockData: BlockData;
-} & BlockLoaderDependencies) => Promise<any> | any;
+} & BlockLoaderDependencies;
 export interface BlockLoaderDependencies {
     graphQLFetch: GraphQLFetch;
     fetch: typeof fetch;

package/lib/blockLoader/blockLoader.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"blockLoader.d.ts","sourceRoot":"","sources":["../../src/blockLoader/blockLoader.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAEjE,KAAK,cAAc,GAAG;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,MAAM,CAAC,EAAE;QAAE,MAAM,EAAE,cAAc,EAAE,CAAA;KAAE,CAAC;CACzC,CAAC;AAEF,UAAU,SAAS;IACf,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,cAAc,EAAE,CAAC;IACzB,WAAW,EAAE,cAAc,EAAE,CAAC;CACjC;AA+CD,MAAM,MAAM,WAAW,CAAC,SAAS,GAAG,GAAG,IAAI,CAAC,OAAO,EAAE;IAAE,SAAS,EAAE,SAAS,CAAA;CAAE,GAAG,uBAAuB,KAAK,OAAO,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC;AAE/H,MAAM,WAAW,uBAAuB;IACpC,YAAY,EAAE,YAAY,CAAC;IAC3B,KAAK,EAAE,OAAO,KAAK,CAAC;CACvB;AAED,wBAAsB,wBAAwB,CAAC,EAC3C,SAAS,EACT,SAAS,EACT,UAAU,EACV,OAAO,EACP,GAAG,YAAY,EAClB,EAAE;IACC,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,SAAS,EAAE,CAAC;IACxB,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;CACxC,GAAG,uBAAuB,gBAyD1B"}
+{"version":3,"file":"blockLoader.d.ts","sourceRoot":"","sources":["../../src/blockLoader/blockLoader.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAEjE,KAAK,cAAc,GAAG;IAClB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,EAAE,OAAO,CAAC;IAClB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;IAChB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,MAAM,CAAC,EAAE;QAAE,MAAM,EAAE,cAAc,EAAE,CAAA;KAAE,CAAC;CACzC,CAAC;AAEF,UAAU,SAAS;IACf,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,cAAc,EAAE,CAAC;IACzB,WAAW,EAAE,cAAc,EAAE,CAAC;CACjC;AA+CD,MAAM,MAAM,WAAW,CAAC,SAAS,GAAG,GAAG,IAAI,CAAC,OAAO,EAAE,kBAAkB,CAAC,SAAS,CAAC,KAAK,OAAO,CAAC,GAAG,CAAC,GAAG,GAAG,CAAC;AAG1G,MAAM,MAAM,kBAAkB,CAAC,SAAS,GAAG,GAAG,IAAI;IAAE,SAAS,EAAE,SAAS,CAAA;CAAE,GAAG,uBAAuB,CAAC;AAErG,MAAM,WAAW,uBAAuB;IACpC,YAAY,EAAE,YAAY,CAAC;IAC3B,KAAK,EAAE,OAAO,KAAK,CAAC;CACvB;AAED,wBAAsB,wBAAwB,CAAC,EAC3C,SAAS,EACT,SAAS,EACT,UAAU,EACV,OAAO,EACP,GAAG,YAAY,EAClB,EAAE;IACC,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,OAAO,CAAC;IACnB,UAAU,EAAE,SAAS,EAAE,CAAC;IACxB,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,WAAW,CAAC,CAAC;CACxC,GAAG,uBAAuB,gBAyD1B"}

package/lib/blocks/DamVideoBlock.d.ts

@@ -0,0 +1,15 @@
+import { ReactElement, ReactNode } from 'react';
+import { DamVideoBlockData } from '../blocks.generated';
+import { VideoPreviewImageProps } from './helpers/VideoPreviewImage';
+import { PropsWithData } from './PropsWithData';
+interface DamVideoBlockProps extends PropsWithData<DamVideoBlockData> {
+    aspectRatio?: string;
+    previewImageSizes?: string;
+    renderPreviewImage: (props: VideoPreviewImageProps) => ReactElement;
+    fill?: boolean;
+    previewImageIcon?: ReactNode;
+    playButtonAriaLabel?: string;
+}
+export declare const DamVideoBlock: ({ ...componentProps }: import('../iframebridge/withPreview').WithPreviewProps & DamVideoBlockProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=DamVideoBlock.d.ts.map

package/lib/blocks/DamVideoBlock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"DamVideoBlock.d.ts","sourceRoot":"","sources":["../../src/blocks/DamVideoBlock.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAoB,MAAM,OAAO,CAAC;AAE5E,OAAO,EAAE,KAAK,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAK7D,OAAO,EAAE,KAAK,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AAC1E,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAErD,UAAU,kBAAmB,SAAQ,aAAa,CAAC,iBAAiB,CAAC;IACjE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,kBAAkB,EAAE,CAAC,KAAK,EAAE,sBAAsB,KAAK,YAAY,CAAC;IACpE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAC7B,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAChC;AAED,eAAO,MAAM,aAAa,iJA8DzB,CAAC"}

package/lib/blocks/DamVideoBlock.js

@@ -0,0 +1,67 @@
+"use client";
+import { jsx, Fragment, jsxs } from "react/jsx-runtime";
+import clsx from "clsx";
+import { useState, useRef } from "react";
+import { withPreview } from "../iframebridge/withPreview.js";
+import { PreviewSkeleton } from "../previewskeleton/PreviewSkeleton.js";
+import styles from "./DamVideoBlock.module.scss.js";
+import { useIsElementInViewport } from "./helpers/useIsElementInViewport.js";
+const DamVideoBlock = withPreview(
+  ({
+    data: { damFile, autoplay, loop, showControls, previewImage },
+    aspectRatio = "16x9",
+    previewImageSizes,
+    renderPreviewImage,
+    fill,
+    previewImageIcon,
+    playButtonAriaLabel
+  }) => {
+    var _a;
+    if (damFile === void 0) {
+      return /* @__PURE__ */ jsx(PreviewSkeleton, { type: "media", hasContent: false, aspectRatio });
+    }
+    const [showPreviewImage, setShowPreviewImage] = useState(true);
+    const hasPreviewImage = Boolean(previewImage && previewImage.damFile);
+    const videoRef = useRef(null);
+    useIsElementInViewport(videoRef, (inView) => {
+      if (autoplay && videoRef.current) {
+        if (inView) {
+          videoRef.current.play();
+        } else {
+          videoRef.current.pause();
+        }
+      }
+    });
+    return /* @__PURE__ */ jsx(Fragment, { children: hasPreviewImage && showPreviewImage ? renderPreviewImage({
+      onPlay: () => setShowPreviewImage(false),
+      image: previewImage,
+      aspectRatio,
+      sizes: previewImageSizes,
+      fill,
+      icon: previewImageIcon,
+      playButtonAriaLabel
+    }) : /* @__PURE__ */ jsxs(
+      "video",
+      {
+        autoPlay: autoplay || hasPreviewImage && !showPreviewImage,
+        controls: showControls,
+        loop,
+        playsInline: true,
+        muted: autoplay,
+        ref: videoRef,
+        className: clsx(styles.video, fill && styles.fill),
+        style: !fill ? { "--aspect-ratio": aspectRatio.replace("x", " / ") } : void 0,
+        children: [
+          (_a = damFile.captions) == null ? void 0 : _a.map((caption) => {
+            return /* @__PURE__ */ jsx("track", { src: caption.fileUrl, kind: "captions", srcLang: caption.language }, caption.id);
+          }),
+          /* @__PURE__ */ jsx("source", { src: damFile.fileUrl, type: damFile.mimetype })
+        ]
+      }
+    ) });
+  },
+  { label: "Video" }
+);
+export {
+  DamVideoBlock
+};

package/lib/blocks/DamVideoBlock.module.scss.js

@@ -0,0 +1,11 @@
+const video = "_video_17b8y_1";
+const fill = "_fill_17b8y_7";
+const styles = {
+  video,
+  fill
+};
+export {
+  styles as default,
+  fill,
+  video
+};

package/lib/blocks/VimeoVideoBlock.d.ts

@@ -0,0 +1,15 @@
+import { ReactElement, ReactNode } from 'react';
+import { VimeoVideoBlockData } from '../blocks.generated';
+import { VideoPreviewImageProps } from './helpers/VideoPreviewImage';
+import { PropsWithData } from './PropsWithData';
+interface VimeoVideoBlockProps extends PropsWithData<VimeoVideoBlockData> {
+    aspectRatio?: string;
+    previewImageSizes?: string;
+    renderPreviewImage: (props: VideoPreviewImageProps) => ReactElement;
+    fill?: boolean;
+    previewImageIcon?: ReactNode;
+    playButtonAriaLabel?: string;
+}
+export declare const VimeoVideoBlock: ({ ...componentProps }: import('../iframebridge/withPreview').WithPreviewProps & VimeoVideoBlockProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=VimeoVideoBlock.d.ts.map

package/lib/blocks/VimeoVideoBlock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VimeoVideoBlock.d.ts","sourceRoot":"","sources":["../../src/blocks/VimeoVideoBlock.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAoB,MAAM,OAAO,CAAC;AAE5E,OAAO,EAAE,KAAK,mBAAmB,EAAE,MAAM,qBAAqB,CAAC;AAI/D,OAAO,EAAE,KAAK,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AAC1E,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAmBrD,UAAU,oBAAqB,SAAQ,aAAa,CAAC,mBAAmB,CAAC;IACrE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,kBAAkB,EAAE,CAAC,KAAK,EAAE,sBAAsB,KAAK,YAAY,CAAC;IACpE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAC7B,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAChC;AAED,eAAO,MAAM,eAAe,mJAqE3B,CAAC"}

package/lib/blocks/VimeoVideoBlock.js

@@ -0,0 +1,78 @@
+"use client";
+import { jsx, Fragment } from "react/jsx-runtime";
+import clsx from "clsx";
+import { useState, useRef } from "react";
+import { withPreview } from "../iframebridge/withPreview.js";
+import { PreviewSkeleton } from "../previewskeleton/PreviewSkeleton.js";
+import { useIsElementInViewport } from "./helpers/useIsElementInViewport.js";
+import styles from "./VimeoVideoBlock.module.scss.js";
+function parseVimeoIdentifier(vimeoIdentifier) {
+  const urlRegEx = /^(https?:\/\/)?((www\.|player\.)?vimeo\.com\/?(showcase\/)*([0-9a-z]*\/)*([0-9]{6,11})[?]?.*)$/;
+  const idRegEx = /^([0-9]{6,11})$/;
+  const urlRegExMatch = vimeoIdentifier.match(urlRegEx);
+  const idRegExMatch = vimeoIdentifier.match(idRegEx);
+  if (!urlRegExMatch && !idRegExMatch) return void 0;
+  if (urlRegExMatch) {
+    return urlRegExMatch[6];
+  } else if (idRegExMatch) {
+    return idRegExMatch[1];
+  }
+}
+const VimeoVideoBlock = withPreview(
+  ({
+    data: { vimeoIdentifier, autoplay, loop, showControls, previewImage },
+    aspectRatio = "16x9",
+    previewImageSizes,
+    renderPreviewImage,
+    fill,
+    previewImageIcon,
+    playButtonAriaLabel
+  }) => {
+    const [showPreviewImage, setShowPreviewImage] = useState(true);
+    const hasPreviewImage = !!(previewImage && previewImage.damFile);
+    const inViewRef = useRef(null);
+    const iframeRef = useRef(null);
+    const handleVisibilityChange = (isVisible) => {
+      var _a, _b;
+      (_b = (_a = iframeRef.current) == null ? void 0 : _a.contentWindow) == null ? void 0 : _b.postMessage(
+        JSON.stringify({ method: isVisible && autoplay ? "play" : "pause" }),
+        "https://player.vimeo.com"
+      );
+    };
+    useIsElementInViewport(inViewRef, handleVisibilityChange);
+    if (!vimeoIdentifier) {
+      return /* @__PURE__ */ jsx(PreviewSkeleton, { type: "media", hasContent: false, aspectRatio });
+    }
+    const identifier = parseVimeoIdentifier(vimeoIdentifier);
+    const searchParams = new URLSearchParams();
+    if (hasPreviewImage && !showPreviewImage) searchParams.append("autoplay", "1");
+    if (autoplay) searchParams.append("muted", "1");
+    if (loop !== void 0) searchParams.append("loop", Number(loop).toString());
+    if (showControls !== void 0) searchParams.append("controls", Number(showControls).toString());
+    searchParams.append("dnt", "1");
+    const vimeoBaseUrl = "https://player.vimeo.com/video/";
+    const vimeoUrl = new URL(`${vimeoBaseUrl}${identifier ?? ""}`);
+    vimeoUrl.search = searchParams.toString();
+    return /* @__PURE__ */ jsx(Fragment, { children: hasPreviewImage && showPreviewImage ? renderPreviewImage({
+      onPlay: () => setShowPreviewImage(false),
+      image: previewImage,
+      aspectRatio,
+      sizes: previewImageSizes,
+      fill,
+      icon: previewImageIcon,
+      playButtonAriaLabel
+    }) : /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: inViewRef,
+        className: clsx(styles.videoContainer, fill && styles.fill),
+        style: !fill ? { "--aspect-ratio": aspectRatio.replace("x", "/") } : void 0,
+        children: /* @__PURE__ */ jsx("iframe", { ref: iframeRef, className: styles.vimeoContainer, src: vimeoUrl.toString(), allow: "autoplay", allowFullScreen: true })
+      }
+    ) });
+  },
+  { label: "Video" }
+);
+export {
+  VimeoVideoBlock
+};

package/lib/blocks/VimeoVideoBlock.module.scss.js

@@ -0,0 +1,14 @@
+const videoContainer = "_videoContainer_1flq1_1";
+const fill = "_fill_1flq1_7";
+const vimeoContainer = "_vimeoContainer_1flq1_12";
+const styles = {
+  videoContainer,
+  fill,
+  vimeoContainer
+};
+export {
+  styles as default,
+  fill,
+  videoContainer,
+  vimeoContainer
+};

package/lib/blocks/YouTubeVideoBlock.d.ts

@@ -0,0 +1,15 @@
+import { ReactElement, ReactNode } from 'react';
+import { YouTubeVideoBlockData } from '../blocks.generated';
+import { VideoPreviewImageProps } from './helpers/VideoPreviewImage';
+import { PropsWithData } from './PropsWithData';
+interface YouTubeVideoBlockProps extends PropsWithData<YouTubeVideoBlockData> {
+    aspectRatio?: string;
+    previewImageSizes?: string;
+    renderPreviewImage: (props: VideoPreviewImageProps) => ReactElement;
+    fill?: boolean;
+    previewImageIcon?: ReactNode;
+    playButtonAriaLabel?: string;
+}
+export declare const YouTubeVideoBlock: ({ ...componentProps }: import('../iframebridge/withPreview').WithPreviewProps & YouTubeVideoBlockProps) => import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=YouTubeVideoBlock.d.ts.map

package/lib/blocks/YouTubeVideoBlock.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"YouTubeVideoBlock.d.ts","sourceRoot":"","sources":["../../src/blocks/YouTubeVideoBlock.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAoB,MAAM,OAAO,CAAC;AAE5E,OAAO,EAAE,KAAK,qBAAqB,EAAE,MAAM,qBAAqB,CAAC;AAIjE,OAAO,EAAE,KAAK,sBAAsB,EAAE,MAAM,6BAA6B,CAAC;AAC1E,OAAO,EAAE,KAAK,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAcrD,UAAU,sBAAuB,SAAQ,aAAa,CAAC,qBAAqB,CAAC;IACzE,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B,kBAAkB,EAAE,CAAC,KAAK,EAAE,sBAAsB,KAAK,YAAY,CAAC;IACpE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,gBAAgB,CAAC,EAAE,SAAS,CAAC;IAC7B,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAChC;AAED,eAAO,MAAM,iBAAiB,qJAwF7B,CAAC"}

package/lib/blocks/YouTubeVideoBlock.js

@@ -0,0 +1,94 @@
+"use client";
+import { jsx, Fragment } from "react/jsx-runtime";
+import clsx from "clsx";
+import { useState, useRef } from "react";
+import { withPreview } from "../iframebridge/withPreview.js";
+import { PreviewSkeleton } from "../previewskeleton/PreviewSkeleton.js";
+import { useIsElementInViewport } from "./helpers/useIsElementInViewport.js";
+import styles from "./YouTubeVideoBlock.module.scss.js";
+const EXPECTED_YT_ID_LENGTH = 11;
+const parseYoutubeIdentifier = (value) => {
+  const regExp = /(https?:\/\/)?(((m|www)\.)?(youtube(-nocookie)?|youtube.googleapis)\.com.*(v\/|v=|vi=|vi\/|e\/|embed\/|user\/.*\/u\/\d+\/)|youtu\.be\/)([_0-9a-zA-Z-]+)/;
+  const match = value.match(regExp);
+  const youtubeId = value.length === EXPECTED_YT_ID_LENGTH ? value : match && match[8].length === EXPECTED_YT_ID_LENGTH ? match[8] : null;
+  return youtubeId ?? void 0;
+};
+const YouTubeVideoBlock = withPreview(
+  ({
+    data: { youtubeIdentifier, autoplay, loop, showControls, previewImage },
+    aspectRatio = "16x9",
+    previewImageSizes,
+    renderPreviewImage,
+    fill,
+    previewImageIcon,
+    playButtonAriaLabel
+  }) => {
+    const [showPreviewImage, setShowPreviewImage] = useState(true);
+    const hasPreviewImage = !!(previewImage && previewImage.damFile);
+    const iframeRef = useRef(null);
+    const inViewRef = useRef(null);
+    const pauseYouTubeVideo = () => {
+      var _a, _b;
+      (_b = (_a = iframeRef.current) == null ? void 0 : _a.contentWindow) == null ? void 0 : _b.postMessage(`{"event":"command","func":"pauseVideo","args":""}`, "https://www.youtube-nocookie.com");
+    };
+    const playYouTubeVideo = () => {
+      var _a, _b;
+      (_b = (_a = iframeRef.current) == null ? void 0 : _a.contentWindow) == null ? void 0 : _b.postMessage(`{"event":"command","func":"playVideo","args":""}`, "https://www.youtube-nocookie.com");
+    };
+    useIsElementInViewport(inViewRef, (inView) => {
+      if (autoplay) {
+        if (inView) {
+          playYouTubeVideo();
+        } else {
+          pauseYouTubeVideo();
+        }
+      }
+    });
+    if (!youtubeIdentifier) {
+      return /* @__PURE__ */ jsx(PreviewSkeleton, { type: "media", hasContent: false, aspectRatio });
+    }
+    const identifier = parseYoutubeIdentifier(youtubeIdentifier);
+    const searchParams = new URLSearchParams();
+    searchParams.append("modestbranding", "1");
+    searchParams.append("rel", "0");
+    searchParams.append("enablejsapi", "1");
+    if (hasPreviewImage && !showPreviewImage) searchParams.append("autoplay", "1");
+    if (autoplay) searchParams.append("mute", "1");
+    if (showControls !== void 0) searchParams.append("controls", Number(showControls).toString());
+    if (loop !== void 0) searchParams.append("loop", Number(loop).toString());
+    if (loop && identifier) searchParams.append("playlist", identifier);
+    const youtubeBaseUrl = "https://www.youtube-nocookie.com/embed/";
+    const youtubeUrl = new URL(`${youtubeBaseUrl}${identifier ?? ""}`);
+    youtubeUrl.search = searchParams.toString();
+    return /* @__PURE__ */ jsx(Fragment, { children: hasPreviewImage && showPreviewImage ? renderPreviewImage({
+      onPlay: () => setShowPreviewImage(false),
+      image: previewImage,
+      aspectRatio,
+      sizes: previewImageSizes,
+      fill,
+      icon: previewImageIcon,
+      playButtonAriaLabel
+    }) : /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: inViewRef,
+        className: clsx(styles.videoContainer, fill && styles.fill),
+        style: !fill ? { "--aspect-ratio": aspectRatio.replace("x", "/") } : void 0,
+        children: /* @__PURE__ */ jsx(
+          "iframe",
+          {
+            ref: iframeRef,
+            className: styles.youtubeContainer,
+            allow: "autoplay",
+            referrerPolicy: "strict-origin-when-cross-origin",
+            src: youtubeUrl.toString()
+          }
+        )
+      }
+    ) });
+  },
+  { label: "Video" }
+);
+export {
+  YouTubeVideoBlock
+};

package/lib/blocks/YouTubeVideoBlock.module.scss.js

@@ -0,0 +1,14 @@
+const videoContainer = "_videoContainer_bhmhr_1";
+const fill = "_fill_bhmhr_7";
+const youtubeContainer = "_youtubeContainer_bhmhr_12";
+const styles = {
+  videoContainer,
+  fill,
+  youtubeContainer
+};
+export {
+  styles as default,
+  fill,
+  videoContainer,
+  youtubeContainer
+};

package/lib/blocks/helpers/VideoPreviewImage.d.ts

@@ -0,0 +1,21 @@
+import { ReactElement, ReactNode } from 'react';
+import { PixelImageBlockData } from '../../blocks.generated';
+export interface VideoPreviewImageProps {
+    onPlay: () => void;
+    image: PixelImageBlockData;
+    aspectRatio: string;
+    sizes?: string;
+    fill?: boolean;
+    icon?: ReactNode;
+    className?: string;
+    playButtonAriaLabel?: string;
+}
+export declare const VideoPreviewImage: ({ onPlay, image, aspectRatio, sizes, fill, playButtonAriaLabel, icon, className, renderImage, }: VideoPreviewImageProps & {
+    renderImage: (props: {
+        data: PixelImageBlockData;
+        aspectRatio: string;
+        sizes?: string;
+        fill?: boolean;
+    }) => ReactElement;
+}) => import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=VideoPreviewImage.d.ts.map

package/lib/blocks/helpers/VideoPreviewImage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"VideoPreviewImage.d.ts","sourceRoot":"","sources":["../../../src/blocks/helpers/VideoPreviewImage.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,YAAY,EAAE,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAE1D,OAAO,EAAE,KAAK,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAGlE,MAAM,WAAW,sBAAsB;IACnC,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,KAAK,EAAE,mBAAmB,CAAC;IAC3B,WAAW,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mBAAmB,CAAC,EAAE,MAAM,CAAC;CAChC;AAED,eAAO,MAAM,iBAAiB,GAAI,iGAU/B,sBAAsB,GAAG;IACxB,WAAW,EAAE,CAAC,KAAK,EAAE;QAAE,IAAI,EAAE,mBAAmB,CAAC;QAAC,WAAW,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAC;QAAC,IAAI,CAAC,EAAE,OAAO,CAAA;KAAE,KAAK,YAAY,CAAC;CAC5H,4CASA,CAAC"}

package/lib/blocks/helpers/VideoPreviewImage.js

@@ -0,0 +1,23 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import clsx from "clsx";
+import styles from "./VideoPreviewImage.module.scss.js";
+const VideoPreviewImage = ({
+  onPlay,
+  image,
+  aspectRatio,
+  sizes = "100vw",
+  fill,
+  playButtonAriaLabel = "Play video",
+  icon = /* @__PURE__ */ jsx(PlayIcon, { playButtonAriaLabel }),
+  className,
+  renderImage
+}) => {
+  return /* @__PURE__ */ jsxs("div", { className: clsx(styles.root, fill && styles.fill, className), children: [
+    renderImage({ data: image, aspectRatio, sizes, fill }),
+    /* @__PURE__ */ jsx("button", { className: styles.iconWrapper, onClick: onPlay, children: icon })
+  ] });
+};
+const PlayIcon = ({ playButtonAriaLabel }) => /* @__PURE__ */ jsx("span", { className: styles.playIcon, "aria-label": playButtonAriaLabel });
+export {
+  VideoPreviewImage
+};

package/lib/blocks/helpers/VideoPreviewImage.module.scss.js

@@ -0,0 +1,17 @@
+const root = "_root_1k5a5_1";
+const fill = "_fill_1k5a5_6";
+const iconWrapper = "_iconWrapper_1k5a5_10";
+const playIcon = "_playIcon_1k5a5_26";
+const styles = {
+  root,
+  fill,
+  iconWrapper,
+  playIcon
+};
+export {
+  styles as default,
+  fill,
+  iconWrapper,
+  playIcon,
+  root
+};

package/lib/index.d.ts

@@ -1,5 +1,6 @@
-export { type BlockLoader, type BlockLoaderDependencies, recursivelyLoadBlockData } from './blockLoader/blockLoader';
+export { type BlockLoader, type BlockLoaderDependencies, type BlockLoaderOptions, recursivelyLoadBlockData } from './blockLoader/blockLoader';
 export { DamFileDownloadLinkBlock } from './blocks/DamFileDownloadLinkBlock';
+export { DamVideoBlock } from './blocks/DamVideoBlock';
 export { EmailLinkBlock } from './blocks/EmailLinkBlock';
 export { ExternalLinkBlock } from './blocks/ExternalLinkBlock';
 export { BlocksBlock } from './blocks/factories/BlocksBlock';
@@ -9,9 +10,13 @@ export { OptionalBlock } from './blocks/factories/OptionalBlock';
 export type { SupportedBlocks } from './blocks/factories/types';
 export { hasRichTextBlockContent } from './blocks/helpers/RichTextBlockHelper';
 export { useIsElementInViewport } from './blocks/helpers/useIsElementInViewport';
+export type { VideoPreviewImageProps } from './blocks/helpers/VideoPreviewImage';
+export { VideoPreviewImage } from './blocks/helpers/VideoPreviewImage';
 export { PhoneLinkBlock } from './blocks/PhoneLinkBlock';
 export type { PropsWithData } from './blocks/PropsWithData';
 export { SvgImageBlock } from './blocks/SvgImageBlock';
+export { VimeoVideoBlock } from './blocks/VimeoVideoBlock';
+export { YouTubeVideoBlock } from './blocks/YouTubeVideoBlock';
 export { type CookieApi, CookieApiProvider, useCookieApi } from './cookies/CookieApiContext';
 export { CookieSafe } from './cookies/CookieSafe';
 export { useCookieBotCookieApi } from './cookies/useCookieBotCookieApi';

package/lib/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"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"}

package/lib/index.js

@@ -1,5 +1,6 @@
 import { recursivelyLoadBlockData } from "./blockLoader/blockLoader.js";
 import { DamFileDownloadLinkBlock } from "./blocks/DamFileDownloadLinkBlock.js";
+import { DamVideoBlock } from "./blocks/DamVideoBlock.js";
 import { EmailLinkBlock } from "./blocks/EmailLinkBlock.js";
 import { ExternalLinkBlock } from "./blocks/ExternalLinkBlock.js";
 import { BlocksBlock } from "./blocks/factories/BlocksBlock.js";
@@ -8,8 +9,11 @@ import { OneOfBlock } from "./blocks/factories/OneOfBlock.js";
 import { OptionalBlock } from "./blocks/factories/OptionalBlock.js";
 import { hasRichTextBlockContent } from "./blocks/helpers/RichTextBlockHelper.js";
 import { useIsElementInViewport } from "./blocks/helpers/useIsElementInViewport.js";
+import { VideoPreviewImage } from "./blocks/helpers/VideoPreviewImage.js";
 import { PhoneLinkBlock } from "./blocks/PhoneLinkBlock.js";
 import { SvgImageBlock } from "./blocks/SvgImageBlock.js";
+import { VimeoVideoBlock } from "./blocks/VimeoVideoBlock.js";
+import { YouTubeVideoBlock } from "./blocks/YouTubeVideoBlock.js";
 import { CookieApiProvider, useCookieApi } from "./cookies/CookieApiContext.js";
 import { CookieSafe } from "./cookies/CookieSafe.js";
 import { useCookieBotCookieApi } from "./cookies/useCookieBotCookieApi.js";
@@ -43,6 +47,7 @@ export {
   CookieApiProvider,
   CookieSafe,
   DamFileDownloadLinkBlock,
+  DamVideoBlock,
   EmailLinkBlock,
   ErrorHandlerBoundary,
   ErrorHandlerProvider,
@@ -59,6 +64,9 @@ export {
   PreviewSkeleton,
   SitePreviewIFrameMessageType,
   SvgImageBlock,
+  VideoPreviewImage,
+  VimeoVideoBlock,
+  YouTubeVideoBlock,
   calculateInheritAspectRatio,
   convertPreviewDataToHeaders,
   createFetchInMemoryCache,

package/lib/style.css

@@ -1 +1 @@
-._previewElementContainer_nwhl6_1{display:contents}._childrenWrapper_qguhx_1{position:relative;z-index:1}._root_v4248_1{position:absolute;z-index:2;top:0;left:0;right:0;min-height:100vh;height:var(--height)}._root_1ya0k_1{position:absolute;cursor:pointer;outline:1px solid transparent;outline-offset:-1px}._root_1ya0k_1:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;opacity:.25}._root_1ya0k_1:hover{outline-color:#29b6f6;outline-style:solid}._root_1ya0k_1:hover:after{background-color:#29b6f6}._isHoveredInBlockList_1ya0k_24{outline-color:#29b6f6;outline-style:solid}._isHoveredInBlockList_1ya0k_24:after{background-color:#29b6f6}._showBlockOutlines_1ya0k_32:not(:hover){outline-color:#d9d9d9;outline-style:dashed}._blockIsSelected_1ya0k_37{outline-color:#29b6f6}._blockIsSelected_1ya0k_37 ._label_1ya0k_40{display:inline-block}._label_1ya0k_40{position:absolute;padding:2px;background-color:#57b0eb;line-height:16px;color:#fff;top:1px;right:1px;font-size:12px;display:none}._barSkeleton_zomv4_1{min-height:20px;margin-bottom:5px;margin-right:5px;background-color:var(--background-color);color:var(--color)}._rowsContainer_zomv4_9{width:100%;min-width:300px}._rowSkeleton_zomv4_14{margin-bottom:10px;min-height:20px;width:var(--width);background-color:var(--background-color);color:var(--color)}._imageContainer_zomv4_22{width:100%;aspect-ratio:var(--aspect-ratio);height:var(--height);background-color:var(--background-color);color:var(--color)}
+._previewElementContainer_nwhl6_1{display:contents}._childrenWrapper_qguhx_1{position:relative;z-index:1}._root_v4248_1{position:absolute;z-index:2;top:0;left:0;right:0;min-height:100vh;height:var(--height)}._root_1ya0k_1{position:absolute;cursor:pointer;outline:1px solid transparent;outline-offset:-1px}._root_1ya0k_1:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;opacity:.25}._root_1ya0k_1:hover{outline-color:#29b6f6;outline-style:solid}._root_1ya0k_1:hover:after{background-color:#29b6f6}._isHoveredInBlockList_1ya0k_24{outline-color:#29b6f6;outline-style:solid}._isHoveredInBlockList_1ya0k_24:after{background-color:#29b6f6}._showBlockOutlines_1ya0k_32:not(:hover){outline-color:#d9d9d9;outline-style:dashed}._blockIsSelected_1ya0k_37{outline-color:#29b6f6}._blockIsSelected_1ya0k_37 ._label_1ya0k_40{display:inline-block}._label_1ya0k_40{position:absolute;padding:2px;background-color:#57b0eb;line-height:16px;color:#fff;top:1px;right:1px;font-size:12px;display:none}._barSkeleton_zomv4_1{min-height:20px;margin-bottom:5px;margin-right:5px;background-color:var(--background-color);color:var(--color)}._rowsContainer_zomv4_9{width:100%;min-width:300px}._rowSkeleton_zomv4_14{margin-bottom:10px;min-height:20px;width:var(--width);background-color:var(--background-color);color:var(--color)}._imageContainer_zomv4_22{width:100%;aspect-ratio:var(--aspect-ratio);height:var(--height);background-color:var(--background-color);color:var(--color)}._video_17b8y_1{width:100%;object-fit:cover;aspect-ratio:var(--aspect-ratio)}._fill_17b8y_7{height:100%}._root_1k5a5_1{position:relative;width:100%}._fill_1k5a5_6{height:100%}._iconWrapper_1k5a5_10{position:absolute;top:0;right:0;left:0;bottom:0;display:flex;align-items:center;justify-content:center;background-color:#000;opacity:.5;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;padding:0;cursor:pointer}._iconWrapper_1k5a5_10:focus ._playIcon_1k5a5_26{outline:4px solid white;outline-offset:10px;border-radius:2px}._playIcon_1k5a5_26{width:64px;height:64px;box-sizing:border-box;border-style:solid;border-width:32px 0 32px 64px;border-color:transparent transparent transparent white}._videoContainer_1flq1_1{overflow:hidden;position:relative;aspect-ratio:var(--aspect-ratio)}._fill_1flq1_7{width:100%;height:100%}._vimeoContainer_1flq1_12{position:absolute;border:0;top:0;left:0;width:100%;height:100%}._videoContainer_bhmhr_1{overflow:hidden;position:relative;aspect-ratio:var(--aspect-ratio)}._fill_bhmhr_7{width:100%;height:100%}._youtubeContainer_bhmhr_12{position:absolute;border:0;top:0;left:0;width:100%;height:100%}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@comet/site-react",
-  "version": "9.0.0-canary-20251113142723",
+  "version": "9.0.0-canary-20251124092450",
   "description": "Comet Site React package",
   "repository": {
     "type": "git",
@@ -51,12 +51,12 @@
     "rollup-plugin-preserve-directives": "^0.4.0",
     "sass": "^1.89.2",
     "ts-jest": "^29.4.0",
-    "typescript": "5.8.3",
+    "typescript": "5.9.3",
     "vite": "^5.4.19",
     "vite-plugin-dts": "^4.5.4",
     "webpack": "^5.102.1",
-    "@comet/cli": "9.0.0-canary-20251113142723",
-    "@comet/eslint-config": "9.0.0-canary-20251113142723"
+    "@comet/cli": "9.0.0-canary-20251124092450",
+    "@comet/eslint-config": "9.0.0-canary-20251124092450"
   },
   "peerDependencies": {
     "react": "^18.0.0 || ^19.0.0"