@kepler.gl/components 3.3.0-alpha.0 → 3.3.0-alpha.10

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

@@ -0,0 +1,119 @@
+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;
+    /** Starfield behind the globe, matching the live map's CSS background. */
+    areStarsEnabled(): boolean;
+    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 {};

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

@@ -0,0 +1,44 @@
+import React, { Component, RefObject } from 'react';
+import type { Deck, DeckProps, MapViewState } from '@deck.gl/core';
+import { DeckAdapter } from '@hubble.gl/core';
+export type GlobeExportVideoPreviewProps = {
+    mapData: any;
+    resolution: [number, number];
+    exportVideoWidth: number;
+    deckProps?: DeckProps;
+    viewState: MapViewState;
+    adapter: DeckAdapter;
+    rendering: boolean;
+    saving: boolean;
+    setViewState: (viewState: MapViewState) => void;
+    durationMs: number;
+    /** CSS color string for the area the globe does not cover. */
+    backgroundColor: string;
+    mapProps?: Record<string, any>;
+    /** Tileable star-field data URL, matching the live globe map CSS background. */
+    starsImage?: string | null;
+};
+/**
+ * Single-canvas video export preview for globe mode.
+ *
+ * hubble's built-in preview cannot be used for globe mode: in its
+ * `disableBaseMap` branch it renders a bare <DeckGL> without a viewState and
+ * never wires up the frame-capture loop (that loop is driven by the mapbox
+ * 'render' event, which does not exist without a base map). This component
+ * renders the globe deck directly with a valid, controlled viewState so the
+ * GlobeView controller initializes correctly (no MapState/GlobeState assert),
+ * stays interactive, and exposes the deck canvas so the parent container can
+ * drive its own capture loop (mirrors the swipe export approach).
+ */
+export declare class GlobeExportVideoPreview extends Component<GlobeExportVideoPreviewProps> {
+    deckRef: RefObject<Deck | null>;
+    _getContainer(): {
+        height: number;
+        width: number;
+    };
+    /** Expose the deck canvas so the parent container can capture frames. */
+    getCanvas(): HTMLCanvasElement | null;
+    /** All layers loaded — used to gate the first capture frame. */
+    areLayersLoaded(): boolean;
+    render(): React.JSX.Element;
+}

package/dist/modals/hubble-utils.d.ts

@@ -0,0 +1,70 @@
+import { type MapViewState } from '@deck.gl/core';
+import { TimeRangeFilter } from '@kepler.gl/types';
+type KeplerState = {
+    visState: any;
+    mapState: any;
+    mapStyle: any;
+};
+type MapboxLayerRef = {
+    id: string;
+} & Record<string, any>;
+/** Device props for export previews that own their canvas and read pixels back off it. */
+export declare const EXPORT_DECK_DEVICE_PROPS: {
+    type: "webgl";
+    webgl: {
+        preserveDrawingBuffer: boolean;
+    };
+    debug: boolean;
+};
+/** Device props for export previews that draw as an overlay on top of a basemap. */
+export declare const EXPORT_OVERLAY_DEVICE_PROPS: {
+    type: "webgl";
+    webgl: {
+        stencil: boolean;
+    };
+    debug: boolean;
+};
+type TimeRangeFilterKeyframes = {
+    keyframes: {
+        value: number | [number, number];
+    }[];
+    easings: (p: number) => number;
+    timings?: number[];
+};
+export declare function getTimeRangeFilterKeyframes({ filter, timings }: {
+    filter: TimeRangeFilter;
+    timings: number[];
+}): TimeRangeFilterKeyframes;
+export declare function getBeforeLayerId(topMapStyle: any, bottomMapStyle: any): MapboxLayerRef | null;
+export declare function getStaticMapProps(keplerState: KeplerState, onViewChange: (viewState: Record<string, any>) => void, mapboxApiAccessToken: string, mapboxApiUrl?: string): Record<string, any>;
+export declare function getHubbleDeckGlProps(keplerState: KeplerState, mapboxApiAccessToken: string, mapboxApiUrl?: string): Record<string, any>;
+/**
+ * Build a fresh set of globe layers (base + data + top) for a given split-map
+ * index. Used by the swipe export preview, which mounts two independent Deck
+ * instances: each side needs its OWN layer instances (deck.gl Layer objects are
+ * stateful and bound to a single Deck) and its own `mapIndex` so the split-map
+ * layer visibility is respected on each half of the swipe.
+ */
+export declare function getGlobeExportLayers(keplerState: KeplerState, { mapIndex, mapboxApiAccessToken, mapboxApiUrl, viewState }: {
+    mapIndex: number;
+    mapboxApiAccessToken?: string;
+    mapboxApiUrl?: string;
+    viewState?: MapViewState;
+}): (import("@kepler.gl/layers").Layer | import("@deck.gl/core").Layer<{}>)[];
+export declare function getAnimatableFilters(keplerState: KeplerState): TimeRangeFilter[];
+export declare function scaleToVideoExport(viewState: MapViewState, container: {
+    width: number;
+    height: number;
+}): MapViewState & {
+    width: number;
+    height: number;
+};
+export declare function parseSetCameraType(strCameraType: string, viewState: MapViewState): MapViewState;
+type Resolution = {
+    value: string;
+    label: string;
+    width: number;
+    height: number;
+};
+export declare function getResolutionSetting(value: string): Resolution;
+export {};

