@pushwoosh/dumb-components 1.1.161 → 1.1.163

package/NativeRichMediaPreview/styles.d.ts

@@ -0,0 +1,19 @@
+export declare const TemplateLayer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const ButtonRow: import("styled-components").StyledComponent<"div", any, {
+    $borderRadius: number;
+    $background?: string;
+    $color: string;
+    $marginTop?: number;
+    $boxShadow?: string;
+    $border?: string;
+}, never>;
+export declare const ScaledCanvasHost: import("styled-components").StyledComponent<"div", any, {
+    width: string | number;
+    height: string | number;
+    $withBackground: boolean;
+}, never>;
+export declare const CanvasWrapper: import("styled-components").StyledComponent<"div", any, {
+    $canvasWidth: number;
+    $canvasHeight: number;
+    $scale: number;
+}, never>;

package/NativeRichMediaPreview/styles.js

@@ -0,0 +1,45 @@
+import styled from 'styled-components';
+import { Color, ShapeRadius } from '@pushwoosh/kit-constants';
+import { toCssValue } from '@pushwoosh/kit-helpers';
+export const TemplateLayer = styled.div.withConfig({
+  displayName: "TemplateLayer",
+  componentId: "sc-mc9ykd-0"
+})(["position:absolute;inset:0;z-index:10;"]);
+export const ButtonRow = styled.div.withConfig({
+  displayName: "ButtonRow",
+  componentId: "sc-mc9ykd-1"
+})(["display:flex;align-items:center;justify-content:center;height:52px;font-size:16px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 12px;border-radius:", "px;color:", ";", " ", " ", " ", ""], ({
+  $borderRadius
+}) => $borderRadius, ({
+  $color
+}) => $color, ({
+  $background
+}) => $background !== undefined ? `background: ${$background};` : '', ({
+  $marginTop
+}) => $marginTop !== undefined ? `margin-top: ${$marginTop}px;` : '', ({
+  $boxShadow
+}) => $boxShadow !== undefined ? `box-shadow: ${$boxShadow};` : '', ({
+  $border
+}) => $border !== undefined ? `border: ${$border};` : '');
+export const ScaledCanvasHost = styled.div.withConfig({
+  displayName: "ScaledCanvasHost",
+  componentId: "sc-mc9ykd-2"
+})(["position:relative;border:", ";border-radius:", ";background-color:", ";width:", ";height:", ";margin:0 auto;overflow:hidden;"], ({
+  $withBackground
+}) => $withBackground ? `1px solid ${Color.DIVIDER}` : 'none', ShapeRadius.SECTION, ({
+  $withBackground
+}) => $withBackground ? Color.CLEAR : 'transparent', ({
+  width
+}) => toCssValue(width), ({
+  height
+}) => toCssValue(height));
+export const CanvasWrapper = styled.div.withConfig({
+  displayName: "CanvasWrapper",
+  componentId: "sc-mc9ykd-3"
+})(["position:absolute;left:50%;top:50%;width:", "px;height:", "px;display:flex;align-items:center;justify-content:center;transform:translate(-50%,-50%) scale(", ");transform-origin:center center;"], ({
+  $canvasWidth
+}) => $canvasWidth, ({
+  $canvasHeight
+}) => $canvasHeight, ({
+  $scale
+}) => $scale);

package/NativeRichMediaPreview/types.d.ts

