@midscene/visualizer 0.27.5-beta-20250828012822.0 → 0.27.5

package/dist/es/component/playground/FormField.mjs

@@ -3,8 +3,8 @@ import { Form, Input, InputNumber, Select } from "antd";
 const { TextArea } = Input;
 const renderLabel = (label, isOptional)=>`${label}${isOptional ? ' (Optional)' : ''}`;
 const TextField = (param)=>{
-    let { name, label, isRequired, marginBottom } = param;
-    const placeholder = `Enter ${name}`;
+    let { name, label, isRequired, marginBottom, placeholder: customPlaceholder } = param;
+    const placeholder = customPlaceholder || `Enter ${name}`;
     return /*#__PURE__*/ jsx(Form.Item, {
         name: [
             'params',
@@ -26,7 +26,8 @@ const TextField = (param)=>{
     }, name);
 };
 const LocateField = (param)=>{
-    let { name, label, isRequired, marginBottom } = param;
+    let { name, label, isRequired, marginBottom, placeholder: customPlaceholder } = param;
+    const placeholder = customPlaceholder || `Describe the ${name}, use natural language`;
     return /*#__PURE__*/ jsx(Form.Item, {
         name: [
             'params',
@@ -36,7 +37,7 @@ const LocateField = (param)=>{
         rules: isRequired ? [
             {
                 required: true,
-                message: `Please describe the ${name}`
+                message: `The ${name} is required`
             }
         ] : [],
         style: {
@@ -44,12 +45,12 @@ const LocateField = (param)=>{
         },
         children: /*#__PURE__*/ jsx(TextArea, {
             rows: 2,
-            placeholder: `Describe the ${name}, use natural language`
+            placeholder: placeholder
         })
     }, name);
 };
 const EnumField = (param)=>{
-    let { name, label, fieldSchema, isRequired, marginBottom } = param;
+    let { name, label, fieldSchema, isRequired, marginBottom, placeholder: customPlaceholder } = param;
     const enumValues = fieldSchema._def.values || [];
     const selectOptions = enumValues.map((value)=>({
             value,
@@ -71,14 +72,15 @@ const EnumField = (param)=>{
             marginBottom
         },
         children: /*#__PURE__*/ jsx(Select, {
-            placeholder: `Select ${name}`,
+            placeholder: customPlaceholder || `Select ${name}`,
             options: selectOptions
         })
     }, name);
 };
 const NumberField = (param)=>{
-    let { name, label, isRequired, marginBottom } = param;
-    const placeholder = 'distance' === name ? 500 : 0;
+    let { name, label, isRequired, marginBottom, placeholder: customPlaceholder } = param;
+    const defaultPlaceholder = 'distance' === name ? 500 : 0;
+    const placeholderValue = customPlaceholder ? Number(customPlaceholder) || defaultPlaceholder : defaultPlaceholder;
     const min = 0;
     const max = 'distance' === name ? 10000 : void 0;
     return /*#__PURE__*/ jsx(Form.Item, {
@@ -109,7 +111,7 @@ const NumberField = (param)=>{
             marginBottom
         },
         children: /*#__PURE__*/ jsx(InputNumber, {
-            placeholder: placeholder.toString(),
+            placeholder: placeholderValue.toString(),
             min: min,
             max: max,
             step: 'distance' === name ? 10 : 1,

package/dist/es/component/playground/PromptInput.mjs

@@ -30,13 +30,42 @@ const PromptInput = (param)=>{
     const needsStructuredParams = useMemo(()=>{
         if (actionSpace) {
             const action = actionSpace.find((a)=>a.interfaceAlias === selectedType || a.name === selectedType);
-            return !!(null == action ? void 0 : action.paramSchema);
+            if (!(null == action ? void 0 : action.paramSchema)) return false;
+            if (isZodObjectSchema(action.paramSchema)) {
+                const schema = action.paramSchema;
+                const shape = schema.shape || {};
+                const shapeKeys = Object.keys(shape);
+                return shapeKeys.length > 0;
+            }
+            return true;
         }
         return false;
     }, [
         selectedType,
         actionSpace
     ]);
+    const needsAnyInput = useMemo(()=>{
+        if (actionSpace && actionSpace.length > 0) {
+            const action = actionSpace.find((a)=>a.interfaceAlias === selectedType || a.name === selectedType);
+            if (action) {
+                if (action.paramSchema && isZodObjectSchema(action.paramSchema)) {
+                    const schema = action.paramSchema;
+                    const shape = schema.shape || {};
+                    const hasRequiredFields = Object.keys(shape).some((key)=>{
+                        const field = shape[key];
+                        const { isOptional } = unwrapZodType(field);
+                        return !isOptional;
+                    });
+                    return hasRequiredFields;
+                }
+                return !!action.paramSchema;
+            }
+        }
+        return true;
+    }, [
+        selectedType,
+        actionSpace
+    ]);
     const showDataExtractionOptions = useMemo(()=>{
         const dataExtractionMethods = [
             'aiQuery',
@@ -56,11 +85,12 @@ const PromptInput = (param)=>{
             const action = actionSpace.find((a)=>a.interfaceAlias === selectedType || a.name === selectedType);
             if ((null == action ? void 0 : action.paramSchema) && isZodObjectSchema(action.paramSchema)) {
                 const schema = action.paramSchema;
-                return Object.keys(schema.shape).some((key)=>{
+                const hasLocateField = Object.keys(schema.shape).some((key)=>{
                     const field = schema.shape[key];
                     const { actualField } = unwrapZodType(field);
                     return isLocateField(actualField);
                 });
+                return hasLocateField;
             }
         }
         return false;
@@ -68,14 +98,43 @@ const PromptInput = (param)=>{
         selectedType,
         actionSpace
     ]);
+    const hasConfigOptions = useMemo(()=>{
+        const hasTracking = 'In-Browser-Extension' === serviceMode;
+        const hasDeepThink = showDeepThinkOption;
+        const hasDataExtraction = showDataExtractionOptions && !hideDomAndScreenshotOptions;
+        return hasTracking || hasDeepThink || hasDataExtraction;
+    }, [
+        serviceMode,
+        showDeepThinkOption,
+        showDataExtractionOptions,
+        hideDomAndScreenshotOptions
+    ]);
+    const availableDropdownMethods = useMemo(()=>{
+        const metadataMethods = Object.keys(apiMetadata);
+        if (!actionSpace || 0 === actionSpace.length) return metadataMethods;
+        const availableMethods = actionSpace.map((action)=>action.interfaceAlias || action.name);
+        const finalMethods = new Set();
+        metadataMethods.forEach((method)=>{
+            const methodInfo = apiMetadata[method];
+            if ((null == methodInfo ? void 0 : methodInfo.group) === 'extraction' || (null == methodInfo ? void 0 : methodInfo.group) === 'validation') finalMethods.add(method);
+            else if (availableMethods.includes(method)) finalMethods.add(method);
+        });
+        availableMethods.forEach((method)=>{
+            finalMethods.add(method);
+        });
+        return Array.from(finalMethods);
+    }, [
+        actionSpace
+    ]);
     const getDefaultParams = useCallback(()=>{
         if (!needsStructuredParams || !actionSpace) return {};
         const action = actionSpace.find((a)=>a.interfaceAlias === selectedType || a.name === selectedType);
         if ((null == action ? void 0 : action.paramSchema) && isZodObjectSchema(action.paramSchema)) {
             const defaultParams = {};
             const schema = action.paramSchema;
-            Object.keys(schema.shape).forEach((key)=>{
-                const field = schema.shape[key];
+            const shape = schema.shape || {};
+            Object.keys(shape).forEach((key)=>{
+                const field = shape[key];
                 const defaultValue = extractDefaultValue(field);
                 if (void 0 !== defaultValue) defaultParams[key] = defaultValue;
             });
@@ -152,7 +211,8 @@ const PromptInput = (param)=>{
         const action = actionSpace.find((a)=>a.interfaceAlias === selectedType || a.name === selectedType);
         if ((null == action ? void 0 : action.paramSchema) && isZodObjectSchema(action.paramSchema)) {
             const schema = action.paramSchema;
-            return 1 === Object.keys(schema.shape).length;
+            const shape = schema.shape || {};
+            return 1 === Object.keys(shape).length;
         }
         return false;
     }, [
@@ -177,10 +237,11 @@ const PromptInput = (param)=>{
                 let locateValue = '';
                 const otherValues = [];
                 const schema = action.paramSchema;
-                Object.keys(schema.shape).forEach((key)=>{
+                const shape = schema.shape || {};
+                Object.keys(shape).forEach((key)=>{
                     const paramValue = values.params[key];
                     if (null != paramValue && '' !== paramValue) {
-                        const field = schema.shape[key];
+                        const field = shape[key];
                         const { actualField } = unwrapZodType(field);
                         if (isLocateField(actualField)) locateValue = String(paramValue);
                         else if ('distance' === key) otherValues.push(`${paramValue}`);
@@ -252,19 +313,33 @@ const PromptInput = (param)=>{
             const action = actionSpace.find((a)=>a.interfaceAlias === selectedType || a.name === selectedType);
             if ((null == action ? void 0 : action.paramSchema) && isZodObjectSchema(action.paramSchema)) {
                 const schema = action.paramSchema;
-                const schemaKeys = Object.keys(schema.shape);
+                const shape = schema.shape || {};
+                const schemaKeys = Object.keys(shape);
                 if (1 === schemaKeys.length) {
                     const key = schemaKeys[0];
-                    const field = schema.shape[key];
+                    const field = shape[key];
                     const { actualField } = unwrapZodType(field);
                     const isLocateFieldFlag = isLocateField(actualField);
-                    let placeholderText = '';
-                    if (isLocateFieldFlag) placeholderText = 'Describe the element you want to interact with';
-                    else {
-                        placeholderText = `Enter ${key}`;
-                        if ('keyName' === key) placeholderText = 'Enter key name or text to type';
-                        if ('value' === key) placeholderText = 'Enter text to input';
-                    }
+                    const placeholderText = (()=>{
+                        var _fieldAsAny__def;
+                        const fieldAsAny = actualField;
+                        if (null == (_fieldAsAny__def = fieldAsAny._def) ? void 0 : _fieldAsAny__def.description) return fieldAsAny._def.description;
+                        if (fieldAsAny.description) return fieldAsAny.description;
+                        if (actionSpace) {
+                            const action = actionSpace.find((a)=>a.interfaceAlias === selectedType || a.name === selectedType);
+                            if ((null == action ? void 0 : action.paramSchema) && 'object' == typeof action.paramSchema && 'shape' in action.paramSchema) {
+                                var _fieldDef__def;
+                                const shape = action.paramSchema.shape || {};
+                                const fieldDef = shape[key];
+                                if (null == fieldDef ? void 0 : null == (_fieldDef__def = fieldDef._def) ? void 0 : _fieldDef__def.description) return fieldDef._def.description;
+                                if (null == fieldDef ? void 0 : fieldDef.description) return fieldDef.description;
+                            }
+                        }
+                        if (isLocateFieldFlag) return 'Describe the element you want to interact with';
+                        if ('keyName' === key) return 'Enter key name or text to type';
+                        if ('value' === key) return 'Enter text to input';
+                        return `Enter ${key}`;
+                    })();
                     return /*#__PURE__*/ jsx(Form.Item, {
                         name: [
                             'params',
@@ -285,18 +360,36 @@ const PromptInput = (param)=>{
                 const fields = [];
                 schemaKeys.forEach((key, index)=>{
                     var _actualField__def, _actualField__def1;
-                    const fieldSchema = schema.shape[key];
+                    const fieldSchema = shape[key];
                     const { actualField, isOptional } = unwrapZodType(fieldSchema);
                     const isLocateFieldFlag = isLocateField(actualField);
                     const label = key.charAt(0).toUpperCase() + key.slice(1);
                     const isRequired = !isOptional;
                     const marginBottom = index === schemaKeys.length - 1 ? 0 : 12;
+                    const placeholder = (()=>{
+                        var _fieldAsAny__def;
+                        const fieldAsAny = actualField;
+                        if (null == (_fieldAsAny__def = fieldAsAny._def) ? void 0 : _fieldAsAny__def.description) return fieldAsAny._def.description;
+                        if (fieldAsAny.description) return fieldAsAny.description;
+                        if (actionSpace) {
+                            const action = actionSpace.find((a)=>a.interfaceAlias === selectedType || a.name === selectedType);
+                            if ((null == action ? void 0 : action.paramSchema) && 'object' == typeof action.paramSchema && 'shape' in action.paramSchema) {
+                                var _fieldDef__def;
+                                const shape = action.paramSchema.shape || {};
+                                const fieldDef = shape[key];
+                                if (null == fieldDef ? void 0 : null == (_fieldDef__def = fieldDef._def) ? void 0 : _fieldDef__def.description) return fieldDef._def.description;
+                                if (null == fieldDef ? void 0 : fieldDef.description) return fieldDef.description;
+                            }
+                        }
+                        if (isLocateFieldFlag) return 'Describe the element you want to interact with';
+                    })();
                     const fieldProps = {
                         name: key,
                         label,
                         fieldSchema: actualField,
                         isRequired,
-                        marginBottom
+                        marginBottom,
+                        placeholder
                     };
                     if (isLocateFieldFlag) fields.push(/*#__PURE__*/ jsx(LocateField, {
                         ...fieldProps
@@ -419,45 +512,77 @@ const PromptInput = (param)=>{
                             }),
                             /*#__PURE__*/ jsx(Dropdown, {
                                 menu: (()=>{
-                                    const hiddenAPIs = Object.keys(apiMetadata).filter((api)=>!defaultMainButtons.includes(api));
+                                    const hiddenAPIs = availableDropdownMethods.filter((api)=>!defaultMainButtons.includes(api));
                                     const groupedItems = [];
-                                    const interactionAPIs = hiddenAPIs.filter((api)=>'interaction' === apiMetadata[api].group);
+                                    const interactionAPIs = hiddenAPIs.filter((api)=>{
+                                        var _apiMetadata_api;
+                                        return (null == (_apiMetadata_api = apiMetadata[api]) ? void 0 : _apiMetadata_api.group) === 'interaction';
+                                    });
                                     if (interactionAPIs.length > 0) groupedItems.push({
                                         key: 'interaction-group',
                                         type: 'group',
                                         label: 'Interaction APIs',
-                                        children: interactionAPIs.map((api)=>({
+                                        children: interactionAPIs.map((api)=>{
+                                            var _apiMetadata_api;
+                                            return {
                                                 key: api,
                                                 label: actionNameForType(api),
-                                                title: apiMetadata[api].title,
+                                                title: (null == (_apiMetadata_api = apiMetadata[api]) ? void 0 : _apiMetadata_api.title) || '',
                                                 onClick: ()=>{
                                                     form.setFieldValue('type', api);
                                                 }
-                                            }))
+                                            };
+                                        })
+                                    });
+                                    const extractionAPIs = hiddenAPIs.filter((api)=>{
+                                        var _apiMetadata_api;
+                                        return (null == (_apiMetadata_api = apiMetadata[api]) ? void 0 : _apiMetadata_api.group) === 'extraction';
                                     });
-                                    const extractionAPIs = hiddenAPIs.filter((api)=>'extraction' === apiMetadata[api].group);
                                     if (extractionAPIs.length > 0) groupedItems.push({
                                         key: 'extraction-group',
                                         type: 'group',
                                         label: 'Data Extraction APIs',
-                                        children: extractionAPIs.map((api)=>({
+                                        children: extractionAPIs.map((api)=>{
+                                            var _apiMetadata_api;
+                                            return {
                                                 key: api,
                                                 label: actionNameForType(api),
-                                                title: apiMetadata[api].title,
+                                                title: (null == (_apiMetadata_api = apiMetadata[api]) ? void 0 : _apiMetadata_api.title) || '',
                                                 onClick: ()=>{
                                                     form.setFieldValue('type', api);
                                                 }
-                                            }))
+                                            };
+                                        })
+                                    });
+                                    const validationAPIs = hiddenAPIs.filter((api)=>{
+                                        var _apiMetadata_api;
+                                        return (null == (_apiMetadata_api = apiMetadata[api]) ? void 0 : _apiMetadata_api.group) === 'validation';
                                     });
-                                    const validationAPIs = hiddenAPIs.filter((api)=>'validation' === apiMetadata[api].group);
                                     if (validationAPIs.length > 0) groupedItems.push({
                                         key: 'validation-group',
                                         type: 'group',
                                         label: 'Validation APIs',
-                                        children: validationAPIs.map((api)=>({
+                                        children: validationAPIs.map((api)=>{
+                                            var _apiMetadata_api;
+                                            return {
                                                 key: api,
                                                 label: actionNameForType(api),
-                                                title: apiMetadata[api].title,
+                                                title: (null == (_apiMetadata_api = apiMetadata[api]) ? void 0 : _apiMetadata_api.title) || '',
+                                                onClick: ()=>{
+                                                    form.setFieldValue('type', api);
+                                                }
+                                            };
+                                        })
+                                    });
+                                    const deviceSpecificAPIs = hiddenAPIs.filter((api)=>!apiMetadata[api]);
+                                    if (deviceSpecificAPIs.length > 0) groupedItems.push({
+                                        key: 'device-specific-group',
+                                        type: 'group',
+                                        label: 'Device-Specific APIs',
+                                        children: deviceSpecificAPIs.map((api)=>({
+                                                key: api,
+                                                label: actionNameForType(api),
+                                                title: '',
                                                 onClick: ()=>{
                                                     form.setFieldValue('type', api);
                                                 }
@@ -495,7 +620,7 @@ const PromptInput = (param)=>{
                                 history: historyForSelectedType,
                                 currentType: selectedType
                             }),
-                            /*#__PURE__*/ jsx("div", {
+                            hasConfigOptions && /*#__PURE__*/ jsx("div", {
                                 className: hoveringSettings ? 'settings-wrapper settings-wrapper-hover' : 'settings-wrapper',
                                 onMouseEnter: handleMouseEnter,
                                 onMouseLeave: handleMouseLeave,
@@ -513,7 +638,7 @@ const PromptInput = (param)=>{
             /*#__PURE__*/ jsxs("div", {
                 className: `main-side-console-input ${!runButtonEnabled ? 'disabled' : ''} ${loading ? 'loading' : ''}`,
                 children: [
-                    needsStructuredParams ? hasSingleStructuredParam ? renderStructuredParams() : /*#__PURE__*/ jsx("div", {
+                    needsAnyInput ? needsStructuredParams ? hasSingleStructuredParam ? renderStructuredParams() : /*#__PURE__*/ jsx("div", {
                         className: "structured-params-container",
                         children: renderStructuredParams()
                     }) : /*#__PURE__*/ jsx(Form.Item, {
@@ -531,6 +656,18 @@ const PromptInput = (param)=>{
                             onChange: handlePromptChange,
                             ref: textAreaRef
                         })
+                    }) : /*#__PURE__*/ jsxs("div", {
+                        className: "no-input-method",
+                        style: {
+                            padding: '20px',
+                            textAlign: 'center',
+                            color: '#666',
+                            fontSize: '14px'
+                        },
+                        children: [
+                            'Click "Run" to execute ',
+                            actionNameForType(selectedType)
+                        ]
                     }),
                     /*#__PURE__*/ jsx("div", {
                         className: "form-controller-wrapper",

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

@@ -58,11 +58,18 @@ body {
   border-radius: 11px;
   align-items: center;
   gap: 2px;
+  max-width: 160px;
   padding: 0 8px;
   font-size: 12px;
   display: inline-flex;
 }
 
+.prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .more-apis-button .ant-btn-content {
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  overflow: hidden;
+}
+
 .prompt-input-wrapper .mode-radio-group-wrapper .mode-radio-group .more-apis-button:hover {
   background-color: #e6e6e6;
 }

package/dist/es/component/playground/playground-execution.mjs

@@ -0,0 +1,114 @@
+import { findAllMidsceneLocatorField } from "@midscene/core/ai-model";
+const formatErrorMessage = (e)=>{
+    const errorMessage = (null == e ? void 0 : e.message) || '';
+    if (errorMessage.includes('of different extension')) return 'Conflicting extension detected. Please disable the suspicious plugins and refresh the page. Guide: https://midscenejs.com/quick-experience.html#faq';
+    return errorMessage || 'Unknown error';
+};
+async function parseStructuredParams(action, params) {
+    let options = arguments.length > 2 && void 0 !== arguments[2] ? arguments[2] : {};
+    if (!(null == action ? void 0 : action.paramSchema) || !('shape' in action.paramSchema)) return [
+        params.prompt || '',
+        options
+    ];
+    const schema = action.paramSchema;
+    const keys = Object.keys(schema.shape);
+    const paramObj = {
+        ...options
+    };
+    keys.forEach((key)=>{
+        if (void 0 !== params[key] && null !== params[key] && '' !== params[key]) paramObj[key] = params[key];
+    });
+    return [
+        paramObj
+    ];
+}
+function validateStructuredParams(value, action) {
+    if (!value.params) return {
+        valid: false,
+        errorMessage: 'Parameters are required'
+    };
+    if (!(null == action ? void 0 : action.paramSchema)) return {
+        valid: true
+    };
+    try {
+        var _action_paramSchema;
+        const paramsForValidation = {
+            ...value.params
+        };
+        const schema = action.paramSchema;
+        if (schema) {
+            const locatorFieldKeys = findAllMidsceneLocatorField(schema);
+            locatorFieldKeys.forEach((key)=>{
+                if ('string' == typeof paramsForValidation[key]) paramsForValidation[key] = {
+                    midscene_location_field_flag: true,
+                    prompt: paramsForValidation[key],
+                    center: [
+                        0,
+                        0
+                    ],
+                    rect: {
+                        left: 0,
+                        top: 0,
+                        width: 0,
+                        height: 0
+                    }
+                };
+            });
+        }
+        null == (_action_paramSchema = action.paramSchema) || _action_paramSchema.parse(paramsForValidation);
+    } catch (error) {
+        const zodError = error;
+        if (zodError.errors && zodError.errors.length > 0) {
+            const errorMessages = zodError.errors.filter((err)=>{
+                const path = err.path.join('.');
+                return !path.includes('center') && !path.includes('rect') && !path.includes('midscene_location_field_flag');
+            }).map((err)=>{
+                const field = err.path.join('.');
+                return `${field}: ${err.message}`;
+            });
+            if (errorMessages.length > 0) return {
+                valid: false,
+                errorMessage: `Validation error: ${errorMessages.join(', ')}`
+            };
+        } else {
+            const errorMsg = error instanceof Error ? error.message : 'Unknown validation error';
+            return {
+                valid: false,
+                errorMessage: `Parameter validation failed: ${errorMsg}`
+            };
+        }
+    }
+    return {
+        valid: true
+    };
+}
+async function executeAction(activeAgent, actionType, actionSpace, value, deepThink) {
+    const action = null == actionSpace ? void 0 : actionSpace.find((a)=>a.interfaceAlias === actionType || a.name === actionType);
+    if (action && 'function' == typeof activeAgent.callActionInActionSpace) if (!value.params) return await activeAgent.callActionInActionSpace(action.name, {
+        prompt: value.prompt,
+        deepThink
+    });
+    else {
+        const parsedParams = await parseStructuredParams(action, value.params, {
+            deepThink
+        });
+        return await activeAgent.callActionInActionSpace(action.name, parsedParams[0]);
+    }
+    {
+        const prompt = value.prompt;
+        if ('aiAssert' === actionType) {
+            const { pass, thought } = await (null == activeAgent ? void 0 : activeAgent.aiAssert(prompt, void 0, {
+                keepRawResponse: true
+            })) || {};
+            return {
+                pass,
+                thought
+            };
+        }
+        if (activeAgent && 'function' == typeof activeAgent[actionType]) return await activeAgent[actionType](prompt, {
+            deepThink
+        });
+        throw new Error(`Unknown action type: ${actionType}`);
+    }
+}
+export { executeAction, formatErrorMessage, validateStructuredParams };

package/dist/es/component/playground/playground-utils.mjs

@@ -1,5 +1,5 @@
 import { PLAYGROUND_SERVER_PORT } from "@midscene/shared/constants";
-import { ERROR_CODE_NOT_IMPLEMENTED_AS_DESIGNED, StaticPage, StaticPageAgent } from "@midscene/web/playground";
+import { StaticPage, StaticPageAgent } from "@midscene/web/playground";
 import { isZodObjectSchema, unwrapZodType } from "./types.mjs";
 const serverBase = `http://localhost:${PLAYGROUND_SERVER_PORT}`;
 const checkServerStatus = async ()=>{
@@ -11,7 +11,7 @@ const checkServerStatus = async ()=>{
     }
 };
 const requestPlaygroundServer = async function(context, type, prompt) {
-    let { requestId, deepThink, screenshotIncluded, domIncluded } = arguments.length > 3 && void 0 !== arguments[3] ? arguments[3] : {};
+    let { requestId, deepThink, params, screenshotIncluded, domIncluded } = arguments.length > 3 && void 0 !== arguments[3] ? arguments[3] : {};
     const payload = {
         context,
         type,
@@ -21,6 +21,7 @@ const requestPlaygroundServer = async function(context, type, prompt) {
     if (deepThink) payload.deepThink = deepThink;
     if (void 0 !== screenshotIncluded) payload.screenshotIncluded = screenshotIncluded;
     if (void 0 !== domIncluded) payload.domIncluded = domIncluded;
+    if (params) payload.params = params;
     const res = await fetch(`${serverBase}/execute`, {
         method: 'POST',
         headers: {
@@ -61,9 +62,31 @@ const getTaskProgress = async (requestId)=>{
         };
     }
 };
+const getActionSpace = async (context)=>{
+    try {
+        if (!context) return [];
+        const response = await fetch(`${serverBase}/action-space`, {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json'
+            },
+            body: JSON.stringify({
+                context
+            })
+        });
+        if (response.ok) return await response.json();
+        return [];
+    } catch (error) {
+        console.error('Failed to get action space:', error);
+        return [];
+    }
+};
 const actionNameForType = (type)=>{
     const typeWithoutAi = type.startsWith('ai') ? type.slice(2) : type;
-    return typeWithoutAi.replace(/([A-Z])/g, ' $1').trim();
+    const fullName = typeWithoutAi.replace(/([A-Z])/g, ' $1').trim();
+    const words = fullName.split(' ');
+    if (words.length > 3) return words.slice(-3).join(' ');
+    return fullName;
 };
 const staticAgentFromContext = (context)=>{
     const page = new StaticPage(context);
@@ -72,8 +95,7 @@ const staticAgentFromContext = (context)=>{
 const formatErrorMessage = (e)=>{
     const errorMessage = (null == e ? void 0 : e.message) || '';
     if (errorMessage.includes('of different extension')) return 'Conflicting extension detected. Please disable the suspicious plugins and refresh the page. Guide: https://midscenejs.com/quick-experience.html#faq';
-    if (!(null == errorMessage ? void 0 : errorMessage.includes(ERROR_CODE_NOT_IMPLEMENTED_AS_DESIGNED))) return errorMessage;
-    return 'Unknown error';
+    return errorMessage || 'Unknown error';
 };
 const getPlaceholderForType = (type)=>{
     if ('aiQuery' === type) return 'What do you want to query?';
@@ -100,13 +122,29 @@ const blankResult = {
 };
 const isRunButtonEnabled = (runButtonEnabled, needsStructuredParams, params, actionSpace, selectedType, promptValue)=>{
     if (!runButtonEnabled) return false;
+    const needsAnyInput = (()=>{
+        if (actionSpace) {
+            const action = actionSpace.find((a)=>a.interfaceAlias === selectedType || a.name === selectedType);
+            if (action) {
+                if (!action.paramSchema) return false;
+                if ('object' == typeof action.paramSchema && 'shape' in action.paramSchema) {
+                    const shape = action.paramSchema.shape || {};
+                    const shapeKeys = Object.keys(shape);
+                    return shapeKeys.length > 0;
+                }
+            }
+        }
+        return true;
+    })();
+    if (!needsAnyInput) return true;
     if (needsStructuredParams) {
         const currentParams = params || {};
         const action = null == actionSpace ? void 0 : actionSpace.find((a)=>a.interfaceAlias === selectedType || a.name === selectedType);
         if ((null == action ? void 0 : action.paramSchema) && isZodObjectSchema(action.paramSchema)) {
             const schema = action.paramSchema;
-            return Object.keys(schema.shape).every((key)=>{
-                const field = schema.shape[key];
+            const shape = schema.shape || {};
+            return Object.keys(shape).every((key)=>{
+                const field = shape[key];
                 const { isOptional } = unwrapZodType(field);
                 const value = currentParams[key];
                 return isOptional || void 0 !== value && '' !== value && null !== value;
@@ -116,4 +154,4 @@ const isRunButtonEnabled = (runButtonEnabled, needsStructuredParams, params, act
     }
     return promptValue.trim().length > 0;
 };
-export { actionNameForType, blankResult, cancelTask, checkServerStatus, formatErrorMessage, getPlaceholderForType, getTaskProgress, isRunButtonEnabled, overrideServerConfig, requestPlaygroundServer, serverBase, staticAgentFromContext };
+export { actionNameForType, blankResult, cancelTask, checkServerStatus, formatErrorMessage, getActionSpace, getPlaceholderForType, getTaskProgress, isRunButtonEnabled, overrideServerConfig, requestPlaygroundServer, serverBase, staticAgentFromContext };