@midscene/playground-app 1.7.6 → 1.7.7-beta-20260428102047.0

package/dist/es/PreviewRenderer.mjs

@@ -13,7 +13,7 @@ function isNonLocalhostHttp() {
         return false;
     }
 }
-function PreviewRenderer({ connectingOverlay, onScrcpyStatusChange, renderErrorOverlay, playgroundSDK, runtimeInfo, serverUrl, serverOnline, isUserOperating }) {
+function PreviewRenderer({ connectingOverlay, onScrcpyStatusChange, renderErrorOverlay, scrcpyViewportStyle, screenshotViewerMode, playgroundSDK, runtimeInfo, serverUrl, serverOnline, isUserOperating }) {
     const previewConnection = resolvePreviewConnectionInfo(runtimeInfo, serverUrl);
     const scrcpyAvailable = 'scrcpy' === previewConnection.type && WebCodecsVideoDecoder.isSupported;
     const useScreenshot = 'screenshot' === previewConnection.type || 'scrcpy' === previewConnection.type && !scrcpyAvailable;
@@ -122,13 +122,15 @@ function PreviewRenderer({ connectingOverlay, onScrcpyStatusChange, renderErrorO
                 deviceId: previewConnection.deviceId,
                 onStatusChange: onScrcpyStatusChange,
                 renderErrorOverlay: renderErrorOverlay,
-                serverUrl: previewConnection.scrcpyUrl
+                serverUrl: previewConnection.scrcpyUrl,
+                viewportStyle: scrcpyViewportStyle
             }) : /*#__PURE__*/ jsx(ScreenshotViewer, {
                 getScreenshot: ()=>useScreenshot ? playgroundSDK.getScreenshot() : Promise.resolve(null),
                 getInterfaceInfo: ()=>playgroundSDK.getInterfaceInfo(),
                 serverOnline: serverOnline,
                 isUserOperating: isUserOperating,
-                mjpegUrl: previewConnection.mjpegUrl
+                mjpegUrl: previewConnection.mjpegUrl,
+                mode: screenshotViewerMode
             })
         ]
     });

package/dist/es/ScrcpyPanel.mjs

@@ -75,7 +75,7 @@ function _object_spread_props(target, source) {
     return target;
 }
 const { Text } = Typography;