@@ -0,0 +1,294 @@
+/** Text fragment with an optional custom color. */
+export type NativeRichMediaText = {
+    /** Text content. */
+    text: string;
+    /** CSS text color; falls back to the block's default. */
+    color?: string;
+};
+/** What happens when an interactive element is tapped. */
+export type NativeRichMediaAction = {
+    type: 'close';
+} | {
+    type: 'url';
+    url: string;
+};
+/** Button rendered inside a rich media block. */
+export type NativeRichMediaButton = {
+    /** Button caption. */
+    text: string;
+    /** CSS caption color. */
+    textColor?: string;
+    /** CSS background of the button. */
+    background?: string;
+    /** Corner radius in pt. */
+    cornerRadius?: number;
+    /** Tap action. */
+    action?: NativeRichMediaAction;
+};
+/** Reward panel shown after winning a scratchcard or spinwheel. */
+export type NativeRichMediaReward = {
+    /** Panel heading. */
+    title?: NativeRichMediaText;
+    /** Panel body text. */
+    message?: NativeRichMediaText;
+    /** Promo code displayed with a copy control. */
+    code?: string;
+    /** Caption of the confirmation button. */
+    button?: string;
+    /** Confirmation button action. */
+    action?: NativeRichMediaAction;
+};
+/** Content of a `modal` rich media. */
+export type NativeRichMediaModalBlock = {
+    /** CSS background of the modal card. */
+    background?: string;
+    /** Heading. */
+    title?: NativeRichMediaText;
+    /** Body text. */
+    message?: NativeRichMediaText;
+    /** Cover image URL. */
+    image?: string;
+    /** Show a close (✕) chip. */
+    showClose?: boolean;
+    /** Dim the screen behind the card (default `true`). */
+    dimBackground?: boolean;
+    /** Action buttons under the message. */
+    buttons?: NativeRichMediaButton[];
+};
+/** Content of a `sheet` rich media; same shape as {@link NativeRichMediaModalBlock}, docked to the bottom. */
+export type NativeRichMediaSheetBlock = NativeRichMediaModalBlock;
+/** Single card of a `carousel` rich media. */
+export type NativeRichMediaCarouselItem = {
+    /** Card image URL. */
+    image?: string;
+    /** Card heading. */
+    title?: string;
+    /** Card secondary text. */
+    subtitle?: string;
+    /** URL opened when the card is tapped. */
+    url?: string;
+};
+/** Content of a `carousel` rich media. */
+export type NativeRichMediaCarouselBlock = {
+    /** Carousel cards. */
+    items: NativeRichMediaCarouselItem[];
+    /** Show a close (✕) chip. */
+    showClose?: boolean;
+};
+/** Single slide of a `stories` rich media. */
+export type NativeRichMediaStoryItem = {
+    /** Slide image URL. */
+    image?: string;
+    /** Slide heading. */
+    title?: string;
+    /** Slide secondary text. */
+    subtitle?: string;
+    /** Caption of the slide's action button. */
+    button?: string;
+    /** URL opened by the action button. */
+    url?: string;
+    /** Slide duration in seconds. */
+    duration?: number;
+};
+/** Content of a `stories` rich media. */
+export type NativeRichMediaStoriesBlock = {
+    /** Story slides. */
+    items: NativeRichMediaStoryItem[];
+    /** Restart from the first slide after the last one. */
+    loop?: boolean;
+    /** Show a close (✕) chip. */
+    showClose?: boolean;
+};
+/** Content of a `banner` rich media. */
+export type NativeRichMediaBannerBlock = {
+    /** Screen edge the banner is docked to (default `bottom`). */
+    position?: 'top' | 'bottom';
+    /** Leading image URL. */
+    image?: string;
+    /** Heading. */
+    title?: NativeRichMediaText;
+    /** Body text. */
+    message?: NativeRichMediaText;
+    /** CSS background of the banner. */
+    background?: string;
+    /** Tap action. */
+    action?: NativeRichMediaAction;
+    /** Auto-dismiss timeout in seconds. */
+    autoDismiss?: number;
+    /** Show a close (✕) chip. */
+    showClose?: boolean;
+};
+/** Content of a `fullscreen` rich media. */
+export type NativeRichMediaFullscreenBlock = {
+    /** Cover image URL. */
+    image?: string;
+    /** Heading. */
+    title?: NativeRichMediaText;
+    /** Body text. */
+    message?: NativeRichMediaText;
+    /** Action buttons at the bottom. */
+    buttons?: NativeRichMediaButton[];
+    /** Show a close (✕) chip. */
+    showClose?: boolean;
+};
+/** Content of a `video` rich media. */
+export type NativeRichMediaVideoBlock = {
+    /** Video URL. */
+    url?: string;
+    /** Poster image URL shown before playback. */
+    poster?: string;
+    /** Image URL shown when the video cannot be played. */
+    fallback?: string;
+    /** Heading over the video. */
+    title?: NativeRichMediaText;
+    /** Body text over the video. */
+    message?: NativeRichMediaText;
+    /** Caption of the action button. */
+    button?: string;
+    /** Action button action. */
+    action?: NativeRichMediaAction;
+    /** Loop playback. */
+    loop?: boolean;
+    /** Start playback muted. */
+    muted?: boolean;
+    /** Show a close (✕) chip. */
+    showClose?: boolean;
+};
+/** Content of a `pip` (picture-in-picture) rich media. */
+export type NativeRichMediaPipBlock = {
+    /** Video URL. */
+    url?: string;
+    /** Poster image URL shown before playback. */
+    poster?: string;
+    /** Image URL shown when the video cannot be played. */
+    fallback?: string;
+    /** Screen corner the pip window is docked to (default `bottom-right`). */
+    position?: 'bottom-right' | 'bottom-left' | 'top-right' | 'top-left';
+    /** Pip window width in pt. */
+    width?: number;
+    /** Width-to-height ratio of the pip window. */
+    aspectRatio?: number;
+    /** Corner radius in pt. */
+    cornerRadius?: number;
+    /** Loop playback. */
+    loop?: boolean;
+    /** Start playback muted. */
+    muted?: boolean;
+    /** Caption of the action button. */
+    button?: string;
+    /** Action button action. */
+    action?: NativeRichMediaAction;
+    /** Show a close (✕) chip. */
+    showClose?: boolean;
+};
+/** Scratch layer of a {@link NativeRichMediaScratchcardBlock}. */
+export type NativeRichMediaScratchcardCover = {
+    /** Cover image URL. */
+    image?: string;
+    /** CSS cover color used when there is no image. */
+    color?: string;
+};
+/** Content of a `scratchcard` rich media. */
+export type NativeRichMediaScratchcardBlock = {
+    /** CSS background: a color or gradient stops. */
+    background?: string | string[];
+    /** Heading. */
+    title?: NativeRichMediaText;
+    /** Body text. */
+    message?: NativeRichMediaText;
+    /** Scratch layer hiding the reward. */
+    cover?: NativeRichMediaScratchcardCover;
+    /** Scratched-area fraction (0–1) that reveals the reward. */
+    revealThreshold?: number;
+    /** Caption of the instant-reveal button. */
+    revealButton?: string;
+    /** Reward revealed under the cover. */
+    reward?: NativeRichMediaReward;
+    /** Show a close (✕) chip. */
+    showClose?: boolean;
+};
+/** Single sector of a {@link NativeRichMediaSpinwheelBlock}. */
+export type NativeRichMediaSpinwheelSegment = {
+    /** Sector caption. */
+    text: string;
+    /** CSS sector fill color. */
+    color?: string;
+    /** CSS caption color. */
+    textColor?: string;
+    /** Relative sector size; defaults to an even split. */
+    weight?: number;
+    /** Reward granted when the wheel stops on this sector. */
+    reward?: NativeRichMediaReward;
+};
+/** Content of a `spinwheel` rich media. */
+export type NativeRichMediaSpinwheelBlock = {
+    /** CSS background: a color or gradient stops. */
+    background?: string | string[];
+    /** Heading. */
+    title?: NativeRichMediaText;
+    /** Body text. */
+    message?: NativeRichMediaText;
+    /** Index of the winning segment; omit for a losing spin. */
+    winIndex?: number;
+    /** Caption of the spin button. */
+    spinButton?: string;
+    /** Wheel sectors. */
+    segments: NativeRichMediaSpinwheelSegment[];
+    /** Reward shown after a winning spin. */
+    reward?: NativeRichMediaReward;
+    /** Heading shown after a losing spin. */
+    loseTitle?: NativeRichMediaText;
+    /** Show a close (✕) chip. */
+    showClose?: boolean;
+};
+/** Native rich media config: a display type and the matching content block. */
+export type NativeRichMediaConfig = {
+    displayType: 'modal';
+    modal: NativeRichMediaModalBlock;
+} | {
+    displayType: 'sheet';
+    sheet: NativeRichMediaSheetBlock;
+} | {
+    displayType: 'carousel';
+    carousel: NativeRichMediaCarouselBlock;
+} | {
+    displayType: 'stories';
+    stories: NativeRichMediaStoriesBlock;
+} | {
+    displayType: 'banner';
+    banner: NativeRichMediaBannerBlock;
+} | {
+    displayType: 'fullscreen';
+    fullscreen: NativeRichMediaFullscreenBlock;
+} | {
+    displayType: 'video';
+    video: NativeRichMediaVideoBlock;
+} | {
+    displayType: 'pip';
+    pip: NativeRichMediaPipBlock;
+} | {
+    displayType: 'scratchcard';
+    scratchcard: NativeRichMediaScratchcardBlock;
+} | {
+    displayType: 'spinwheel';
+    spinwheel: NativeRichMediaSpinwheelBlock;
+};
+/** Supported rich media display types. */
+export type NativeRichMediaDisplayType = NativeRichMediaConfig['displayType'];
+/** All supported {@link NativeRichMediaDisplayType} values. */
+export declare const NATIVE_RICH_MEDIA_DISPLAY_TYPES: NativeRichMediaDisplayType[];
+/** Props of {@link NativeRichMediaPreview}. */
+export type NativeRichMediaPreviewProps = {
+    /** Rich media config, as an object or a JSON string. */
+    content: string | NativeRichMediaConfig;
+    /** Accessible name of the preview (rendered as the `title` attribute). */
+    name?: string;
+    /** Preview width; number is treated as px (default `304`). */
+    width?: string | number;
+    /** Preview height; number is treated as px (default `659`). */
+    height?: string | number;
+    /** Show a spinner instead of the content. */
+    isLoading?: boolean;
+    /** Render the container chrome — white backdrop and border (default `true`). Set `false` for a transparent preview over the consumer's own background. */
+    withBackground?: boolean;
+};

