@midscene/visualizer 0.28.7-beta-20250915040112.0 → 0.28.7-beta-20250915133700.0

package/dist/es/component/history-selector/index.css

@@ -1,9 +1,26 @@
+.history-modal-overlay {
+  z-index: 1000;
+  background: rgba(0, 0, 0, .45);
+  justify-content: stretch;
+  align-items: flex-end;
+  display: flex;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+}
+
 .history-modal-container {
+  z-index: 1001;
+  background: #fff;
   border-radius: 12px 12px 0 0;
   flex-direction: column;
-  height: 70vh;
+  width: 100%;
+  height: 400px;
   display: flex;
   overflow: hidden;
+  box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
 }
 
 .history-modal-container .history-modal-header {
@@ -114,19 +131,3 @@
   padding: 40px 20px;
 }
 
-.ant-modal-wrap .ant-modal-content {
-  animation: .3s cubic-bezier(.4, 0, .2, 1) forwards slideUpFromBottom !important;
-}
-
-@keyframes slideUpFromBottom {
-  0% {
-    opacity: 0;
-    transform: translateY(100%);
-  }
-
-  100% {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-

package/dist/es/component/history-selector/index.mjs

@@ -1,5 +1,5 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { Button, Input, Modal, Typography } from "antd";
+import { Button, Input, Typography } from "antd";
 import { useMemo, useState } from "react";
 import icons_close from "../../icons/close.mjs";
 import icons_history from "../../icons/history.mjs";
@@ -63,50 +63,12 @@ const HistorySelector = (param)=>{
                     height: 24
                 })
             }),