package/dist/modals/hubble-utils.spec.d.ts

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

package/dist/modals/modal-dialog.d.ts

@@ -1,2 +1,2 @@
-declare const ModalDialogFactory: () => import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("../common/modal").ModalDialogOwnProps & Omit<import("react-modal").Props, "className" | "style" | "ariaHideApp"> & import("react").RefAttributes<import("../common/modal").ModalDialog>, never>> & Omit<typeof import("../common/modal").ModalDialog, keyof import("react").Component<any, {}, any>>;
+declare const ModalDialogFactory: () => import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../common/modal").ModalDialogOwnProps & Omit<import("react-modal").Props, "className" | "style" | "ariaHideApp"> & import("react").RefAttributes<import("../common/modal").ModalDialog>, never> & Partial<Pick<import("../common/modal").ModalDialogOwnProps & Omit<import("react-modal").Props, "className" | "style" | "ariaHideApp"> & import("react").RefAttributes<import("../common/modal").ModalDialog>, never>>> & string & Omit<typeof import("../common/modal").ModalDialog, keyof import("react").Component<any, {}, any>>;
 export default ModalDialogFactory;

package/dist/modals/share-map-modal.d.ts

@@ -2,10 +2,8 @@ import React from 'react';
 import { ImageModalContainerProps } from './image-modal-container';
 import { Provider } from '@kepler.gl/cloud-providers';
 import { cleanupExportImage as cleanupExportImageAction } from '@kepler.gl/actions';