package/NativeRichMediaPreview/types.js

@@ -0,0 +1,2 @@
+/** All supported {@link NativeRichMediaDisplayType} values. */
+export const NATIVE_RICH_MEDIA_DISPLAY_TYPES = ['modal', 'sheet', 'carousel', 'stories', 'banner', 'fullscreen', 'video', 'pip', 'scratchcard', 'spinwheel'];

package/NativeRichMediaPreview/views/NativeRichMediaBannerView/NativeRichMediaBannerView.d.ts

@@ -0,0 +1,3 @@
+import { type ReactElement } from 'react';
+import type { NativeRichMediaBannerViewProps } from './types';
+export declare function NativeRichMediaBannerView(props: NativeRichMediaBannerViewProps): ReactElement;

package/NativeRichMediaPreview/views/NativeRichMediaBannerView/NativeRichMediaBannerView.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Card, CloseGlyph, TextContainer } from './styles';
+import { NativeRichMediaCoverImg } from '../../components/NativeRichMediaCoverImg';
+import { NativeRichMediaPtLabel } from '../../components/NativeRichMediaPtLabel';
+import { PT } from '../../helpers';
+import { TemplateLayer } from '../../styles';
+export function NativeRichMediaBannerView(props) {
+  const {
+    block
+  } = props;
+  const isTop = block.position === 'top';
+  return _jsx(TemplateLayer, {
+    children: _jsxs(Card, {
+      "$top": isTop ? PT.SAFE_TOP + 10 : undefined,
+      "$bottom": isTop ? undefined : PT.SAFE_BOTTOM + 10,
+      "$background": block.background || '#1F1F1F',
+      children: [block.image && _jsx(NativeRichMediaCoverImg, {
+        url: block.image,
+        width: 52,
+        height: 52,
+        borderRadius: 12,
+        flex: "none"
+      }), _jsxs(TextContainer, {
+        children: [block.title && _jsx(NativeRichMediaPtLabel, {
+          value: block.title,
+          size: 16,
+          weight: 600,
+          fallbackColor: "#FFFFFF",
+          align: "left",
+          truncate: true
+        }), block.message && _jsx(NativeRichMediaPtLabel, {
+          value: block.message,
+          size: 13,
+          weight: 400,
+          fallbackColor: "rgba(255,255,255,0.7)",
+          align: "left",
+          lineHeight: 1.3,
+          clamp2: true,
+          marginTop: block.title ? 2 : undefined
+        })]
+      }), block.showClose !== false && _jsx(CloseGlyph, {
+        children: "\u2715"
+      })]
+    })
+  });
+}