-            /*#__PURE__*/ jsx(Modal, {
-                open: isModalOpen,
-                onCancel: ()=>setIsModalOpen(false),
-                footer: null,
-                width: "100%",
-                closable: false,
-                centered: false,
-                transitionName: "",
-                maskTransitionName: "",
-                style: {
-                    margin: 0,
-                    padding: 0,
-                    maxWidth: 'none',
-                    top: 'auto',
-                    bottom: 0
-                },
-                styles: {
-                    wrapper: {
-                        alignItems: 'flex-end',
-                        justifyContent: 'center',
-                        paddingBottom: 0,
-                        display: 'flex'
-                    },
-                    body: {
-                        height: '70vh',
-                        padding: 0,
-                        margin: 0
-                    },
-                    content: {
-                        height: '70vh',
-                        borderRadius: '12px 12px 0 0',
-                        margin: 0,
-                        padding: 0,
-                        marginBottom: 0,
-                        position: 'fixed',
-                        bottom: 0,
-                        left: 0,
-                        right: 0
-                    }
-                },
-                maskClosable: true,
-                destroyOnClose: true,
+            isModalOpen && /*#__PURE__*/ jsx("div", {
+                className: "history-modal-overlay",
+                onClick: ()=>setIsModalOpen(false),
                 children: /*#__PURE__*/ jsxs("div", {
                     className: "history-modal-container",
+                    onClick: (e)=>e.stopPropagation(),
                     children: [
                         /*#__PURE__*/ jsxs("div", {
                             className: "history-modal-header",

package/dist/es/component/playground/index.css

@@ -1,6 +1,5 @@
 .result-wrapper {
   justify-content: center;
-  align-items: center;
   height: 100%;
   margin: 4px 0;
   display: flex;
@@ -38,24 +37,50 @@
 }
 
 .prompt-input-wrapper .mode-radio-group-wrapper {
-  justify-content: space-between;
   align-items: center;
+  gap: 8px;
   display: flex;
+  position: relative;
 }
 
 .prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group {
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+  flex: 1;
   align-items: center;
+  gap: 8px;
+  min-width: 0;
   height: 100%;
+  margin-right: 80px;
+  display: flex;
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+
+.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group::-webkit-scrollbar {
+  display: none;
+}
+
+.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-form-item {
+  flex-shrink: 0;
+  margin: 0 !important;
+}
+
+.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-form-item .ant-radio-group {
+  flex-wrap: nowrap;
+  gap: 8px;
   display: flex;
 }
 
 .prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper {
   height: 24px;
   box-shadow: none;
+  white-space: nowrap;
   background-color: #f7f7f7;
   border: none;
   border-radius: 11px;
-  margin-right: 8px;
+  flex-shrink: 0;
+  margin-right: 0;
   padding: 0 8px;
   font-size: 12px;
   line-height: 24px;
@@ -79,12 +104,18 @@
   color: #fff;
 }
 
+.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-dropdown-trigger {
+  flex-shrink: 0;
+}
+
 .prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .more-apis-button {
   height: 24px;
   box-shadow: none;
+  white-space: nowrap;
   background-color: #f7f7f7;
   border: none;
   border-radius: 11px;
+  flex-shrink: 0;
   align-items: center;
   gap: 2px;
   max-width: 160px;
@@ -114,8 +145,16 @@
 }
 
 .prompt-input-wrapper .mode-radio-group-wrapper .action-icons {
+  z-index: 10;
+  background: #fff;
+  flex-shrink: 0;
   align-items: center;
+  padding-left: 8px;
   display: flex;
+  position: absolute;
+  top: 50%;
+  right: 0;
+  transform: translateY(-50%);
 }
 
 .prompt-input-wrapper .main-side-console-input {

package/dist/es/component/playground-result/index.css

@@ -1,6 +1,5 @@
 .result-wrapper {
   justify-content: center;
-  align-items: center;
   height: 100%;
   margin: 4px 0;
   display: flex;

package/dist/es/component/playground-result/index.mjs

@@ -54,8 +54,7 @@ const PlaygroundResultView = (param)=>{
             display: 'flex',
             flexDirection: 'column',
             flex: '1 1 auto',
-            justifyContent: 'center',
-            alignItems: 'center'
+            justifyContent: 'center'
         },
         children: resultDataToShow
     });

package/dist/es/component/prompt-input/index.css

@@ -3,24 +3,50 @@
 }
 
 .prompt-input-wrapper .mode-radio-group-wrapper {
-  justify-content: space-between;
   align-items: center;
+  gap: 8px;
   display: flex;
+  position: relative;
 }
 
 .prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group {
+  scrollbar-width: none;
+  -ms-overflow-style: none;
+  flex: 1;
   align-items: center;
+  gap: 8px;
+  min-width: 0;
   height: 100%;
+  margin-right: 80px;
+  display: flex;
+  overflow-x: auto;
+  overflow-y: hidden;
+}
+
+.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group::-webkit-scrollbar {
+  display: none;
+}
+
+.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-form-item {
+  flex-shrink: 0;
+  margin: 0 !important;
+}
+
+.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-form-item .ant-radio-group {
+  flex-wrap: nowrap;
+  gap: 8px;
   display: flex;
 }
 
 .prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-radio-button-wrapper {
   height: 24px;
   box-shadow: none;
+  white-space: nowrap;
   background-color: #f7f7f7;
   border: none;
   border-radius: 11px;
-  margin-right: 8px;
+  flex-shrink: 0;
+  margin-right: 0;
   padding: 0 8px;
   font-size: 12px;
   line-height: 24px;
@@ -44,12 +70,18 @@
   color: #fff;
 }
 
+.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .ant-dropdown-trigger {
+  flex-shrink: 0;
+}
+
 .prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .more-apis-button {
   height: 24px;
   box-shadow: none;
+  white-space: nowrap;
   background-color: #f7f7f7;
   border: none;
   border-radius: 11px;
+  flex-shrink: 0;
   align-items: center;
   gap: 2px;
   max-width: 160px;
@@ -79,8 +111,16 @@
 }
 
 .prompt-input-wrapper .mode-radio-group-wrapper .action-icons {
+  z-index: 10;
+  background: #fff;
+  flex-shrink: 0;
   align-items: center;
+  padding-left: 8px;
   display: flex;
+  position: absolute;
+  top: 50%;
+  right: 0;
+  transform: translateY(-50%);
 }
 
 .prompt-input-wrapper .main-side-console-input {

package/dist/es/component/service-mode-control/index.mjs

@@ -1,8 +1,8 @@
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import { PlaygroundSDK } from "@midscene/playground";
-import { overrideAIConfig } from "@midscene/shared/env";
 import { Button, Tooltip } from "antd";
 import { useEffect } from "react";
+import { safeOverrideAIConfig } from "../../hooks/useSafeOverrideAIConfig.mjs";
 import { useServerValid } from "../../hooks/useServerValid.mjs";
 import { useEnvConfig } from "../../store/store.mjs";
 import { EnvConfig } from "../env-config/index.mjs";
@@ -57,7 +57,7 @@ const ServiceModeControl = (param)=>{
         });
     };
     useEffect(()=>{
-        overrideAIConfig(config);
+        safeOverrideAIConfig(config, false, false);
         if ('Server' === serviceMode) {
             const playgroundSDK = new PlaygroundSDK({
                 type: 'remote-execution'

package/dist/es/component/universal-playground/index.css

@@ -4,13 +4,13 @@
   width: 100%;
   height: 100vh;
   display: flex;
+  position: relative;
 }
 
 .playground-container .command-form {
   flex-direction: column;
   width: 100%;
   height: 100%;
-  padding: 0 12px;
   display: flex;
 }
 
@@ -119,7 +119,7 @@
 
 .playground-container .user-message-container .user-message-bubble {
   color: rgba(0, 0, 0, .85);
-  text-align: center;
+  text-align: left;
   background: #f2f4f7;
   border-radius: 12px;
   max-width: 80%;

package/dist/es/component/universal-playground/index.mjs

@@ -11,7 +11,12 @@ import { PlaygroundResultView } from "../playground-result/index.mjs";
 import "./index.css";
 import avatar from "../../icons/avatar.mjs";
 import { PromptInput } from "../prompt-input/index.mjs";
+import { LocalStorageProvider } from "./providers/storage-provider.mjs";
 const { Text } = Typography;
+function getSDKId(sdk) {
+    if (sdk.id && 'string' == typeof sdk.id) return `agent-${sdk.id}`;
+    return 'playground-default';
+}
 function ErrorMessage(param) {
     let { error } = param;
     if (!error) return null;
@@ -35,26 +40,21 @@ function ErrorMessage(param) {
 function UniversalPlayground(param) {
     let { playgroundSDK, storage, contextProvider, config: componentConfig = {}, branding = {}, className = '', dryMode = false, showContextPreview = true } = param;
     const [form] = Form.useForm();
-    const { deepThink, screenshotIncluded, domIncluded, config } = useEnvConfig();
-    const enablePersistence = false !== componentConfig.enablePersistence;
-    const { loading, setLoading, infoList, setInfoList, actionSpace, actionSpaceLoading, uiContextPreview, setUiContextPreview, showScrollToBottomButton, verticalMode, replayCounter, setReplayCounter, infoListRef, currentRunningIdRef, interruptedFlagRef, clearInfoList, handleScrollToBottom } = usePlaygroundState(playgroundSDK, storage, contextProvider, enablePersistence);
-    const { handleRun: executeAction, handleStop, canStop } = usePlaygroundExecution(playgroundSDK, storage, actionSpace, loading, setLoading, infoList, setInfoList, replayCounter, setReplayCounter, verticalMode, currentRunningIdRef, interruptedFlagRef);
+    const { config } = useEnvConfig();
+    const effectiveStorage = (()=>{
+        if (storage) return storage;
+        const namespace = componentConfig.storageNamespace || getSDKId(playgroundSDK);
+        return new LocalStorageProvider(namespace);
+    })();
+    const { loading, setLoading, infoList, setInfoList, actionSpace, actionSpaceLoading, uiContextPreview, setUiContextPreview, showScrollToBottomButton, verticalMode, replayCounter, setReplayCounter, infoListRef, currentRunningIdRef, interruptedFlagRef, clearInfoList, handleScrollToBottom } = usePlaygroundState(playgroundSDK, effectiveStorage, contextProvider);
+    const { handleRun: executeAction, handleStop, canStop } = usePlaygroundExecution(playgroundSDK, effectiveStorage, actionSpace, loading, setLoading, infoList, setInfoList, replayCounter, setReplayCounter, verticalMode, currentRunningIdRef, interruptedFlagRef);
     useEffect(()=>{
-        const completeConfig = {
-            ...config,
-            deepThink,
-            screenshotIncluded,
-            domIncluded
-        };
-        if (playgroundSDK.overrideConfig) playgroundSDK.overrideConfig(completeConfig).catch((error)=>{
+        if ((null == playgroundSDK ? void 0 : playgroundSDK.overrideConfig) && config) playgroundSDK.overrideConfig(config).catch((error)=>{
             console.error('Failed to override SDK config:', error);
         });
     }, [
         playgroundSDK,
-        config,
-        deepThink,
-        screenshotIncluded,
-        domIncluded
+        config
     ]);
     const handleFormRun = useCallback(async ()=>{
         try {
@@ -245,7 +245,7 @@ function UniversalPlayground(param) {
                 /*#__PURE__*/ jsxs("div", {
                     className: "bottom-input-section",
                     children: [
-                        !componentConfig.serverMode && /*#__PURE__*/ jsx(EnvConfigReminder, {}),
+                        componentConfig.showEnvConfigReminder ? /*#__PURE__*/ jsx(EnvConfigReminder, {}) : null,
                         /*#__PURE__*/ jsx(PromptInput, {
                             runButtonEnabled: runButtonEnabled,
                             form: form,

package/dist/es/hooks/usePlaygroundExecution.mjs

@@ -1,4 +1,5 @@
 import { useCallback } from "react";
+import { useEnvConfig } from "../store/store.mjs";
 import { BLANK_RESULT } from "../utils/constants.mjs";
 import { allScriptsFromDump } from "../utils/replay-scripts.mjs";
 const noReplayAPIs = [
@@ -6,7 +7,9 @@ const noReplayAPIs = [
     'aiAssert'
 ];
 function usePlaygroundExecution(playgroundSDK, storage, actionSpace, loading, setLoading, infoList, setInfoList, replayCounter, setReplayCounter, verticalMode, currentRunningIdRef, interruptedFlagRef) {
+    const { deepThink, screenshotIncluded, domIncluded } = useEnvConfig();
     const handleRun = useCallback(async (value)=>{
+        if (!playgroundSDK) return void console.warn('PlaygroundSDK is not available');
         const thisRunningId = Date.now();
         const actionType = value.type;
         const displayContent = `${value.type}: ${value.prompt || JSON.stringify(value.params)}`;
@@ -39,21 +42,29 @@ function usePlaygroundExecution(playgroundSDK, storage, actionSpace, loading, se
         try {
             currentRunningIdRef.current = thisRunningId;
             interruptedFlagRef.current[thisRunningId] = false;
+            if (playgroundSDK.onProgressUpdate) playgroundSDK.onProgressUpdate(()=>{});
             if (playgroundSDK.onProgressUpdate) playgroundSDK.onProgressUpdate((tip)=>{
                 if (interruptedFlagRef.current[thisRunningId]) return;
-                const progressItem = {
-                    id: `progress-${thisRunningId}-${Date.now()}`,
-                    type: 'progress',
-                    content: tip,
-                    timestamp: new Date()
-                };
-                setInfoList((prev)=>[
+                setInfoList((prev)=>{
+                    const lastItem = prev[prev.length - 1];
+                    if (lastItem && 'progress' === lastItem.type && lastItem.content === tip) return prev;
+                    const progressItem = {
+                        id: `progress-${thisRunningId}-${Date.now()}`,
+                        type: 'progress',
+                        content: tip,
+                        timestamp: new Date()
+                    };
+                    return [
                         ...prev,
                         progressItem
-                    ]);
+                    ];
+                });
             });
             result.result = await playgroundSDK.executeAction(actionType, value, {
-                requestId: thisRunningId.toString()
+                requestId: thisRunningId.toString(),
+                deepThink,
+                screenshotIncluded,
+                domIncluded
             });
             if ('object' == typeof result.result && null !== result.result) {
                 const resultObj = result.result;
@@ -124,14 +135,18 @@ function usePlaygroundExecution(playgroundSDK, storage, actionSpace, loading, se
         setReplayCounter,
         verticalMode,
         currentRunningIdRef,
-        interruptedFlagRef
+        interruptedFlagRef,
+        deepThink,
+        screenshotIncluded,
+        domIncluded
     ]);
     const handleStop = useCallback(async ()=>{
         const thisRunningId = currentRunningIdRef.current;
-        if (thisRunningId && playgroundSDK.cancelExecution) try {
+        if (thisRunningId && playgroundSDK && playgroundSDK.cancelExecution) try {
             await playgroundSDK.cancelExecution(thisRunningId.toString());
             interruptedFlagRef.current[thisRunningId] = true;
             setLoading(false);
+            if (playgroundSDK.onProgressUpdate) playgroundSDK.onProgressUpdate(()=>{});
             setInfoList((prev)=>prev.map((item)=>item.id === `system-${thisRunningId}` && item.loading ? {
                         ...item,
                         content: 'Operation stopped',
@@ -158,7 +173,7 @@ function usePlaygroundExecution(playgroundSDK, storage, actionSpace, loading, se
         setLoading,
         setInfoList
     ]);
-    const canStop = loading && !!currentRunningIdRef.current && !!playgroundSDK.cancelExecution;
+    const canStop = loading && !!currentRunningIdRef.current && !!playgroundSDK && !!playgroundSDK.cancelExecution;
     return {
         handleRun,
         handleStop,

package/dist/es/hooks/usePlaygroundState.mjs

@@ -1,7 +1,6 @@
 import { useCallback, useEffect, useRef, useState } from "react";
 import { WELCOME_MESSAGE_TEMPLATE } from "../utils/constants.mjs";
 function usePlaygroundState(playgroundSDK, storage, contextProvider) {
-    let enablePersistence = arguments.length > 3 && void 0 !== arguments[3] ? arguments[3] : true;
     const [loading, setLoading] = useState(false);
     const [infoList, setInfoList] = useState([]);
     const [actionSpace, setActionSpace] = useState([]);
@@ -20,7 +19,7 @@ function usePlaygroundState(playgroundSDK, storage, contextProvider) {
                 id: 'welcome',
                 timestamp: new Date()
             };
-            if (enablePersistence && (null == storage ? void 0 : storage.loadMessages)) try {
+            if (null == storage ? void 0 : storage.loadMessages) try {
                 const storedMessages = await storage.loadMessages();
                 const hasWelcomeMessage = storedMessages.some((msg)=>'welcome' === msg.id);
                 hasWelcomeMessage ? setInfoList(storedMessages) : setInfoList([
@@ -40,13 +39,12 @@ function usePlaygroundState(playgroundSDK, storage, contextProvider) {
         if (0 === infoList.length) initializeMessages();
     }, []);
     useEffect(()=>{
-        if (enablePersistence && (null == storage ? void 0 : storage.saveMessages) && infoList.length > 1) storage.saveMessages(infoList).catch((error)=>{
+        if ((null == storage ? void 0 : storage.saveMessages) && infoList.length > 1) storage.saveMessages(infoList).catch((error)=>{
             console.error('Failed to save messages:', error);
         });
     }, [
         infoList,
-        storage,
-        enablePersistence
+        storage
     ]);
     useEffect(()=>{
         if (!(null == contextProvider ? void 0 : contextProvider.getUIContext) || uiContextPreview) return;
@@ -62,6 +60,7 @@ function usePlaygroundState(playgroundSDK, storage, contextProvider) {
             setActionSpaceLoading(true);
             try {
                 var _contextProvider_getUIContext;
+                if (!playgroundSDK) return void setActionSpace([]);
                 const context = uiContextPreview || await (null == contextProvider ? void 0 : null == (_contextProvider_getUIContext = contextProvider.getUIContext) ? void 0 : _contextProvider_getUIContext.call(contextProvider));
                 const space = await playgroundSDK.getActionSpace(context);
                 setActionSpace(space || []);
@@ -135,14 +134,13 @@ function usePlaygroundState(playgroundSDK, storage, contextProvider) {
         setInfoList([
             welcomeMessage
         ]);
-        if (enablePersistence && (null == storage ? void 0 : storage.clearMessages)) try {
+        if (null == storage ? void 0 : storage.clearMessages) try {
             await storage.clearMessages();
         } catch (error) {
             console.error('Failed to clear stored messages:', error);
         }
     }, [
-        storage,
-        enablePersistence
+        storage
     ]);
     const refreshContext = useCallback(async ()=>{
         if (null == contextProvider ? void 0 : contextProvider.refreshContext) try {

package/dist/es/hooks/useSafeOverrideAIConfig.mjs

@@ -0,0 +1,24 @@
+import { overrideAIConfig } from "@midscene/shared/env";
+import { message } from "antd";
+function safeOverrideAIConfig(newConfig) {
+    let extendMode = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : false, showErrorMessage = arguments.length > 2 && void 0 !== arguments[2] ? arguments[2] : true;
+    try {
+        overrideAIConfig(newConfig, extendMode);
+        return true;
+    } catch (error) {
+        const err = error instanceof Error ? error : new Error(String(error));
+        console.error('Failed to override AI config:', err);
+        if (showErrorMessage) message.error(`Failed to apply AI configuration: ${err.message}`);
+        return false;
+    }
+}
+function useSafeOverrideAIConfig() {
+    const applyConfig = function(newConfig) {
+        let extendMode = arguments.length > 1 && void 0 !== arguments[1] ? arguments[1] : false, showErrorMessage = arguments.length > 2 && void 0 !== arguments[2] ? arguments[2] : true;
+        return safeOverrideAIConfig(newConfig, extendMode, showErrorMessage);
+    };
+    return {
+        applyConfig
+    };
+}
+export { safeOverrideAIConfig, useSafeOverrideAIConfig };

package/dist/es/index.mjs

@@ -8,6 +8,7 @@ import { EnvConfigReminder } from "./component/env-config-reminder/index.mjs";
 import { Logo } from "./component/logo/index.mjs";
 import { iconForStatus, timeCostStrElement } from "./component/misc/index.mjs";
 import { useServerValid } from "./hooks/useServerValid.mjs";
+import { safeOverrideAIConfig, useSafeOverrideAIConfig } from "./hooks/useSafeOverrideAIConfig.mjs";
 import { PlaygroundResultView } from "./component/playground-result/index.mjs";
 import { ServiceModeControl } from "./component/service-mode-control/index.mjs";
 import { ContextPreview } from "./component/context-preview/index.mjs";
@@ -21,4 +22,4 @@ import shiny_text from "./component/shiny-text/index.mjs";
 import universal_playground, { UniversalPlayground } from "./component/universal-playground/index.mjs";
 import { LocalStorageProvider, MemoryStorageProvider, NoOpStorageProvider } from "./component/universal-playground/providers/storage-provider.mjs";
 import { AgentContextProvider, BaseContextProvider, NoOpContextProvider, StaticContextProvider } from "./component/universal-playground/providers/context-provider.mjs";
-export { AgentContextProvider, BaseContextProvider, Blackboard, ContextPreview, EnvConfig, EnvConfigReminder, GithubStar, LocalStorageProvider, Logo, MemoryStorageProvider, NoOpContextProvider, NoOpStorageProvider, Player, PlaygroundResultView, PromptInput, ServiceModeControl, shiny_text as ShinyText, StaticContextProvider, UniversalPlayground, universal_playground as UniversalPlaygroundDefault, actionNameForType, allScriptsFromDump, colorForName, filterBase64Value, generateAnimationScripts, getPlaceholderForType, globalThemeConfig, highlightColorForType, iconForStatus, staticAgentFromContext, timeCostStrElement, timeStr, useEnvConfig, useServerValid };
+export { AgentContextProvider, BaseContextProvider, Blackboard, ContextPreview, EnvConfig, EnvConfigReminder, GithubStar, LocalStorageProvider, Logo, MemoryStorageProvider, NoOpContextProvider, NoOpStorageProvider, Player, PlaygroundResultView, PromptInput, ServiceModeControl, shiny_text as ShinyText, StaticContextProvider, UniversalPlayground, universal_playground as UniversalPlaygroundDefault, actionNameForType, allScriptsFromDump, colorForName, filterBase64Value, generateAnimationScripts, getPlaceholderForType, globalThemeConfig, highlightColorForType, iconForStatus, safeOverrideAIConfig, staticAgentFromContext, timeCostStrElement, timeStr, useEnvConfig, useSafeOverrideAIConfig, useServerValid };

package/dist/lib/component/history-selector/index.css

@@ -1,9 +1,26 @@
+.history-modal-overlay {
+  z-index: 1000;
+  background: rgba(0, 0, 0, .45);
+  justify-content: stretch;
+  align-items: flex-end;
+  display: flex;
+  position: absolute;
+  top: 0;
+  bottom: 0;
+  left: 0;
+  right: 0;
+}
+
 .history-modal-container {
+  z-index: 1001;
+  background: #fff;
   border-radius: 12px 12px 0 0;
   flex-direction: column;
-  height: 70vh;
+  width: 100%;
+  height: 400px;
   display: flex;
   overflow: hidden;
+  box-shadow: 0 8px 24px rgba(0, 0, 0, .12);
 }
 
 .history-modal-container .history-modal-header {
@@ -114,19 +131,3 @@
   padding: 40px 20px;
 }
 
-.ant-modal-wrap .ant-modal-content {
-  animation: .3s cubic-bezier(.4, 0, .2, 1) forwards slideUpFromBottom !important;
-}
-
-@keyframes slideUpFromBottom {
-  0% {
-    opacity: 0;
-    transform: translateY(100%);
-  }
-
-  100% {
-    opacity: 1;
-    transform: translateY(0);
-  }
-}
-