-function ScrcpyPanel({ connectingOverlay, deviceId, onStatusChange, renderErrorOverlay, serverUrl, metadataTimeoutMs = SCRCPY_METADATA_TIMEOUT_MS, reconnectInterval = 3000 }) {
+function ScrcpyPanel({ connectingOverlay, deviceId, onStatusChange, renderErrorOverlay, serverUrl, metadataTimeoutMs = SCRCPY_METADATA_TIMEOUT_MS, reconnectInterval = 3000, viewportStyle }) {
     const canvasStageRef = useRef(null);
     const socketRef = useRef(null);
     const decoderRef = useRef(null);
@@ -302,7 +302,7 @@ function ScrcpyPanel({ connectingOverlay, deviceId, onStatusChange, renderErrorO
                 description: errorMessage
             }) : null,
             /*#__PURE__*/ jsxs("div", {
-                style: {
+                style: _object_spread({
                     position: 'relative',
                     flex: 1,
                     minHeight: 0,
@@ -312,7 +312,7 @@ function ScrcpyPanel({ connectingOverlay, deviceId, onStatusChange, renderErrorO
                     background: '#111827',
                     borderRadius: 8,
                     overflow: 'hidden'
-                },
+                }, viewportStyle),
                 children: [
                     /*#__PURE__*/ jsx("div", {
                         ref: canvasStageRef,

package/dist/es/SessionSetupPanel.mjs

@@ -129,6 +129,13 @@ function SessionSetupPanel({ form, sessionSetup, sessionSetupError, sessionViewS
                     description: sessionSetupError,
                     className: "session-setup-alert"
                 }) : null,
+                (null == sessionSetup ? void 0 : sessionSetup.notice) ? /*#__PURE__*/ jsx(Alert, {
+                    type: sessionSetup.notice.type,
+                    showIcon: true,
+                    message: sessionSetup.notice.message,
+                    description: sessionSetup.notice.description,
+                    className: "session-setup-alert"
+                }) : null,
                 /*#__PURE__*/ jsxs(Form, {
                     form: form,
                     layout: "vertical",

package/dist/lib/PreviewRenderer.js

@@ -41,7 +41,7 @@ function isNonLocalhostHttp() {
         return false;
     }
 }
-function PreviewRenderer({ connectingOverlay, onScrcpyStatusChange, renderErrorOverlay, playgroundSDK, runtimeInfo, serverUrl, serverOnline, isUserOperating }) {
+function PreviewRenderer({ connectingOverlay, onScrcpyStatusChange, renderErrorOverlay, scrcpyViewportStyle, screenshotViewerMode, playgroundSDK, runtimeInfo, serverUrl, serverOnline, isUserOperating }) {
     const previewConnection = (0, external_runtime_info_js_namespaceObject.resolvePreviewConnectionInfo)(runtimeInfo, serverUrl);
     const scrcpyAvailable = 'scrcpy' === previewConnection.type && scrcpy_decoder_webcodecs_namespaceObject.WebCodecsVideoDecoder.isSupported;
     const useScreenshot = 'screenshot' === previewConnection.type || 'scrcpy' === previewConnection.type && !scrcpyAvailable;
@@ -150,13 +150,15 @@ function PreviewRenderer({ connectingOverlay, onScrcpyStatusChange, renderErrorO
                 deviceId: previewConnection.deviceId,
                 onStatusChange: onScrcpyStatusChange,
                 renderErrorOverlay: renderErrorOverlay,
-                serverUrl: previewConnection.scrcpyUrl
+                serverUrl: previewConnection.scrcpyUrl,
+                viewportStyle: scrcpyViewportStyle
             }) : /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(visualizer_namespaceObject.ScreenshotViewer, {
                 getScreenshot: ()=>useScreenshot ? playgroundSDK.getScreenshot() : Promise.resolve(null),
                 getInterfaceInfo: ()=>playgroundSDK.getInterfaceInfo(),
                 serverOnline: serverOnline,
                 isUserOperating: isUserOperating,
-                mjpegUrl: previewConnection.mjpegUrl
+                mjpegUrl: previewConnection.mjpegUrl,
+                mode: screenshotViewerMode
             })
         ]
     });

package/dist/lib/ScrcpyPanel.js

@@ -103,7 +103,7 @@ function _object_spread_props(target, source) {
     return target;
 }
 const { Text } = external_antd_namespaceObject.Typography;
-function ScrcpyPanel({ connectingOverlay, deviceId, onStatusChange, renderErrorOverlay, serverUrl, metadataTimeoutMs = external_scrcpy_preview_js_namespaceObject.SCRCPY_METADATA_TIMEOUT_MS, reconnectInterval = 3000 }) {
+function ScrcpyPanel({ connectingOverlay, deviceId, onStatusChange, renderErrorOverlay, serverUrl, metadataTimeoutMs = external_scrcpy_preview_js_namespaceObject.SCRCPY_METADATA_TIMEOUT_MS, reconnectInterval = 3000, viewportStyle }) {
     const canvasStageRef = (0, external_react_namespaceObject.useRef)(null);
     const socketRef = (0, external_react_namespaceObject.useRef)(null);
     const decoderRef = (0, external_react_namespaceObject.useRef)(null);
@@ -330,7 +330,7 @@ function ScrcpyPanel({ connectingOverlay, deviceId, onStatusChange, renderErrorO
                 description: errorMessage
             }) : null,
             /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)("div", {
-                style: {
+                style: _object_spread({
                     position: 'relative',
                     flex: 1,
                     minHeight: 0,
@@ -340,7 +340,7 @@ function ScrcpyPanel({ connectingOverlay, deviceId, onStatusChange, renderErrorO
                     background: '#111827',
                     borderRadius: 8,
                     overflow: 'hidden'
-                },
+                }, viewportStyle),
                 children: [
                     /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)("div", {
                         ref: canvasStageRef,

package/dist/lib/SessionSetupPanel.js

@@ -168,6 +168,13 @@ function SessionSetupPanel({ form, sessionSetup, sessionSetupError, sessionViewS
                     description: sessionSetupError,
                     className: "session-setup-alert"
                 }) : null,
+                (null == sessionSetup ? void 0 : sessionSetup.notice) ? /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsx)(external_antd_namespaceObject.Alert, {
+                    type: sessionSetup.notice.type,
+                    showIcon: true,
+                    message: sessionSetup.notice.message,
+                    description: sessionSetup.notice.description,
+                    className: "session-setup-alert"
+                }) : null,
                 /*#__PURE__*/ (0, jsx_runtime_namespaceObject.jsxs)(external_antd_namespaceObject.Form, {
                     form: form,
                     layout: "vertical",

package/dist/types/PlaygroundPreview.d.ts

@@ -1,11 +1,14 @@
 import type { PlaygroundRuntimeInfo, PlaygroundSDK } from '@midscene/playground';
-import type { ReactNode } from 'react';
+import type { ScreenshotViewerMode } from '@midscene/visualizer';
+import type { CSSProperties, ReactNode } from 'react';
 import type { ScrcpyErrorOverlayRenderer } from './ScrcpyPanel';
 import type { ScrcpyPreviewStatus } from './scrcpy-preview';
 export interface PlaygroundPreviewProps {
     connectingOverlay?: ReactNode;
     onScrcpyStatusChange?: (status: ScrcpyPreviewStatus, statusText: string) => void;
     renderErrorOverlay?: ScrcpyErrorOverlayRenderer;
+    scrcpyViewportStyle?: CSSProperties;
+    screenshotViewerMode?: ScreenshotViewerMode;
     playgroundSDK: PlaygroundSDK;
     runtimeInfo: PlaygroundRuntimeInfo | null;
     serverUrl: string;

package/dist/types/PreviewRenderer.d.ts

@@ -1,16 +1,19 @@
 import type { PlaygroundRuntimeInfo, PlaygroundSDK } from '@midscene/playground';
-import type { ReactNode } from 'react';
+import { type ScreenshotViewerMode } from '@midscene/visualizer';
+import type { CSSProperties, ReactNode } from 'react';
 import { type ScrcpyErrorOverlayRenderer } from './ScrcpyPanel';
 import type { ScrcpyPreviewStatus } from './scrcpy-preview';
 interface PreviewRendererProps {
     connectingOverlay?: ReactNode;
     onScrcpyStatusChange?: (status: ScrcpyPreviewStatus, statusText: string) => void;
     renderErrorOverlay?: ScrcpyErrorOverlayRenderer;
+    scrcpyViewportStyle?: CSSProperties;
+    screenshotViewerMode?: ScreenshotViewerMode;
     playgroundSDK: PlaygroundSDK;
     runtimeInfo: PlaygroundRuntimeInfo | null;
     serverUrl: string;
     serverOnline: boolean;
     isUserOperating: boolean;
 }
-export declare function PreviewRenderer({ connectingOverlay, onScrcpyStatusChange, renderErrorOverlay, playgroundSDK, runtimeInfo, serverUrl, serverOnline, isUserOperating, }: PreviewRendererProps): import("react").JSX.Element;
+export declare function PreviewRenderer({ connectingOverlay, onScrcpyStatusChange, renderErrorOverlay, scrcpyViewportStyle, screenshotViewerMode, playgroundSDK, runtimeInfo, serverUrl, serverOnline, isUserOperating, }: PreviewRendererProps): import("react").JSX.Element;
 export {};

package/dist/types/ScrcpyPanel.d.ts

@@ -1,4 +1,4 @@
-import React, { type ReactNode } from 'react';
+import React, { type CSSProperties, type ReactNode } from 'react';
 import { type ScrcpyPreviewStatus } from './scrcpy-preview';
 export interface ScrcpyErrorOverlayContext {
     errorMessage: string | null;
@@ -15,6 +15,7 @@ interface ScrcpyPanelProps {
     serverUrl?: string;
     metadataTimeoutMs?: number;
     reconnectInterval?: number;
+    viewportStyle?: CSSProperties;
 }
-export declare function ScrcpyPanel({ connectingOverlay, deviceId, onStatusChange, renderErrorOverlay, serverUrl, metadataTimeoutMs, reconnectInterval, }: ScrcpyPanelProps): React.JSX.Element;
+export declare function ScrcpyPanel({ connectingOverlay, deviceId, onStatusChange, renderErrorOverlay, serverUrl, metadataTimeoutMs, reconnectInterval, viewportStyle, }: ScrcpyPanelProps): React.JSX.Element;
 export {};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@midscene/playground-app",
-  "version": "1.7.6",
+  "version": "1.7.7-beta-20260428102047.0",
   "description": "Reusable React shell for Midscene playground applications",
   "repository": "https://github.com/web-infra-dev/midscene",
   "homepage": "https://midscenejs.com/",
@@ -28,9 +28,9 @@
     "antd": "^5.21.6",
     "react-resizable-panels": "2.0.22",
     "socket.io-client": "4.8.1",
-    "@midscene/playground": "1.7.6",
-    "@midscene/shared": "1.7.6",
-    "@midscene/visualizer": "1.7.6"
+    "@midscene/shared": "1.7.7-beta-20260428102047.0",
+    "@midscene/visualizer": "1.7.7-beta-20260428102047.0",
+    "@midscene/playground": "1.7.7-beta-20260428102047.0"
   },
   "devDependencies": {
     "@rsbuild/plugin-less": "^1.5.0",