package/NativeRichMediaPreview/views/NativeRichMediaBannerView/index.d.ts

@@ -0,0 +1 @@
+export { NativeRichMediaBannerView } from './NativeRichMediaBannerView';

package/NativeRichMediaPreview/views/NativeRichMediaBannerView/index.js

@@ -0,0 +1 @@
+export { NativeRichMediaBannerView } from './NativeRichMediaBannerView';

package/NativeRichMediaPreview/views/NativeRichMediaBannerView/styles.d.ts

@@ -0,0 +1,7 @@
+export declare const Card: import("styled-components").StyledComponent<"div", any, {
+    $background: string;
+    $top?: number;
+    $bottom?: number;
+}, never>;
+export declare const TextContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const CloseGlyph: import("styled-components").StyledComponent<"div", any, {}, never>;

package/NativeRichMediaPreview/views/NativeRichMediaBannerView/styles.js

@@ -0,0 +1,19 @@
+import styled from 'styled-components';
+export const Card = styled.div.withConfig({
+  displayName: "Card",
+  componentId: "sc-1fs78cm-0"
+})(["position:absolute;left:12px;right:12px;border-radius:18px;box-shadow:0 16px 28px rgba(0,0,0,0.28);padding:12px 14px;display:flex;align-items:center;gap:12px;background:", ";", " ", ""], ({
+  $background
+}) => $background, ({
+  $top
+}) => $top !== undefined ? `top: ${$top}px;` : '', ({
+  $bottom
+}) => $bottom !== undefined ? `bottom: ${$bottom}px;` : '');
+export const TextContainer = styled.div.withConfig({
+  displayName: "TextContainer",
+  componentId: "sc-1fs78cm-1"
+})(["flex:1;min-width:0;"]);
+export const CloseGlyph = styled.div.withConfig({
+  displayName: "CloseGlyph",
+  componentId: "sc-1fs78cm-2"
+})(["flex:none;width:24px;height:24px;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,0.6);font-size:13px;font-weight:700;"]);

