@kepler.gl/components 3.3.0-alpha.3 → 3.3.0-alpha.5

package/dist/modals/globe-export-video-container.d.ts

@@ -0,0 +1,117 @@
+import React, { Component } from 'react';
+import { DeckAdapter, FormatConfigs, Timecode } from '@hubble.gl/core';
+import type { DeckProps, MapViewState } from '@deck.gl/core';
+import { GlobeExportVideoPreview } from './globe-export-video-preview';
+export type GlobeExportVideoSettings = {
+    mediaType?: string;
+    cameraPreset?: string;
+    fileName?: string;
+    resolution?: string;
+    durationMs?: number;
+};
+type GlobeExportVideoPanelContainerProps = {
+    initialState?: Partial<GlobeExportVideoPanelContainerState>;
+    glContext?: WebGL2RenderingContext;
+    exportVideoWidth: number;
+    handleClose: () => void;
+    mapData: any;
+    header: boolean;
+    deckProps?: DeckProps;
+    mapProps: Record<string, any>;
+    defaultFileName: string;
+    animatableFilters: any;
+    onTripFrameUpdate: (value: any) => void;
+    onFilterFrameUpdate: (filterIdx: number, name: string, value: any) => void;
+    getTimeRangeFilterKeyframes: (args: any) => any;
+    onSettingsChange: (settings: GlobeExportVideoSettings) => void;
+};
+type GlobeExportVideoPanelContainerState = {
+    adapter?: DeckAdapter;
+    durationMs: number;
+    mediaType: string;
+    cameraPreset: string;
+    fileName: string;
+    resolution: string;
+    viewState?: MapViewState;
+    rendering: boolean;
+    previewing: boolean;
+    saving: boolean;
+    currentTimeMs: number;
+    memo?: {
+        viewState: MapViewState;
+    };
+};
+/**
+ * Video export container for globe mode.
+ *
+ * hubble's built-in ExportVideoPanelContainer only drives its frame-capture
+ * loop from the mapbox base map's 'render' event; in globe mode the base map is
+ * disabled so that loop never fires and the export hangs. This container mirrors
+ * the swipe-export approach: it owns a requestAnimationFrame capture loop and
+ * reads the globe deck canvas directly, so recording works without a base map.
+ */
+export declare class GlobeExportVideoPanelContainer extends Component<GlobeExportVideoPanelContainerProps, GlobeExportVideoPanelContainerState> {
+    previewRef: React.RefObject<GlobeExportVideoPreview | null>;
+    animationFrameId: number | null;
+    activeEncoder: any | null;
+    compositeCanvas: HTMLCanvasElement | null;
+    constructor(props: GlobeExportVideoPanelContainerProps);
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    getFileName(): string;
+    getCanvasSize(): {
+        width: number;
+        height: number;
+    };
+    _getContainer(): {
+        height: number;
+        width: number;
+    };
+    getFormatConfigs(): Partial<FormatConfigs>;
+    getTimecode(): Timecode;
+    getEncoder(): any;
+    getCameraKeyframes(): {
+        timings: number[];
+        keyframes: MapViewState[];
+        easings: import("popmotion").Easing[];
+        width: number;
+        height: number;
+    };
+    getFilterKeyframes(): {
+        filters: any;
+        filterKeyframes: any;
+    } | {
+        filters?: undefined;
+        filterKeyframes?: undefined;
+    };
+    getTripKeyframes(): {
+        animationConfig: any;
+        tripKeyframe: {
+            timings: number[];
+        };
+    } | {
+        animationConfig?: undefined;
+        tripKeyframe?: undefined;
+    };
+    setViewState: (viewState: MapViewState) => void;
+    /** CSS background color (area the globe doesn't cover), from globe config. */
+    getBackgroundColor(): string;
+    setStateAndNotify(update: GlobeExportVideoSettings): void;
+    setMediaType: (mediaType: string) => void;
+    setCameraPreset: (cameraPreset: string) => void;
+    setFileName: (fileName: string) => void;
+    setResolution: (resolution: string) => void;
+    setDuration: (durationMs: number) => void;
+    /** Preview playback — animate the camera without encoding. */
+    onPreviewVideo: () => void;
+    /**
+     * Record — drive our own capture loop (hubble's built-in loop never fires
+     * without a base map) and encode the globe deck canvas frame by frame.
+     */
+    onRenderVideo: () => void;
+    onStop: ({ abort }?: {
+        abort?: boolean;
+    }) => void;
+    render(): React.JSX.Element;
+}
+export {};