-export declare const StyledInputLabel: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<React.DetailedHTMLProps<React.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>>;
-export declare const StyleSharingUrl: import("styled-components").IStyledComponent<"web", import("styled-components/dist/types").FastOmit<import("styled-components/dist/types").FastOmit<import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof React.DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | React.RefObject<HTMLDivElement> | null | undefined;
-}>, never>, never>>;
+export declare const StyledInputLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never> & Partial<Pick<React.DetailedHTMLProps<React.LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, never>>> & string;
+export declare const StyleSharingUrl: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement>> & React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>, "className"> & Partial<Pick<import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, keyof React.ClassAttributes<HTMLDivElement> | keyof React.HTMLAttributes<HTMLDivElement>> & React.ClassAttributes<HTMLDivElement> & React.HTMLAttributes<HTMLDivElement>, "className">>> & string;
 interface SharingUrlProps {
     url: string;
     message?: string;

package/dist/modals/swipe-composite-utils.d.ts

@@ -0,0 +1,10 @@
+export type SwipeEasing = 'linear' | 'ease-in-out';
+/**
+ * Compute the swipe percentage at a given time.
+ */
+export declare function getSwipePercentageAtTime(timeMs: number, durationMs: number, startPct: number, endPct: number, easing?: SwipeEasing): number;
+/**
+ * Composite two canvases (left/right map views) with a swipe divider
+ * into a single output canvas.
+ */
+export declare function compositeSwipeFrame(leftCanvas: HTMLCanvasElement, rightCanvas: HTMLCanvasElement, outputCanvas: HTMLCanvasElement, percentage: number, showDivider?: boolean, backgroundColor?: string, showStars?: boolean): void;

package/dist/modals/swipe-composite-utils.spec.d.ts

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

package/dist/modals/swipe-export-settings.d.ts

@@ -0,0 +1,25 @@
+import React from 'react';
+import { SwipeEasing } from './swipe-composite-utils';
+export type SwipeExportSettingsProps = {
+    durationMs: number;
+    mediaType: string;
+    resolution: string;
+    fileName: string;
+    cameraPreset: string;
+    frameRate: number;
+    onChangeDuration: (value: number) => void;
+    onChangeMediaType: (value: string) => void;
+    onChangeResolution: (value: string) => void;
+    onChangeFileName: (value: string) => void;
+    onChangeCameraPreset: (value: string) => void;
+    swipeStartPct: number;
+    swipeEndPct: number;
+    swipeEasing: SwipeEasing;
+    disabled: boolean;
+    onChangeStartPct: (value: number) => void;
+    onChangeEndPct: (value: number) => void;
+    onChangeEasing: (value: SwipeEasing) => void;
+    hideSwipe?: boolean;
+};
+declare const SwipeExportSettings: React.FC<SwipeExportSettingsProps>;
+export default SwipeExportSettings;

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

@@ -0,0 +1,128 @@
+import React, { Component } from 'react';
+import { DeckAdapter, FormatConfigs, Timecode } from '@hubble.gl/core';
+import type { DeckProps, MapViewState } from '@deck.gl/core';
+import { SwipeExportVideoPreview } from './swipe-export-video-preview';
+import { SwipeEasing } from './swipe-composite-utils';
+export type SwipeExportVideoSettings = {
+    mediaType?: string;
+    cameraPreset?: string;
+    fileName?: string;
+    resolution?: string;
+    durationMs?: number;
+    swipeStartPct?: number;
+    swipeEndPct?: number;
+    swipeEasing?: SwipeEasing;
+};
+type SwipeExportVideoPanelContainerProps = {
+    initialState?: Partial<SwipeExportVideoPanelContainerState>;
+    glContext?: WebGL2RenderingContext;
+    exportVideoWidth: number;
+    handleClose: () => void;
+    mapData: any;
+    header: boolean;
+    deckProps?: DeckProps;
+    mapProps: Record<string, any>;
+    disableBaseMap: boolean;
+    mapboxLayerBeforeId?: string;
+    defaultFileName: string;
+    animatableFilters: any;
+    onTripFrameUpdate: (value: any) => void;
+    onFilterFrameUpdate: (filterIdx: number, name: string, value: any) => void;
+    getTimeRangeFilterKeyframes: (args: any) => any;
+    onSettingsChange: (settings: SwipeExportVideoSettings) => void;
+    swipeStartPct: number;
+    swipeEndPct: number;
+    swipeEasing: SwipeEasing;
+};
+type SwipeExportVideoPanelContainerState = {
+    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;
+    };
+};
+/**
+ * Orchestrates swipe video export recording.
+ * Manages a DeckAdapter but overrides the capture pipeline to
+ * composite left/right canvases with an animated swipe divider.
+ */
+export declare class SwipeExportVideoPanelContainer extends Component<SwipeExportVideoPanelContainerProps, SwipeExportVideoPanelContainerState> {
+    previewRef: React.RefObject<SwipeExportVideoPreview | null>;
+    animationFrameId: number | null;
+    activeEncoder: any | null;
+    constructor(props: SwipeExportVideoPanelContainerProps);
+    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 for globe swipe (the area the globe doesn't cover).
+     * Returns undefined outside globe mode so non-globe swipe keeps its previous
+     * transparent-clear compositing (the opaque base map already fills the frame).
+     */
+    getBackgroundColor(): string | undefined;
+    setStateAndNotify(update: SwipeExportVideoSettings): void;
+    setMediaType: (mediaType: string) => void;
+    setCameraPreset: (cameraPreset: string) => void;
+    setFileName: (fileName: string) => void;
+    setResolution: (resolution: string) => void;
+    setDuration: (durationMs: number) => void;
+    /**
+     * Start a preview playback — animates the swipe without encoding.
+     */
+    onPreviewVideo: () => void;
+    /**
+     * Start actual recording — captures composited frames into the encoder.
+     * Uses a timer-based approach: updates currentTimeMs, waits for the preview
+     * to composite, then captures the composite canvas.
+     */
+    onRenderVideo: () => void;
+    onStop: ({ abort }?: {
+        abort?: boolean;
+    }) => void;
+    render(): React.JSX.Element;
+}
+export {};

package/dist/modals/swipe-export-video-preview.d.ts

@@ -0,0 +1,70 @@
+import React, { Component, RefObject } from 'react';
+import { type MapRef } from 'react-map-gl/maplibre';
+import type { Deck, DeckProps, MapViewState } from '@deck.gl/core';
+import { DeckAdapter } from '@hubble.gl/core';
+import { SwipeEasing } from './swipe-composite-utils';
+export type SwipeExportVideoPreviewProps = {
+    mapData: any;
+    resolution: [number, number];
+    exportVideoWidth: number;
+    disableBaseMap: boolean;
+    deckProps?: DeckProps;
+    viewState: MapViewState;
+    adapter: DeckAdapter;
+    mapboxLayerBeforeId?: string;
+    rendering: boolean;
+    saving: boolean;
+    setViewState: (viewState: MapViewState) => void;
+    durationMs: number;
+    mapProps?: Record<string, any>;
+    swipeStartPct: number;
+    swipeEndPct: number;
+    swipeEasing: SwipeEasing;
+    currentTimeMs: number;
+    backgroundColor?: string;
+};
+type SwipeExportVideoPreviewState = {
+    leftReady: boolean;
+    rightReady: boolean;
+};
+/**
+ * A dual-canvas video export preview that renders left/right split map layers
+ * and composites them with an animated swipe divider.
+ */
+export declare class SwipeExportVideoPreview extends Component<SwipeExportVideoPreviewProps, SwipeExportVideoPreviewState> {
+    leftMapRef: RefObject<MapRef | null>;
+    rightMapRef: RefObject<MapRef | null>;
+    leftDeckRef: RefObject<Deck | null>;
+    rightDeckRef: RefObject<Deck | null>;
+    compositeCanvasRef: RefObject<HTMLCanvasElement | null>;
+    constructor(props: SwipeExportVideoPreviewProps);
+    componentDidUpdate(prevProps: SwipeExportVideoPreviewProps): void;
+    _resizeVideo(): void;
+    _setDevicePixelRatio(devicePixelRatio: number): void;
+    _getContainer(): {
+        height: number;
+        width: number;
+    };
+    _getCurrentSwipePercentage(): number;
+    _getLeftCanvas(): HTMLCanvasElement | null;
+    _getRightCanvas(): HTMLCanvasElement | null;
+    _compositeFrame(): void;
+    /**
+     * Called by the parent container's adapter after each render.
+     * We need both maps to be loaded before compositing and capturing.
+     */
+    onAfterRender: (proceedToNextFrame: () => void) => void;
+    _areLayersLoaded(side: 'left' | 'right'): boolean;
+    /**
+     * Get the composited canvas element for video capture.
+     */
+    getCompositeCanvas(): HTMLCanvasElement | null;
+    _createLayers(mapIndex: number, beforeId?: string): any;
+    _onLeftMapLoad: () => void;
+    _onRightMapLoad: () => void;
+    _tryComposite(): void;
+    _onDeckRender: (side: "left" | "right") => void;
+    _renderMapCanvas(side: 'left' | 'right', mapIndex: number): React.JSX.Element;
+    render(): React.JSX.Element;
+}
+export {};

package/dist/modals/tilesets-modals/tileset-bitmap-form.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { BitmapBounds } from '@kepler.gl/constants';
+import { MetaResponse, DatasetCreationAttributes } from './common';
+type BitmapFormProps = {
+    setResponse: (response: MetaResponse) => void;
+};
+export declare function getDatasetAttributesFromBitmap({ name, imageUrl, bounds, isDataUri }: {
+    name: string;
+    imageUrl: string;
+    bounds: BitmapBounds;
+    isDataUri?: boolean;
+}): DatasetCreationAttributes;
+declare const TilesetBitmapForm: React.FC<BitmapFormProps>;
+export default TilesetBitmapForm;

package/dist/notification-panel/notification-item.d.ts

@@ -11,57 +11,5 @@ interface NotificationItemProps {
     removeNotification?: ActionHandler<typeof removeNotificationActions>;
     theme?: any;
 }
-export default function NotificationItemFactory(): {
-    new (props: NotificationItemProps): {
-        state: {
-            isExpanded: boolean;
-        };
-        componentDidMount(): void;
-        render(): React.JSX.Element;
-        context: unknown;
-        setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<NotificationItemProps>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
-        forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<NotificationItemProps>;
-        refs: {
-            [key: string]: React.ReactInstance;
-        };
-        shouldComponentUpdate?(nextProps: Readonly<NotificationItemProps>, nextState: Readonly<{}>, nextContext: any): boolean;
-        componentWillUnmount?(): void;
-        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
-        getSnapshotBeforeUpdate?(prevProps: Readonly<NotificationItemProps>, prevState: Readonly<{}>): any;
-        componentDidUpdate?(prevProps: Readonly<NotificationItemProps>, prevState: Readonly<{}>, snapshot?: any): void;
-        componentWillMount?(): void;
-        UNSAFE_componentWillMount?(): void;
-        componentWillReceiveProps?(nextProps: Readonly<NotificationItemProps>, nextContext: any): void;
-        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<NotificationItemProps>, nextContext: any): void;
-        componentWillUpdate?(nextProps: Readonly<NotificationItemProps>, nextState: Readonly<{}>, nextContext: any): void;
-        UNSAFE_componentWillUpdate?(nextProps: Readonly<NotificationItemProps>, nextState: Readonly<{}>, nextContext: any): void;
-    };
-    new (props: NotificationItemProps, context: any): {
-        state: {
-            isExpanded: boolean;
-        };
-        componentDidMount(): void;
-        render(): React.JSX.Element;
-        context: unknown;
-        setState<K extends never>(state: {} | ((prevState: Readonly<{}>, props: Readonly<NotificationItemProps>) => {} | Pick<{}, K> | null) | Pick<{}, K> | null, callback?: (() => void) | undefined): void;
-        forceUpdate(callback?: (() => void) | undefined): void;
-        readonly props: Readonly<NotificationItemProps>;
-        refs: {
-            [key: string]: React.ReactInstance;
-        };
-        shouldComponentUpdate?(nextProps: Readonly<NotificationItemProps>, nextState: Readonly<{}>, nextContext: any): boolean;
-        componentWillUnmount?(): void;
-        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
-        getSnapshotBeforeUpdate?(prevProps: Readonly<NotificationItemProps>, prevState: Readonly<{}>): any;
-        componentDidUpdate?(prevProps: Readonly<NotificationItemProps>, prevState: Readonly<{}>, snapshot?: any): void;
-        componentWillMount?(): void;
-        UNSAFE_componentWillMount?(): void;
-        componentWillReceiveProps?(nextProps: Readonly<NotificationItemProps>, nextContext: any): void;
-        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<NotificationItemProps>, nextContext: any): void;
-        componentWillUpdate?(nextProps: Readonly<NotificationItemProps>, nextState: Readonly<{}>, nextContext: any): void;
-        UNSAFE_componentWillUpdate?(nextProps: Readonly<NotificationItemProps>, nextState: Readonly<{}>, nextContext: any): void;
-    };
-    contextType?: React.Context<any> | undefined;
-};
+export default function NotificationItemFactory(): ({ notification, removeNotification, isExpanded: initialIsExpanded, theme }: NotificationItemProps) => React.JSX.Element;
 export {};