package/NativeRichMediaPreview/views/NativeRichMediaBannerView/types.d.ts

@@ -0,0 +1,4 @@
+import type { NativeRichMediaBannerBlock } from '../../types';
+export type NativeRichMediaBannerViewProps = {
+    block: NativeRichMediaBannerBlock;
+};

package/NativeRichMediaPreview/views/NativeRichMediaBannerView/types.js

@@ -0,0 +1 @@
+export {};

package/NativeRichMediaPreview/views/NativeRichMediaCarouselView/NativeRichMediaCarouselView.d.ts

@@ -0,0 +1,3 @@
+import { type ReactElement } from 'react';
+import type { NativeRichMediaCarouselViewProps } from './types';
+export declare function NativeRichMediaCarouselView(props: NativeRichMediaCarouselViewProps): ReactElement;

package/NativeRichMediaPreview/views/NativeRichMediaCarouselView/NativeRichMediaCarouselView.js

@@ -0,0 +1,43 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { Card, Dot, Dots, GradientOverlay, SubtitleText, TextBlock, TitleText } from './styles';
+import { NativeRichMediaCloseChip } from '../../components/NativeRichMediaCloseChip';
+import { NativeRichMediaCoverImg } from '../../components/NativeRichMediaCoverImg';
+import { asText } from '../../helpers';
+import { TemplateLayer } from '../../styles';
+export function NativeRichMediaCarouselView(props) {
+  const {
+    block,
+    activeIndex,
+    onNavigate
+  } = props;
+  const items = block.items;
+  const idx = Math.max(0, Math.min(activeIndex, items.length - 1));
+  const item = items[idx] || {};
+  return _jsx(TemplateLayer, {
+    children: _jsxs(Card, {
+      children: [_jsx(NativeRichMediaCoverImg, {
+        url: item.image,
+        position: "absolute",
+        inset: true
+      }), (item.title || item.subtitle) && _jsxs(_Fragment, {
+        children: [_jsx(GradientOverlay, {}), _jsxs(TextBlock, {
+          children: [item.title && _jsx(TitleText, {
+            children: asText(item.title)
+          }), item.subtitle && _jsx(SubtitleText, {
+            children: asText(item.subtitle)
+          })]
+        })]
+      }), items.length > 1 && _jsx(Dots, {
+        children: items.map((_, i) => _jsx(Dot
+        // eslint-disable-next-line react/no-array-index-key
+        , {
+          "$active": i === idx,
+          onClick: () => onNavigate(i)
+        }, `carousel-dot-${i}`))
+      }), block.showClose !== false && _jsx(NativeRichMediaCloseChip, {
+        top: 12,
+        right: 12
+      })]
+    })
+  });
+}

