@midscene/visualizer 0.28.2-beta-20250909133629.0 → 0.28.2-beta-20250910021445.0

package/dist/es/component/{blackboard/index.mjs → blackboard.mjs}

@@ -4,11 +4,11 @@ import "pixi.js/unsafe-eval";
 import { Checkbox } from "antd";
 import { Application, Container, Graphics, Rectangle, Sprite, Text, Texture } from "pixi.js";
 import { useEffect, useMemo, useRef, useState } from "react";
-import { colorForName, highlightColorForType } from "../../utils/color.mjs";
-import "./index.css";
+import { colorForName, highlightColorForType } from "./color.mjs";
+import "./blackboard.css";
 import { treeToList } from "@midscene/shared/extractor";
 import { DropShadowFilter } from "pixi-filters";
-import { useBlackboardPreference } from "../../store/store.mjs";
+import { useBlackboardPreference } from "./store/store.mjs";
 const itemFillAlpha = 0.4;
 const highlightAlpha = 0.4;
 const pointRadius = 10;

package/dist/es/component/describer.css

@@ -0,0 +1,25 @@
+.image-describer {
+  position: relative;
+}
+
+.image-describer .describe-text {
+  box-sizing: border-box;
+  color: #fff;
+  background: #000;
+  width: 100%;
+  height: 30px;
+  padding: 10px;
+  font-size: 12px;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+}
+
+.image-describer .describe-text.success {
+  background: #047704;
+}
+
+.image-describer .describe-text.error {
+  background: #870707;
+}
+

package/dist/es/component/{env-config/index.mjs → env-config.mjs}

@@ -2,7 +2,7 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { SettingOutlined } from "@ant-design/icons";
 import { Input, Modal, Tooltip } from "antd";
 import { useEffect, useRef, useState } from "react";