package/dist/notification-panel.d.ts

@@ -6,7 +6,7 @@ interface NotificationPanelProps {
     removeNotification?: typeof removeNotification;
     notifications: Notifications[];
 }
-declare function NotificationPanelFactory(NotificationItem: ReturnType<typeof NotificationItemFactory>): React.ComponentClass<NotificationPanelProps>;
+declare function NotificationPanelFactory(NotificationItem: ReturnType<typeof NotificationItemFactory>): React.FC<NotificationPanelProps>;
 declare namespace NotificationPanelFactory {
     var deps: (typeof NotificationItemFactory)[];
 }

package/dist/remote-dataset-refresh-controller.d.ts

@@ -0,0 +1,11 @@
+import { Datasets } from '@kepler.gl/table';
+type RemoteDatasetRefreshControllerProps = {
+    datasets: Datasets;
+    refreshDataset?: (dataId: string) => void;
+};
+/**
+ * Polls remotely hosted datasets that have metadata.refreshIntervalMs set.
+ * Lives on KeplerGl so polling continues when the side panel is closed.
+ */
+export default function RemoteDatasetRefreshController({ datasets, refreshDataset }: RemoteDatasetRefreshControllerProps): null;
+export {};

package/dist/side-panel/common/dataset-info.d.ts

@@ -1,11 +1,21 @@
 import React from 'react';
 import { DataContainerInterface } from '@kepler.gl/utils';