package/NativeRichMediaPreview/views/NativeRichMediaCarouselView/index.d.ts

@@ -0,0 +1 @@
+export { NativeRichMediaCarouselView } from './NativeRichMediaCarouselView';

package/NativeRichMediaPreview/views/NativeRichMediaCarouselView/index.js

@@ -0,0 +1 @@
+export { NativeRichMediaCarouselView } from './NativeRichMediaCarouselView';

package/NativeRichMediaPreview/views/NativeRichMediaCarouselView/styles.d.ts

@@ -0,0 +1,9 @@
+export declare const Card: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const GradientOverlay: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const TextBlock: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const TitleText: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const SubtitleText: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Dots: import("styled-components").StyledComponent<"div", any, {}, never>;
+export declare const Dot: import("styled-components").StyledComponent<"div", any, {
+    $active?: boolean;
+}, never>;

package/NativeRichMediaPreview/views/NativeRichMediaCarouselView/styles.js

@@ -0,0 +1,31 @@
+import styled from 'styled-components';
+export const Card = styled.div.withConfig({
+  displayName: "Card",
+  componentId: "sc-15b2cux-0"
+})(["position:absolute;left:22px;right:22px;top:50%;transform:translateY(-50%);height:461px;border-radius:24px;background:#000;overflow:hidden;box-shadow:0 16px 28px rgba(0,0,0,0.28);"]);
+export const GradientOverlay = styled.div.withConfig({
+  displayName: "GradientOverlay",
+  componentId: "sc-15b2cux-1"
+})(["position:absolute;left:0;right:0;bottom:0;height:140px;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,0.75));"]);
+export const TextBlock = styled.div.withConfig({
+  displayName: "TextBlock",
+  componentId: "sc-15b2cux-2"
+})(["position:absolute;left:18px;right:18px;bottom:36px;"]);
+export const TitleText = styled.div.withConfig({
+  displayName: "TitleText",
+  componentId: "sc-15b2cux-3"
+})(["font-size:20px;font-weight:700;color:#FFF;line-height:1.25;"]);
+export const SubtitleText = styled.div.withConfig({
+  displayName: "SubtitleText",
+  componentId: "sc-15b2cux-4"
+})(["font-size:14px;color:rgba(255,255,255,0.85);margin-top:3px;"]);
+export const Dots = styled.div.withConfig({
+  displayName: "Dots",
+  componentId: "sc-15b2cux-5"
+})(["position:absolute;left:0;right:0;bottom:12px;text-align:center;font-size:0;"]);
+export const Dot = styled.div.withConfig({
+  displayName: "Dot",
+  componentId: "sc-15b2cux-6"
+})(["display:inline-block;width:7px;height:7px;border-radius:50%;margin:0 4.5px;cursor:pointer;background:", ";"], ({
+  $active
+}) => $active ? '#FFF' : 'rgba(255,255,255,0.4)');

package/NativeRichMediaPreview/views/NativeRichMediaCarouselView/types.d.ts

@@ -0,0 +1,6 @@
+import type { NativeRichMediaCarouselBlock } from '../../types';
+export type NativeRichMediaCarouselViewProps = {
+    block: NativeRichMediaCarouselBlock;
+    activeIndex: number;
+    onNavigate: (index: number) => void;
+};

package/NativeRichMediaPreview/views/NativeRichMediaCarouselView/types.js

@@ -0,0 +1 @@
+export {};

package/NativeRichMediaPreview/views/NativeRichMediaFullscreenView/NativeRichMediaFullscreenView.d.ts

@@ -0,0 +1,3 @@
+import { type ReactElement } from 'react';
+import type { NativeRichMediaFullscreenViewProps } from './types';
+export declare function NativeRichMediaFullscreenView(props: NativeRichMediaFullscreenViewProps): ReactElement;

