@revenuecat/purchases-ui-js/dist/utils/video-background-host.d.ts

Web components for Paywalls. Powered by RevenueCat

/**
 * Components that mount `BackgroundVideoSurface` apply `rc-{kind}-video-bg` for consistent
 * layering: `.rc-bg-video` z-index 1, `::before` tint z-index 2, content stacks z-index 3.
 */
export type VideoBackgroundHostKind = "stack" | "carousel" | "tabs" | "sheet";
export declare function rcVideoBackgroundHostClass(variant: VideoBackgroundHostKind): string;
export interface VideoBackgroundHostStyleOptions {
    hasVideoBg: boolean;
    /** Clip overflow to the host's box (e.g. rounded-corner clipping). */
    clipOverflow?: boolean;
    /** Establish a positioned ancestor. Skip when surface CSS already positions the host. */
    positionRelative?: boolean;
}
export interface VideoBackgroundHostStyles {
    isolation?: "isolate";
    position?: "relative";
    overflow?: "hidden";
}
/**
 * Inline-style snippet for any host that mounts `BackgroundVideoSurface`. Always sets
 * `isolation: isolate` when there's a video background so the per-kind z-index ladder
 * (`.rc-bg-video` = 1, `::before` overlay = 2, content = 3) sorts inside the host only
 * and can't collide with z-layers outside it. Returns an empty object when inactive so
 * it's safe to spread unconditionally.
 *
 * `positionRelative` and `clipOverflow` stay opt-in because surfaces differ:
 * - Sheet positions itself via stylesheet (`position: absolute`); skip `positionRelative`.
 * - Carousel clips via the child `.carousel-clip` wrapper; skip `clipOverflow`.
 * - Stack/Tabs clip only when corners are rounded; pass `borderRadiusCss !== "0"`.
 */
export declare function videoBackgroundHostStyles(options: VideoBackgroundHostStyleOptions): VideoBackgroundHostStyles;