+import { VisStateActions, ActionHandler } from '@kepler.gl/actions';
 type MiniDataset = {
+    id: string;
     dataContainer: DataContainerInterface;
     type?: string;
+    metadata?: {
+        refreshIntervalMs?: number;
+        refreshStatus?: string;
+        refreshProgress?: number;
+    };
 };
 export type DatasetInfoProps = {
     dataset: MiniDataset;
+    showRefreshSettings?: boolean;
+    refreshDataset?: ActionHandler<typeof VisStateActions.refreshDataset>;
+    updateDatasetProps?: ActionHandler<typeof VisStateActions.updateDatasetProps>;
 };
 export default function DatasetInfoFactory(): React.FC<DatasetInfoProps>;
 export {};

package/dist/side-panel/common/dataset-refresh-progress.d.ts

@@ -0,0 +1,11 @@
+import React from 'react';
+export type DatasetRefreshProgressIconProps = {
+    /** Download progress from 0–100. Omit or 0 for an indeterminate spinner. */
+    percent?: number;
+    size?: number;
+};
+/**
+ * Circular refresh indicator: spinning arc while size is unknown, filling ring
+ * when Content-Length is available.
+ */
+export default function DatasetRefreshProgressIcon({ percent, size }: DatasetRefreshProgressIconProps): React.JSX.Element;

package/dist/side-panel/common/dataset-title.d.ts

@@ -7,6 +7,10 @@ type MiniDataset = {
     color: RGBColor;
     label?: string;
     disableDataOperation?: boolean;
+    type?: string;
+    metadata?: {
+        refreshError?: string;
+    };
 };
 export type DatasetTitleProps = {
     dataset: MiniDataset;
@@ -15,6 +19,7 @@ export type DatasetTitleProps = {
     showDatasetTable?: ActionHandler<typeof VisStateActions.showDatasetTable>;
     updateTableColor: ActionHandler<typeof VisStateActions.updateTableColor>;
     removeDataset?: ActionHandler<typeof openDeleteModal>;
+    onToggleRefreshSettings?: () => void;
 };
 declare function DatasetTitleFactory(DatasetTag: ReturnType<typeof DatasetTagFactory>): React.FC<DatasetTitleProps>;
 declare namespace DatasetTitleFactory {