package/NativeRichMediaPreview/views/NativeRichMediaFullscreenView/NativeRichMediaFullscreenView.js

@@ -0,0 +1,42 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { GradientOverlay, TextBlock } from './styles';
+import { NativeRichMediaCloseChip } from '../../components/NativeRichMediaCloseChip';
+import { NativeRichMediaCoverImg } from '../../components/NativeRichMediaCoverImg';
+import { NativeRichMediaOverlayButtons } from '../../components/NativeRichMediaOverlayButtons';
+import { NativeRichMediaPtLabel } from '../../components/NativeRichMediaPtLabel';
+import { PT } from '../../helpers';
+import { TemplateLayer } from '../../styles';
+export function NativeRichMediaFullscreenView(props) {
+  const {
+    block
+  } = props;
+  const hasButtons = (block.buttons || []).length > 0;
+  return _jsxs(TemplateLayer, {
+    children: [_jsx(NativeRichMediaCoverImg, {
+      url: block.image,
+      position: "absolute",
+      inset: true,
+      backgroundColor: "#1A1A1E"
+    }), _jsx(GradientOverlay, {}), _jsxs(TextBlock, {
+      "$bottom": PT.SAFE_BOTTOM + 28,
+      children: [block.title && _jsx(NativeRichMediaPtLabel, {
+        value: block.title,
+        size: 30,
+        weight: 700,
+        fallbackColor: "#FFFFFF"
+      }), block.message && _jsx(NativeRichMediaPtLabel, {
+        value: block.message,
+        size: 16,
+        weight: 400,
+        fallbackColor: "rgba(255,255,255,0.85)",
+        align: "left",
+        marginTop: block.title ? 8 : undefined
+      }), hasButtons && _jsx(NativeRichMediaOverlayButtons, {
+        buttons: block.buttons
+      })]
+    }), block.showClose !== false && _jsx(NativeRichMediaCloseChip, {
+      top: PT.SAFE_TOP + 12,
+      right: 16
+    })]
+  });
+}

package/NativeRichMediaPreview/views/NativeRichMediaFullscreenView/index.d.ts

@@ -0,0 +1 @@
+export { NativeRichMediaFullscreenView } from './NativeRichMediaFullscreenView';

package/NativeRichMediaPreview/views/NativeRichMediaFullscreenView/index.js

@@ -0,0 +1 @@
+export { NativeRichMediaFullscreenView } from './NativeRichMediaFullscreenView';

package/NativeRichMediaPreview/views/NativeRichMediaFullscreenView/styles.d.ts

@@ -0,0 +1 @@
+export { GradientOverlay, TextBlock } from '../shared/styles';

package/NativeRichMediaPreview/views/NativeRichMediaFullscreenView/styles.js

@@ -0,0 +1 @@
+export { GradientOverlay, TextBlock } from '../shared/styles';

package/NativeRichMediaPreview/views/NativeRichMediaFullscreenView/types.d.ts

@@ -0,0 +1,4 @@
+import type { NativeRichMediaFullscreenBlock } from '../../types';
+export type NativeRichMediaFullscreenViewProps = {
+    block: NativeRichMediaFullscreenBlock;
+};

package/NativeRichMediaPreview/views/NativeRichMediaFullscreenView/types.js

@@ -0,0 +1 @@
+export {};

package/NativeRichMediaPreview/views/NativeRichMediaInvalidView/NativeRichMediaInvalidView.d.ts

@@ -0,0 +1,2 @@
+import { type ReactElement } from 'react';
+export declare function NativeRichMediaInvalidView(): ReactElement;

package/NativeRichMediaPreview/views/NativeRichMediaInvalidView/NativeRichMediaInvalidView.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Placeholder } from './styles';
+import { Lang } from '../../polyglot';
+export function NativeRichMediaInvalidView() {
+  return _jsx(Placeholder, {
+    children: _jsx(Lang, {
+      message: "DUMB.NATIVE_RICH_MEDIA_PREVIEW.INVALID_CONFIG"
+    })
+  });
+}

package/NativeRichMediaPreview/views/NativeRichMediaInvalidView/index.d.ts

@@ -0,0 +1 @@
+export { NativeRichMediaInvalidView } from './NativeRichMediaInvalidView';