-import { useEnvConfig } from "../../store/store.mjs";
+import { useEnvConfig } from "./store/store.mjs";
 function EnvConfig(param) {
     let { showTooltipWhenEmpty = true, showModelName = true, tooltipPlacement = 'bottom', mode = 'icon' } = param;
     const { config, configString, loadConfig, syncFromStorage } = useEnvConfig();

package/dist/es/component/{github-star/index.mjs → github-star.mjs}

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import "./index.css";
+import "./github-star.css";
 const GithubStar = ()=>/*#__PURE__*/ jsx("a", {
         href: "https://github.com/web-infra-dev/midscene",
         target: "_blank",

package/dist/es/component/{logo/index.mjs → logo.mjs}

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import "./index.css";
+import "./logo.css";
 const LogoUrl = 'https://lf3-static.bytednsdoc.com/obj/eden-cn/vhaeh7vhabf/Midscene.png';
 const Logo = (param)=>{
     let { hideLogo = false } = param;

package/dist/es/component/{misc/index.mjs → misc.mjs}

@@ -1,7 +1,5 @@
-import { jsx, jsxs } from "react/jsx-runtime";
+import { jsx } from "react/jsx-runtime";
 import { ArrowRightOutlined, CheckOutlined, ClockCircleOutlined, CloseOutlined, LogoutOutlined, MinusOutlined, WarningOutlined } from "@ant-design/icons";
-import { Alert } from "antd";
-import shiny_text from "../shiny-text/index.mjs";
 function timeCostStrElement(timeCost) {
     let str;
     str = 'number' != typeof timeCost ? '-' : `${(timeCost / 1000).toFixed(2)}s`;
@@ -53,42 +51,4 @@ const iconForStatus = (status)=>{
             return /*#__PURE__*/ jsx(MinusOutlined, {});
     }
 };
-const errorMessageServerNotReady = /*#__PURE__*/ jsxs("span", {
-    children: [
-        "Don't worry, just one more step to launch the playground server.",
-        /*#__PURE__*/ jsx("br", {}),
-        "Please run one of the commands under the midscene project directory:",
-        /*#__PURE__*/ jsx("br", {}),
-        "a. ",
-        /*#__PURE__*/ jsx("strong", {
-            children: "npx midscene-playground"
-        }),
-        /*#__PURE__*/ jsx("br", {}),
-        "b. ",
-        /*#__PURE__*/ jsx("strong", {
-            children: "npx --yes @midscene/web"
-        })
-    ]
-});
-const serverLaunchTip = function() {
-    let notReadyMessage = arguments.length > 0 && void 0 !== arguments[0] ? arguments[0] : errorMessageServerNotReady;
-    return /*#__PURE__*/ jsx("div", {
-        className: "server-tip",
-        children: /*#__PURE__*/ jsx(Alert, {
-            message: "Playground Server Not Ready",
-            description: notReadyMessage,
-            type: "warning"
-        })
-    });
-};
-const emptyResultTip = /*#__PURE__*/ jsx("div", {
-    className: "result-empty-tip",
-    style: {
-        textAlign: 'center'
-    },
-    children: /*#__PURE__*/ jsx(shiny_text, {
-        disabled: true,
-        text: "The result will be shown here"
-    })
-});
-export { emptyResultTip, errorMessageServerNotReady, iconForStatus, serverLaunchTip, timeCostStrElement };
+export { iconForStatus, timeCostStrElement };

package/dist/es/component/{player/index.mjs → player.mjs}

@@ -3,17 +3,17 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import "pixi.js/unsafe-eval";
 import { Application, Container, Sprite } from "pixi.js";
 import { useEffect, useMemo, useRef, useState } from "react";
-import "./index.css";
-import { mouseLoading, mousePointer } from "../../utils/index.mjs";
+import "./player.css";
+import { mouseLoading, mousePointer } from "../utils.mjs";
 import { CaretRightOutlined, DownloadOutlined, ExportOutlined, LoadingOutlined } from "@ant-design/icons";
 import { treeToList } from "@midscene/shared/extractor";
 import { Dropdown, Spin, Switch, Tooltip } from "antd";
-import global_perspective from "../../icons/global-perspective.mjs";
-import player_setting from "../../icons/player-setting.mjs";
-import show_marker from "../../icons/show-marker.mjs";
-import { useBlackboardPreference } from "../../store/store.mjs";
-import { getTextureFromCache, loadTexture } from "../../utils/pixi-loader.mjs";
-import { rectMarkForItem } from "../blackboard/index.mjs";
+import global_perspective from "../icons/global-perspective.mjs";
+import player_setting from "../icons/player-setting.mjs";
+import show_marker from "../icons/show-marker.mjs";
+import { rectMarkForItem } from "./blackboard.mjs";
+import { getTextureFromCache, loadTexture } from "./pixi-loader.mjs";
+import { useBlackboardPreference } from "./store/store.mjs";
 function _define_property(obj, key, value) {
     if (key in obj) Object.defineProperty(obj, key, {
         value: value,

package/dist/es/component/{config-selector/index.mjs → playground/ConfigSelector.mjs}

@@ -1,8 +1,9 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Checkbox, Dropdown, Radio } from "antd";
 import setting from "../../icons/setting.mjs";
-import { useEnvConfig } from "../../store/store.mjs";
-import { deepThinkTip, domIncludedTip, screenshotIncludedTip, trackingTip } from "../../utils/constants.mjs";
+import { useEnvConfig } from "../store/store.mjs";
+import { deepThinkTip, domIncludedTip, screenshotIncludedTip, trackingTip } from "./playground-constants.mjs";
+import "./index.css";
 const ConfigSelector = (param)=>{
     let { showDeepThinkOption = false, enableTracking = false, showDataExtractionOptions = false, hideDomAndScreenshotOptions = false } = param;
     const forceSameTabNavigation = useEnvConfig((state)=>state.forceSameTabNavigation);

package/dist/es/component/{context-preview/index.mjs → playground/ContextPreview.mjs}

@@ -1,8 +1,9 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Button } from "antd";
-import blackboard from "../blackboard/index.mjs";
-import { iconForStatus } from "../misc/index.mjs";
-import playground_demo_ui_context from "../playground/playground-demo-ui-context.json";
+import blackboard from "../blackboard.mjs";
+import { iconForStatus } from "../misc.mjs";
+import playground_demo_ui_context from "../playground-demo-ui-context.json";
+import "./index.css";
 const ContextPreview = (param)=>{
     let { uiContextPreview, setUiContextPreview, showContextPreview } = param;
     if (!showContextPreview) return null;

package/dist/es/component/{history-selector/index.mjs → playground/HistorySelector.mjs}

@@ -4,7 +4,7 @@ import { useMemo, useState } from "react";
 import icons_close from "../../icons/close.mjs";
 import icons_history from "../../icons/history.mjs";
 import magnifying_glass from "../../icons/magnifying-glass.mjs";
-import { useHistoryStore } from "../../store/history.mjs";
+import { useHistoryStore } from "../store/history.mjs";
 import "./index.css";
 const { Text } = Typography;
 const HistorySelector = (param)=>{

package/dist/es/component/{playground-result/index.mjs → playground/PlaygroundResult.mjs}

@@ -1,9 +1,10 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { LoadingOutlined } from "@ant-design/icons";
 import { Spin } from "antd";
-import { emptyResultTip, serverLaunchTip } from "../../utils/constants.mjs";
-import { Player } from "../player/index.mjs";
-import shiny_text from "../shiny-text/index.mjs";
+import { Player } from "../player.mjs";
+import shiny_text from "../shiny-text.mjs";
+import { emptyResultTip, serverLaunchTip } from "./playground-constants.mjs";
+import "./index.css";
 const PlaygroundResultView = (param)=>{
     let { result, loading, serverValid, serviceMode, replayScriptsInfo, replayCounter, loadingProgressText, verticalMode = false, notReadyMessage, fitMode, autoZoom } = param;
     let resultWrapperClassName = 'result-wrapper';

package/dist/es/component/{prompt-input/index.mjs → playground/PromptInput.mjs}

@@ -1,15 +1,15 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { BorderOutlined, DownOutlined, SendOutlined } from "@ant-design/icons";
-import "./index.css";
 import { Button, Dropdown, Form, Input, Radio, Space, Tooltip } from "antd";
 import react, { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { useHistoryStore } from "../../store/history.mjs";
-import { extractDefaultValue, isLocateField, isZodObjectSchema, unwrapZodType } from "../../types.mjs";
-import { apiMetadata, defaultMainButtons } from "../../utils/constants.mjs";
-import { actionNameForType, getPlaceholderForType, isRunButtonEnabled as playground_utils_mjs_isRunButtonEnabled } from "../../utils/playground-utils.mjs";
-import { ConfigSelector } from "../config-selector/index.mjs";
-import { BooleanField, EnumField, LocateField, NumberField, TextField } from "../form-field/index.mjs";
-import { HistorySelector } from "../history-selector/index.mjs";
+import { useHistoryStore } from "../store/history.mjs";
+import { ConfigSelector } from "./ConfigSelector.mjs";
+import { BooleanField, EnumField, LocateField, NumberField, TextField } from "./FormField.mjs";
+import { HistorySelector } from "./HistorySelector.mjs";
+import { apiMetadata, defaultMainButtons } from "./playground-constants.mjs";
+import { actionNameForType, getPlaceholderForType, isRunButtonEnabled as external_playground_utils_mjs_isRunButtonEnabled } from "./playground-utils.mjs";
+import { extractDefaultValue, isLocateField, isZodObjectSchema, unwrapZodType } from "./types.mjs";
+import "./index.css";
 const { TextArea } = Input;
 const PromptInput = (param)=>{
     let { runButtonEnabled, form, serviceMode, selectedType, dryMode, stoppable, loading, onRun, onStop, clearPromptAfterRun = true, actionSpace, hideDomAndScreenshotOptions = false } = param;
@@ -221,7 +221,7 @@ const PromptInput = (param)=>{
         needsStructuredParams,
         actionSpace
     ]);
-    const isRunButtonEnabled = useMemo(()=>playground_utils_mjs_isRunButtonEnabled(runButtonEnabled, !!needsStructuredParams, params, actionSpace, selectedType, promptValue), [
+    const isRunButtonEnabled = useMemo(()=>external_playground_utils_mjs_isRunButtonEnabled(runButtonEnabled, !!needsStructuredParams, params, actionSpace, selectedType, promptValue), [
         runButtonEnabled,
         needsStructuredParams,
         selectedType,

package/dist/es/component/{service-mode-control/index.mjs → playground/ServiceModeControl.mjs}

@@ -3,10 +3,11 @@ import { PlaygroundSDK } from "@midscene/playground";
 import { overrideAIConfig } from "@midscene/shared/env";
 import { Button, Tooltip } from "antd";
 import { useEffect } from "react";
-import { useServerValid } from "../../hooks/useServerValid.mjs";
-import { useEnvConfig } from "../../store/store.mjs";
-import { EnvConfig } from "../env-config/index.mjs";
-import { iconForStatus } from "../misc/index.mjs";
+import { EnvConfig } from "../env-config.mjs";
+import { iconForStatus } from "../misc.mjs";
+import { useEnvConfig } from "../store/store.mjs";
+import { useServerValid } from "./useServerValid.mjs";
+import "./index.css";
 const TITLE_TEXT = {
     Server: 'Server Status',
     'In-Browser': 'In-Browser'

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

@@ -1,30 +1,7 @@
-.result-wrapper {
-  justify-content: center;
-  height: 100%;
-  margin: 4px 0;
-  display: flex;
-}
-
-.result-wrapper .loading-container {
-  text-align: center;
-}
-
-.result-wrapper .loading-container .loading-progress-text {
-  color: #888;
-  margin-top: 8px;
-  font-size: 12px;
-}
-
-.result-wrapper pre {
-  white-space: pre-wrap;
-  text-wrap: unset;
-  word-wrap: break-word;
-  overflow-wrap: break-word;
-  background: #f2f4f7;
-  border-radius: 8px;
+body {
   margin: 0;
-  padding: 14px;
-  overflow: scroll;
+  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Noto Sans, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji;
+  font-size: 14px;
 }
 
 .prompt-input-wrapper {
@@ -357,9 +334,164 @@
   color: #2b83ff;
 }
 
-body {
-  margin: 0;
-  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Noto Sans, Helvetica, Arial, sans-serif, Apple Color Emoji, Segoe UI Emoji;
+.history-modal-container {
+  border-radius: 12px 12px 0 0;
+  flex-direction: column;
+  height: 70vh;
+  display: flex;
+  overflow: hidden;
+}
+
+.history-modal-container .history-modal-header {
+  justify-content: space-between;
+  align-items: center;
+  height: 48px;
+  padding: 0 25px;
+  line-height: 48px;
+  display: flex;
+}
+
+.history-modal-container .history-modal-header .close-button {
+  justify-content: center;
+  align-items: center;
+  margin-right: -4px;
+  padding: 4px;
+  display: flex;
+}
+
+.history-modal-container .history-modal-header .close-button .anticon {
+  color: #999;
+  font-size: 18px;
+}
+
+.history-modal-container .history-modal-header .close-button:hover .anticon {
+  color: #666;
+}
+
+.history-modal-container .history-search-section {
+  background: #fff;
+  padding: 16px 20px;
+}
+
+.history-modal-container .history-search-section .search-input-wrapper {
+  color: rgba(0, 0, 0, .25);
+  align-items: center;
+  gap: 12px;
+  display: flex;
+}
+
+.history-modal-container .history-search-section .search-input-wrapper .search-input {
+  background: #f1f2f3;
+  border: none;
+  border-radius: 16px;
+  flex: 1;
+  height: 36px;
+}
+
+.history-modal-container .history-search-section .search-input-wrapper .search-input .ant-input {
+  box-shadow: none;
+  background: none;
+  border: none;
+}
+
+.history-modal-container .history-search-section .search-input-wrapper .search-input:hover, .history-modal-container .history-search-section .search-input-wrapper .search-input:focus-within {
+  background: #fff;
+  border-color: #d9d9d9;
+}
+
+.history-modal-container .history-search-section .search-input-wrapper .clear-button {
+  color: #1890ff;
+  height: auto;
+  padding: 0;
+}
+
+.history-modal-container .history-search-section .search-input-wrapper .clear-button:hover {
+  color: #40a9ff;
+}
+
+.history-modal-container .history-content {
+  flex: 1;
+  padding: 0 25px 25px;
+  overflow-y: auto;
+}
+
+.history-modal-container .history-content .history-group {
+  margin-bottom: 10px;
+}
+
+.history-modal-container .history-content .history-group .history-group-title {
+  color: rgba(0, 0, 0, .45);
+  height: 40px;
+  font-size: 12px;
+  font-weight: 400;
+  line-height: 40px;
+}
+
+.history-modal-container .history-content .history-group .history-item {
+  cursor: pointer;
+  color: rgba(0, 0, 0, .85);
+  white-space: nowrap;
+  text-overflow: ellipsis;
+  height: 40px;
   font-size: 14px;
+  line-height: 40px;
+  overflow: hidden;
+}
+
+.history-modal-container .history-content .history-group .history-item:hover {
+  background: #f2f4f7;
+  margin: 0 -8px;
+  padding: 0 8px;
+}
+
+.history-modal-container .history-content .no-results {
+  text-align: center;
+  color: #999;
+  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);
+  }
+}
+
+.result-wrapper {
+  justify-content: center;
+  height: 100%;
+  margin: 4px 0;
+  display: flex;
+}
+
+.result-wrapper .loading-container {
+  text-align: center;
+}
+
+.result-wrapper .loading-container .loading-progress-text {
+  color: #888;
+  margin-top: 8px;
+  font-size: 12px;
+}
+
+.result-wrapper pre {
+  white-space: pre-wrap;
+  text-wrap: unset;
+  word-wrap: break-word;
+  overflow-wrap: break-word;
+  background: #f2f4f7;
+  border-radius: 8px;
+  margin: 0;
+  padding: 14px;
+  overflow: scroll;
 }
 

package/dist/es/{utils/constants.mjs → component/playground/playground-constants.mjs}

@@ -1,6 +1,7 @@
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Alert } from "antd";
-import shiny_text from "../component/shiny-text/index.mjs";
+import shiny_text from "../shiny-text.mjs";
+import "./index.css";
 const errorMessageServerNotReady = /*#__PURE__*/ jsxs("span", {
     children: [
         "Don't worry, just one more step to launch the playground server.",

package/dist/es/{utils → component/playground}/playground-utils.mjs

@@ -1,5 +1,5 @@
 import { StaticPage, StaticPageAgent } from "@midscene/web/static";
-import { isZodObjectSchema, unwrapZodType } from "../types.mjs";
+import { isZodObjectSchema, unwrapZodType } from "./types.mjs";
 const actionNameForType = (type)=>{
     const typeWithoutAi = type.startsWith('ai') ? type.slice(2) : type;
     const fullName = typeWithoutAi.replace(/([A-Z])/g, ' $1').trim();

package/dist/es/{types.mjs → component/playground/types.mjs}

@@ -67,26 +67,4 @@ const extractDefaultValue = (field)=>{
         currentField = currentField._def.innerType;
     }
 };
-const WELCOME_MESSAGE_TEMPLATE = {
-    type: 'system',
-    content: `
-      Welcome to Midscene.js Playground!
-      
-      This is a panel for experimenting and testing Midscene.js features. You can use natural language instructions to operate the web page, such as clicking buttons, filling in forms, querying information, etc.
-      
-      Please enter your instructions in the input box below to start experiencing.
-    `,
-    loading: false,
-    result: void 0,
-    replayScriptsInfo: null,
-    replayCounter: 0,
-    loadingProgressText: '',
-    verticalMode: false
-};
-const BLANK_RESULT = {
-    result: void 0,
-    dump: null,
-    reportHTML: null,
-    error: null
-};
-export { BLANK_RESULT, VALIDATION_CONSTANTS, WELCOME_MESSAGE_TEMPLATE, extractDefaultValue, isLocateField, isZodObjectSchema, unwrapZodType };
+export { VALIDATION_CONSTANTS, extractDefaultValue, isLocateField, isZodObjectSchema, unwrapZodType };

package/dist/es/{utils → component}/replay-scripts.mjs

@@ -1,5 +1,6 @@
 'use client';
-import { mousePointer } from "./index.mjs";
+import "./player.css";
+import { mousePointer } from "../utils.mjs";
 import { paramStr, typeStr } from "@midscene/core/agent";
 import { treeToList } from "@midscene/shared/extractor";
 const stillDuration = 900;

package/dist/es/component/{shiny-text/index.mjs → shiny-text.mjs}

@@ -1,5 +1,5 @@
 import { jsx } from "react/jsx-runtime";
-import "./index.css";
+import "./shiny-text.css";
 const ShinyText = (param)=>{
     let { text, disabled = false, speed = 5, className = '' } = param;
     const style = {

package/dist/es/index.mjs

@@ -1,23 +1,19 @@
 import "./component/playground/index.css";
-import "./component/universal-playground/index.css";
-import { allScriptsFromDump, generateAnimationScripts } from "./utils/replay-scripts.mjs";
-import { useEnvConfig } from "./store/store.mjs";
-import { colorForName, globalThemeConfig, highlightColorForType } from "./utils/color.mjs";
-import { EnvConfig } from "./component/env-config/index.mjs";
-import { Logo } from "./component/logo/index.mjs";
-import { iconForStatus, timeCostStrElement } from "./component/misc/index.mjs";
-import { useServerValid } from "./hooks/useServerValid.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";
-import { PromptInput } from "./component/prompt-input/index.mjs";
-import { Player } from "./component/player/index.mjs";
-import { Blackboard } from "./component/blackboard/index.mjs";
-import { GithubStar } from "./component/github-star/index.mjs";
-import { actionNameForType, getPlaceholderForType, staticAgentFromContext } from "./utils/playground-utils.mjs";
-import { filterBase64Value, timeStr } from "./utils/index.mjs";
-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, 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 };
+import { allScriptsFromDump, generateAnimationScripts } from "./component/replay-scripts.mjs";
+import { useEnvConfig } from "./component/store/store.mjs";
+import { colorForName, globalThemeConfig, highlightColorForType } from "./component/color.mjs";
+import { EnvConfig } from "./component/env-config.mjs";
+import { Logo } from "./component/logo.mjs";
+import { iconForStatus, timeCostStrElement } from "./component/misc.mjs";
+import { useServerValid } from "./component/playground/useServerValid.mjs";
+import { PlaygroundResultView } from "./component/playground/PlaygroundResult.mjs";
+import { ServiceModeControl } from "./component/playground/ServiceModeControl.mjs";
+import { ContextPreview } from "./component/playground/ContextPreview.mjs";
+import { PromptInput } from "./component/playground/PromptInput.mjs";
+import { Player } from "./component/player.mjs";
+import { Blackboard } from "./component/blackboard.mjs";
+import { GithubStar } from "./component/github-star.mjs";
+import { actionNameForType, getPlaceholderForType, staticAgentFromContext } from "./component/playground/playground-utils.mjs";
+import { filterBase64Value, timeStr } from "./utils.mjs";
+import shiny_text from "./component/shiny-text.mjs";
+export { Blackboard, ContextPreview, EnvConfig, GithubStar, Logo, Player, PlaygroundResultView, PromptInput, ServiceModeControl, shiny_text as ShinyText, actionNameForType, allScriptsFromDump, colorForName, filterBase64Value, generateAnimationScripts, getPlaceholderForType, globalThemeConfig, highlightColorForType, iconForStatus, staticAgentFromContext, timeCostStrElement, timeStr, useEnvConfig, useServerValid };

package/dist/es/init.mjs

@@ -0,0 +1,10 @@
+import { Buffer } from "buffer";
+var _window;
+(_window = window).global || (_window.global = window);
+window.Buffer = Buffer;
+let sideEffect = 0;
+const setSideEffect = ()=>{
+    sideEffect++;
+    return sideEffect;
+};
+export { setSideEffect };

package/dist/lib/component/{blackboard/index.js → blackboard.js}

@@ -35,17 +35,17 @@ require("pixi.js/unsafe-eval");
 const external_antd_namespaceObject = require("antd");
 const external_pixi_js_namespaceObject = require("pixi.js");
 const external_react_namespaceObject = require("react");
-const color_js_namespaceObject = require("../../utils/color.js");
-require("./index.css");
+const external_color_js_namespaceObject = require("./color.js");
+require("./blackboard.css");
 const extractor_namespaceObject = require("@midscene/shared/extractor");
 const external_pixi_filters_namespaceObject = require("pixi-filters");
-const store_js_namespaceObject = require("../../store/store.js");
+const store_js_namespaceObject = require("./store/store.js");
 const itemFillAlpha = 0.4;
 const highlightAlpha = 0.4;
 const pointRadius = 10;
 const pointMarkForItem = (point, type)=>{
     const [x, y] = point;
-    const themeColor = (0, color_js_namespaceObject.highlightColorForType)('element');
+    const themeColor = (0, external_color_js_namespaceObject.highlightColorForType)('element');
     const graphics = new external_pixi_js_namespaceObject.Graphics();
     graphics.beginFill(themeColor, itemFillAlpha);
     graphics.drawCircle(x, y, pointRadius);
@@ -55,7 +55,7 @@ const pointMarkForItem = (point, type)=>{
 const rectMarkForItem = (rect, name, type)=>{
     const { left, top, width, height } = rect;
     let themeColor;
-    themeColor = 'element' === type ? (0, color_js_namespaceObject.colorForName)(name) : 'searchArea' === type ? (0, color_js_namespaceObject.highlightColorForType)('searchArea') : (0, color_js_namespaceObject.highlightColorForType)('element');
+    themeColor = 'element' === type ? (0, external_color_js_namespaceObject.colorForName)(name) : 'searchArea' === type ? (0, external_color_js_namespaceObject.highlightColorForType)('searchArea') : (0, external_color_js_namespaceObject.highlightColorForType)('element');
     const alpha = 'highlight' === type ? highlightAlpha : itemFillAlpha;
     const graphics = new external_pixi_js_namespaceObject.Graphics();
     graphics.beginFill(themeColor, alpha);

package/dist/lib/component/describer.css

@@ -0,0 +1,25 @@
+.image-describer {
+  position: relative;
+}
+
+.image-describer .describe-text {
+  box-sizing: border-box;
+  color: #fff;
+  background: #000;
+  width: 100%;
+  height: 30px;
+  padding: 10px;
+  font-size: 12px;
+  position: absolute;
+  bottom: 0;
+  left: 0;
+}
+
+.image-describer .describe-text.success {
+  background: #047704;
+}
+
+.image-describer .describe-text.error {
+  background: #870707;
+}
+

package/dist/lib/component/{env-config/index.js → env-config.js}

@@ -30,7 +30,7 @@ const jsx_runtime_namespaceObject = require("react/jsx-runtime");
 const icons_namespaceObject = require("@ant-design/icons");
 const external_antd_namespaceObject = require("antd");
 const external_react_namespaceObject = require("react");
-const store_js_namespaceObject = require("../../store/store.js");
+const store_js_namespaceObject = require("./store/store.js");
 function EnvConfig(param) {
     let { showTooltipWhenEmpty = true, showModelName = true, tooltipPlacement = 'bottom', mode = 'icon' } = param;
     const { config, configString, loadConfig, syncFromStorage } = (0, store_js_namespaceObject.useEnvConfig)();