@maestro_io/maestro-web-sdk 5.1.2 → 5.2.1

package/dist/src/modules/fox/multi-view/view/components/curated-multiview-card/CuratedMultiviewCard.d.ts

@@ -0,0 +1,101 @@
+/// <reference types="prop-types" />
+import React from 'react';
+import './CuratedMultiviewCard.style.css';
+import { WithFocusableProps } from '@/external/spatial-navigation';
+import { CuratedMultiviewListing } from '../../../types';
+export type CuratedMultiviewCardProps = {
+    listings: CuratedMultiviewListing[];
+    selected: boolean;
+};
+declare const _default: {
+    new (props: (CuratedMultiviewCardProps & WithFocusableProps) | Readonly<CuratedMultiviewCardProps & WithFocusableProps>): {
+        state: import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState;
+        navigation: import("../../../../../../external/spatial-navigation/spatialNavigation").default;
+        getChildContext(): {
+            parentFocusKey: string;
+        };
+        setFocus: (focusKey: string) => void;
+        navigateByDirection: (direction: import("../../../../../../external/spatial-navigation/utils").Direction, details?: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        stealFocus: () => void;
+        onUpdateFocus: (focused: boolean) => void;
+        onUpdateHasFocusedChild: (hasFocusedChild: boolean) => void;
+        onEnterPressHandler: (details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onClickPressHandler: (details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onEnterReleaseHandler: () => void;
+        onBackPressHandler: (details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onArrowPressHandler: (direction: import("../../../../../../external/spatial-navigation/utils").Direction, details: import("../../../../../../external/spatial-navigation/utils").Details) => boolean | void;
+        onBecameFocusedHandler: (layout: import("../../../../../../external/spatial-navigation/utils").Layout, details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onBecameBlurredHandler: (layout: import("../../../../../../external/spatial-navigation/utils").Layout, details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        componentDidMount(): void;
+        componentDidUpdate(): void;
+        componentWillUnmount(): void;
+        render(): React.ReactElement<CuratedMultiviewCardProps & WithFocusableProps, string | React.JSXElementConstructor<any>>;
+        context: any;
+        setState<K extends keyof import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>(state: import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState | ((prevState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, props: Readonly<CuratedMultiviewCardProps & WithFocusableProps>) => import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState | Pick<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null) | Pick<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<CuratedMultiviewCardProps & WithFocusableProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        shouldComponentUpdate?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, prevState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>): any;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+    };
+    new (props: CuratedMultiviewCardProps & WithFocusableProps, context: any): {
+        state: import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState;
+        navigation: import("../../../../../../external/spatial-navigation/spatialNavigation").default;
+        getChildContext(): {
+            parentFocusKey: string;
+        };
+        setFocus: (focusKey: string) => void;
+        navigateByDirection: (direction: import("../../../../../../external/spatial-navigation/utils").Direction, details?: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        stealFocus: () => void;
+        onUpdateFocus: (focused: boolean) => void;
+        onUpdateHasFocusedChild: (hasFocusedChild: boolean) => void;
+        onEnterPressHandler: (details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onClickPressHandler: (details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onEnterReleaseHandler: () => void;
+        onBackPressHandler: (details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onArrowPressHandler: (direction: import("../../../../../../external/spatial-navigation/utils").Direction, details: import("../../../../../../external/spatial-navigation/utils").Details) => boolean | void;
+        onBecameFocusedHandler: (layout: import("../../../../../../external/spatial-navigation/utils").Layout, details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        onBecameBlurredHandler: (layout: import("../../../../../../external/spatial-navigation/utils").Layout, details: import("../../../../../../external/spatial-navigation/utils").Details) => void;
+        componentDidMount(): void;
+        componentDidUpdate(): void;
+        componentWillUnmount(): void;
+        render(): React.ReactElement<CuratedMultiviewCardProps & WithFocusableProps, string | React.JSXElementConstructor<any>>;
+        context: any;
+        setState<K extends keyof import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>(state: import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState | ((prevState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, props: Readonly<CuratedMultiviewCardProps & WithFocusableProps>) => import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState | Pick<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null) | Pick<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState, K> | null, callback?: (() => void) | undefined): void;
+        forceUpdate(callback?: (() => void) | undefined): void;
+        readonly props: Readonly<CuratedMultiviewCardProps & WithFocusableProps> & Readonly<{
+            children?: React.ReactNode;
+        }>;
+        refs: {
+            [key: string]: React.ReactInstance;
+        };
+        shouldComponentUpdate?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): boolean;
+        componentDidCatch?(error: Error, errorInfo: React.ErrorInfo): void;
+        getSnapshotBeforeUpdate?(prevProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, prevState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>): any;
+        componentWillMount?(): void;
+        UNSAFE_componentWillMount?(): void;
+        componentWillReceiveProps?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextContext: any): void;
+        UNSAFE_componentWillReceiveProps?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextContext: any): void;
+        componentWillUpdate?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+        UNSAFE_componentWillUpdate?(nextProps: Readonly<CuratedMultiviewCardProps & WithFocusableProps>, nextState: Readonly<import("../../../../../../external/spatial-navigation/withFocusable").WithFocusableState>, nextContext: any): void;
+    };
+    contextTypes: {
+        parentFocusKey: import("prop-types").Requireable<string>;
+    };
+    childContextTypes: {
+        parentFocusKey: import("prop-types").Requireable<string>;
+    };
+    contextType?: React.Context<any> | undefined;
+};
+export default _default;

package/dist/src/modules/fox/multi-view/view/components/curated-multiview-card/CuratedMultiviewCard.js

@@ -0,0 +1,41 @@
+import React from 'react';
+import './CuratedMultiviewCard.style.css';
+import { withFocusable, } from '@/external/spatial-navigation';
+import Icon from '@/components/atoms/SvgIcon';
+function getScreenDetails(listings) {
+    const imageLists = [];
+    const descriptionLists = [];
+    listings.forEach((listing) => {
+        if (listing.backgroundImage)
+            imageLists.push({ id: listing.id, image: listing.backgroundImage });
+        if (listing.description)
+            descriptionLists.push({
+                id: listing.id,
+                description: listing.description,
+            });
+    });
+    return {
+        imageLists,
+        descriptionLists,
+    };
+}
+const StreamScreen = ({ screenDetails }) => {
+    const { imageLists, descriptionLists } = screenDetails;
+    return (React.createElement(React.Fragment, null,
+        React.createElement("div", { className: "curated-multiview-screen" },
+            React.createElement("div", null,
+                React.createElement("div", null, imageLists.map((imageList) => (React.createElement("img", { key: imageList.id, src: imageList.image, alt: imageList.id })))))),
+        React.createElement("div", { className: "curated-multiview-screen-description" }, descriptionLists.map((descriptionList) => (React.createElement("span", { key: descriptionList.id }, descriptionList.description))))));
+};
+const CuratedMultiviewCard = (props) => {
+    const { listings, selected, focused } = props;
+    const screenDetails = getScreenDetails(listings);
+    return (React.createElement("div", { className: "curated-multiview-card focus-ring", "data-focused": focused },
+        React.createElement("div", { className: "curated-multiview-card-row" },
+            React.createElement("div", { className: "curated-multiview-card-cell curated-multiview-card-cell-screens" },
+                React.createElement("div", { className: "curated-multiview-screens-container" },
+                    React.createElement(StreamScreen, { screenDetails: screenDetails }))),
+            React.createElement("div", { className: "curated-multiview-card-cell curated-multiview-card-cell-radio" },
+                React.createElement("div", { className: "curated-multiview-radio", "data-selected": selected }, selected && React.createElement(Icon, { iconName: "checkmark", width: 22.5, height: 22 }))))));
+};
+export default withFocusable()(CuratedMultiviewCard);

package/dist/src/modules/fox/multi-view/view/components/curated-multiview-card/index.d.ts

@@ -0,0 +1,2 @@
+import CuratedMultiviewCard from './CuratedMultiviewCard';
+export default CuratedMultiviewCard;

package/dist/src/modules/fox/multi-view/view/components/curated-multiview-card/index.js

@@ -0,0 +1,2 @@
+import CuratedMultiviewCard from './CuratedMultiviewCard';
+export default CuratedMultiviewCard;

package/dist/src/modules/fox/multi-view/view-model/MultiViewViewModel.d.ts

@@ -0,0 +1,84 @@
+import { ViewModel } from '@/view-models/ViewModel';
+import { Observable } from '@/helpers/Observable';
+import { CuratedMultiviewListing, CustomMultiviewStream, MultiViewLayout } from '../types';
+import IMaestroEventDelegate from '@/interfaces/IMaestroEventDelegate';
+import { CuratedMultiviewResponse, MultiViewListingRequest } from '../services/MultiViewService';
+import AnalyticsService from '@/services/AnalyticsService/AnalyticsService';
+export type CuratedMultiviewItem = {
+    id: string;
+    isSelected: boolean;
+    listings: CuratedMultiviewListing[];
+};
+export type CuratedMultiviewsItem = {
+    type: 'curated-multiviews';
+    items: CuratedMultiviewItem[];
+};
+export type BuildYourOwnItem = {
+    type: 'build-your-own';
+    streams: CustomMultiviewStream[];
+};
+export type MultiviewItem = CuratedMultiviewsItem | BuildYourOwnItem;
+export declare class MultiViewViewModel extends ViewModel {
+    private _layouts;
+    private _isPolling;
+    private service;
+    private delegate;
+    private eventId;
+    private analyticsService;
+    isDataLoading: Observable<boolean>;
+    private pollingTask;
+    private pollingInterval;
+    items: Observable<MultiviewItem[]>;
+    private hasEverSuccessfullyLoaded;
+    private onAuthError?;
+    private _selectedLayoutId;
+    private lastResponseHash;
+    constructor(eventId: string, delegate: IMaestroEventDelegate, analyticsService: AnalyticsService);
+    getLayouts(): MultiViewLayout[];
+    getIsPolling(): Observable<boolean>;
+    getIsDataLoading(): Observable<boolean>;
+    getEventId(): string;
+    private updateBuildYourOwnItem;
+    private calculateElapsedTime;
+    private buildStreamsFromItems;
+    private mergeStreams;
+    getLayoutsObservable(): Observable<MultiViewLayout[]>;
+    getSelectedLayoutId(): Observable<string | null>;
+    onSelectLayout(layoutId: string): void;
+    onToggleCamera(streamId: string, cameraId: string): void;
+    /**
+     * Notify client app about a Product API auth error.
+     * Uses configured callback first, and falls back to onPanelEvent.
+     */
+    private notifyProductAPIUnauthorized;
+    private trackPanelView;
+    init(): Promise<void>;
+    fetchLayouts(): Promise<void>;
+    setDataToPanel(data: Record<string, any>): Promise<void>;
+    onSelectCustomMultiview(params: MultiViewListingRequest): Promise<void>;
+    /**
+     * Clean up resources when the ViewModel is no longer needed
+     */
+    cleanup(): void;
+    /**
+     * Called when a curated multiview is selected. Notifies the client via onPanelEvent
+     * so the app can switch the video player to the selected multiview.
+     */
+    onSelectCuratedMultiview(item: CuratedMultiviewItem): void;
+    /**
+     * @description Update polling interval from panel config.
+     * Refresh polling if necessary.
+     */
+    private updatePollingInterval;
+    private getPanelConfigInterval;
+    /**
+     * Stop polling for multiview data
+     */
+    stopPolling(): void;
+    /**
+     * Refresh polling for curated multiviews
+     */
+    refreshPolling(): void;
+    processCuratedMultiviewData(data: CuratedMultiviewResponse): void;
+    clearTabLoadFailure(): Promise<void>;
+}