@godscene/visualizer 1.7.11

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

@@ -0,0 +1,43 @@
+import { StaticPage, StaticPageAgent } from "@godscene/web/static";
+import { isZodObjectSchema, unwrapZodType } from "../types.mjs";
+import { actionNameForType } from "./action-label.mjs";
+import { getPlaceholderForType } from "./prompt-placeholder.mjs";
+const staticAgentFromContext = (context)=>{
+    const page = new StaticPage(context);
+    return new StaticPageAgent(page);
+};
+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;
+            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;
+            });
+        }
+        return true;
+    }
+    return promptValue.trim().length > 0;
+};
+export { actionNameForType, getPlaceholderForType, isRunButtonEnabled, staticAgentFromContext };

package/dist/es/utils/progress-action-icon.mjs

@@ -0,0 +1,30 @@
+import { createElement } from "react";
+function CompletedActionIcon() {
+    return /*#__PURE__*/ createElement('svg', {
+        width: 16,
+        height: 16,
+        viewBox: '0 0 24 24',
+        fill: 'none',
+        xmlns: 'http://www.w3.org/2000/svg',
+        'aria-hidden': true,
+        focusable: false
+    }, /*#__PURE__*/ createElement('path', {
+        d: 'M7.3335 12L10.6668 15.3334L17.3335 8.66669',
+        stroke: '#188F4D',
+        strokeWidth: '1.33333',
+        strokeLinecap: 'round',
+        strokeLinejoin: 'round'
+    }));
+}
+function defaultProgressActionIcon(_kind) {
+    return /*#__PURE__*/ createElement(CompletedActionIcon);
+}
+function resolveProgressActionIcon(kind, override) {
+    if (!kind) return null;
+    if (override) {
+        const custom = override(kind);
+        if (void 0 !== custom) return custom;
+    }
+    return defaultProgressActionIcon(kind);
+}
+export { defaultProgressActionIcon, resolveProgressActionIcon };

package/dist/es/utils/prompt-input-utils.mjs

@@ -0,0 +1,49 @@
+import { isLocateField, isZodObjectSchema, unwrapZodType } from "../types.mjs";
+import { apiMetadata } from "./constants.mjs";
+const getAvailablePromptActionTypes = (actionSpace)=>{
+    const metadataMethods = Object.keys(apiMetadata);
+    if (!(null == actionSpace ? void 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 ('aiAct' === method) return void finalMethods.add(method);
+        if ((null == methodInfo ? void 0 : methodInfo.group) === 'extraction' || (null == methodInfo ? void 0 : methodInfo.group) === 'validation') return void finalMethods.add(method);
+        if (availableMethods.includes(method)) finalMethods.add(method);
+    });
+    availableMethods.forEach((method)=>{
+        finalMethods.add(method);
+    });
+    return Array.from(finalMethods);
+};
+const getInlineStructuredFieldConfig = (actionSpace, selectedType)=>{
+    var _actualField__def, _actualField__def1;
+    if (!(null == actionSpace ? void 0 : actionSpace.length) || !selectedType) return null;
+    const action = actionSpace.find((item)=>item.interfaceAlias === selectedType || item.name === selectedType);
+    if (!(null == action ? void 0 : action.paramSchema) || !isZodObjectSchema(action.paramSchema)) return null;
+    const schema = action.paramSchema;
+    const shape = schema.shape || {};
+    const keys = Object.keys(shape);
+    if (1 !== keys.length) return null;
+    const [name] = keys;
+    const field = shape[name];
+    const { actualField } = unwrapZodType(field);
+    const isLocate = isLocateField(actualField);
+    const fieldType = null == (_actualField__def = actualField._def) ? void 0 : _actualField__def.typeName;
+    const isInlineField = 'ZodString' === fieldType || isLocate;
+    if (!isInlineField) return null;
+    const placeholder = (null == (_actualField__def1 = actualField._def) ? void 0 : _actualField__def1.description) || actualField.description || (isLocate ? 'Describe the element you want to interact with' : `Enter ${name}`);
+    return {
+        name,
+        placeholder
+    };
+};
+const shouldOffsetEmptyStateForPromptInput = (actionSpace, selectedType)=>{
+    if (!(null == actionSpace ? void 0 : actionSpace.length) || !selectedType) return false;
+    if (getInlineStructuredFieldConfig(actionSpace, selectedType)) return false;
+    const action = actionSpace.find((item)=>item.interfaceAlias === selectedType || item.name === selectedType);
+    if (!(null == action ? void 0 : action.paramSchema) || !isZodObjectSchema(action.paramSchema)) return false;
+    const schema = action.paramSchema;
+    return Object.keys(schema.shape || {}).length > 1;
+};
+export { getAvailablePromptActionTypes, getInlineStructuredFieldConfig, shouldOffsetEmptyStateForPromptInput };

package/dist/es/utils/prompt-placeholder.mjs

@@ -0,0 +1,19 @@
+const getPlaceholderForType = (type)=>{
+    if ('aiQuery' === type) return 'What do you want to query?';
+    if ('aiAssert' === type) return 'What do you want to assert?';
+    if ('aiTap' === type) return 'What element do you want to tap?';
+    if ('aiDoubleClick' === type) return 'What element do you want to double-click?';
+    if ('aiHover' === type) return 'What element do you want to hover over?';
+    if ('aiInput' === type) return 'Format: <value> | <element>\nExample: hello world | search box';
+    if ('aiRightClick' === type) return 'What element do you want to right-click?';
+    if ('aiKeyboardPress' === type) return 'Format: <key> | <element (optional)>\nExample: Enter | text field';
+    if ('aiScroll' === type) return 'Format: <direction> <amount> | <element (optional)>\nExample: down 500 | main content';
+    if ('aiLocate' === type) return 'What element do you want to locate?';
+    if ('aiBoolean' === type) return 'What do you want to check (returns true/false)?';
+    if ('aiNumber' === type) return 'What number do you want to extract?';
+    if ('aiString' === type) return 'What text do you want to extract?';
+    if ('aiAsk' === type) return 'What do you want to ask?';
+    if ('aiWaitFor' === type) return 'What condition do you want to wait for?';
+    return 'What do you want to do?';
+};
+export { getPlaceholderForType };

package/dist/es/utils/replay-scripts.mjs

@@ -0,0 +1,428 @@
+"use client";
+import { mousePointer } from "./index.mjs";
+import { paramStr, typeStr } from "@godscene/core/agent";
+import { getCenterHighlightBox, normalizeHighlightElementForReport } from "./highlight-element.mjs";
+function _define_property(obj, key, value) {
+    if (key in obj) Object.defineProperty(obj, key, {
+        value: value,
+        enumerable: true,
+        configurable: true,
+        writable: true
+    });
+    else obj[key] = value;
+    return obj;
+}
+function _object_spread(target) {
+    for(var i = 1; i < arguments.length; i++){
+        var source = null != arguments[i] ? arguments[i] : {};
+        var ownKeys = Object.keys(source);
+        if ("function" == typeof Object.getOwnPropertySymbols) ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
+            return Object.getOwnPropertyDescriptor(source, sym).enumerable;
+        }));
+        ownKeys.forEach(function(key) {
+            _define_property(target, key, source[key]);
+        });
+    }
+    return target;
+}
+function replay_scripts_ownKeys(object, enumerableOnly) {
+    var keys = Object.keys(object);
+    if (Object.getOwnPropertySymbols) {
+        var symbols = Object.getOwnPropertySymbols(object);
+        if (enumerableOnly) symbols = symbols.filter(function(sym) {
+            return Object.getOwnPropertyDescriptor(object, sym).enumerable;
+        });
+        keys.push.apply(keys, symbols);
+    }
+    return keys;
+}
+function _object_spread_props(target, source) {
+    source = null != source ? source : {};
+    if (Object.getOwnPropertyDescriptors) Object.defineProperties(target, Object.getOwnPropertyDescriptors(source));
+    else replay_scripts_ownKeys(Object(source)).forEach(function(key) {
+        Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key));
+    });
+    return target;
+}
+const stillDuration = 900;
+const actionSpinningPointerDuration = 300;
+const stillAfterInsightDuration = 300;
+const locateDuration = 800;
+const actionDuration = 500;
+const clearInsightDuration = 200;
+const lastFrameDuration = 200;
+const cameraStateForRect = (rect, imageWidth, imageHeight)=>{
+    const canvasRatio = imageWidth / imageHeight;
+    const rectRatio = rect.width / rect.height;
+    let rectWidthOnPage;
+    rectWidthOnPage = rectRatio >= canvasRatio ? rect.width : rect.height / imageHeight * imageWidth;
+    const cameraPaddingRatio = rectWidthOnPage > 400 ? 0.1 : rectWidthOnPage > 50 ? 0.2 : 0.3;
+    const cameraWidth = Math.min(imageWidth, rectWidthOnPage + imageWidth * cameraPaddingRatio * 2);
+    const cameraHeight = imageHeight / imageWidth * cameraWidth;
+    let left = Math.min(rect.left - imageWidth * cameraPaddingRatio, imageWidth - cameraWidth);
+    left = Math.max(left, 0);
+    let top = Math.min(rect.top - imageHeight * cameraPaddingRatio, imageHeight - cameraHeight);
+    top = Math.max(top, 0);
+    return {
+        left: Math.round(left),
+        top: Math.round(top),
+        width: Math.round(cameraWidth)
+    };
+};
+const createFullPageCameraState = (imageWidth, imageHeight)=>cameraStateForRect({
+        left: 0,
+        top: 0,
+        width: imageWidth,
+        height: imageHeight
+    }, imageWidth, imageHeight);
+const resolveTaskShotSize = (task, fallbackWidth, fallbackHeight)=>{
+    var _task_uiContext_shotSize, _task_uiContext, _task_uiContext_shotSize1, _task_uiContext1;
+    return {
+        width: (null == task ? void 0 : null == (_task_uiContext = task.uiContext) ? void 0 : null == (_task_uiContext_shotSize = _task_uiContext.shotSize) ? void 0 : _task_uiContext_shotSize.width) || fallbackWidth,
+        height: (null == task ? void 0 : null == (_task_uiContext1 = task.uiContext) ? void 0 : null == (_task_uiContext_shotSize1 = _task_uiContext1.shotSize) ? void 0 : _task_uiContext_shotSize1.height) || fallbackHeight
+    };
+};
+const mergeTwoCameraState = (cameraState1, cameraState2)=>{
+    const newLeft = Math.min(cameraState1.left, cameraState2.left);
+    const newTop = Math.min(cameraState1.top, cameraState2.top);
+    const newRight = Math.max(cameraState1.left + cameraState1.width, cameraState2.left + cameraState2.width);
+    const newWidth = newRight - newLeft;
+    return {
+        left: newLeft,
+        top: newTop,
+        width: newWidth
+    };
+};
+const isSameModelBrief = (a, b)=>a.intent === b.intent && a.name === b.name && a.modelDescription === b.modelDescription;
+const pushModelBriefIfNotExists = (list, candidate)=>{
+    if (!list.some((brief)=>isSameModelBrief(brief, candidate))) list.push(candidate);
+};
+const normalizeDump = (dump)=>{
+    if (!dump) return null;
+    return Array.isArray(dump.executions) ? dump : {
+        sdkVersion: '',
+        groupName: 'Execution',
+        modelBriefs: [],
+        executions: [
+            dump
+        ]
+    };
+};
+const extractMetaFromNormalized = (normalizedDump)=>{
+    var _normalizedDump_executions;
+    let firstWidth;
+    let firstHeight;
+    const sdkVersion = normalizedDump.sdkVersion;
+    const modelBriefs = [];
+    null == (_normalizedDump_executions = normalizedDump.executions) || _normalizedDump_executions.filter(Boolean).forEach((execution)=>{
+        execution.tasks.forEach((task)=>{
+            var _task_uiContext_shotSize, _task_uiContext;
+            if (null == (_task_uiContext = task.uiContext) ? void 0 : null == (_task_uiContext_shotSize = _task_uiContext.shotSize) ? void 0 : _task_uiContext_shotSize.width) {
+                const w = task.uiContext.shotSize.width;
+                const h = task.uiContext.shotSize.height;
+                if (!firstWidth) {
+                    firstWidth = w;
+                    firstHeight = h;
+                }
+            }
+            if (task.usage) {
+                const { model_name, model_description, intent } = task.usage;
+                const brief = {
+                    intent,
+                    name: model_name,
+                    modelDescription: model_description
+                };
+                pushModelBriefIfNotExists(modelBriefs, brief);
+            }
+        });
+    });
+    if (!firstWidth || !firstHeight) {
+        console.warn('width or height is missing in dump file');
+        return null;
+    }
+    return {
+        width: firstWidth,
+        height: firstHeight,
+        sdkVersion,
+        modelBriefs,
+        deviceType: normalizedDump.deviceType
+    };
+};
+const extractDumpMetaInfo = (dump)=>{
+    const normalizedDump = normalizeDump(dump);
+    if (!normalizedDump) return null;
+    return extractMetaFromNormalized(normalizedDump);
+};
+const allScriptsFromDump = (dump)=>{
+    var _normalizedDump_executions;
+    const normalizedDump = normalizeDump(dump);
+    if (!normalizedDump) {
+        console.warn('[allScriptsFromDump] dump is empty');
+        return {
+            scripts: [],
+            modelBriefs: []
+        };
+    }
+    const metaInfo = extractMetaFromNormalized(normalizedDump);
+    if (!metaInfo) return {
+        scripts: [],
+        sdkVersion: normalizedDump.sdkVersion,
+        modelBriefs: []
+    };
+    const { width: firstWidth, height: firstHeight } = metaInfo;
+    const allScripts = [];
+    const executions = (null == (_normalizedDump_executions = normalizedDump.executions) ? void 0 : _normalizedDump_executions.filter(Boolean)) || [];
+    for(let execIndex = 0; execIndex < executions.length; execIndex++){
+        const execution = executions[execIndex];
+        const scripts = generateAnimationScripts(execution, -1, firstWidth, firstHeight, execIndex);
+        if (scripts) allScripts.push(...scripts);
+    }
+    const allScriptsWithoutIntermediateDoneFrame = allScripts.filter((script, index)=>{
+        if (index !== allScripts.length - 1 && 'Done' === script.title) return false;
+        return true;
+    });
+    return {
+        scripts: allScriptsWithoutIntermediateDoneFrame,
+        width: firstWidth,
+        height: firstHeight,
+        sdkVersion: metaInfo.sdkVersion,
+        modelBriefs: metaInfo.modelBriefs,
+        deviceType: metaInfo.deviceType
+    };
+};
+const generateAnimationScripts = (execution, task, imageWidth, imageHeight, executionIndex = 0)=>{
+    if (!execution || !execution.tasks.length) return null;
+    if (0 === imageWidth || 0 === imageHeight) return null;
+    let tasksIncluded = [];
+    if (-1 === task) tasksIncluded = execution.tasks;
+    else {
+        const startIndex = execution.tasks.findIndex((t)=>t === task);
+        if (-1 === startIndex) {
+            console.error("task not found, cannot generate animation scripts");
+            return null;
+        }
+        if (startIndex === execution.tasks.length - 1) return null;
+        for(let i = startIndex; i < execution.tasks.length; i++){
+            if (i > startIndex && 'Planning' === execution.tasks[i].type && 'Plan' === execution.tasks[i].subType) break;
+            tasksIncluded.push(execution.tasks[i]);
+        }
+    }
+    if (0 === tasksIncluded.length) return null;
+    const getTaskId = (taskIndex)=>{
+        var _tasksIncluded_taskIndex;
+        return null == (_tasksIncluded_taskIndex = tasksIncluded[taskIndex]) ? void 0 : _tasksIncluded_taskIndex.taskId;
+    };
+    const setPointerScript = (img, title, subTitle, taskId)=>({
+            type: 'pointer',
+            img,
+            duration: 0,
+            title,
+            subTitle,
+            taskId
+        });
+    const asScreenshot = (s)=>s;
+    const createScript = (base, screenshot)=>{
+        if (!screenshot) return base;
+        const script = _object_spread({}, base);
+        let cachedImg = null;
+        Object.defineProperty(script, 'img', {
+            get () {
+                if (null === cachedImg) cachedImg = screenshot.base64;
+                return cachedImg;
+            },
+            enumerable: true
+        });
+        return script;
+    };
+    const scripts = [];
+    let insightCameraState;
+    let insightOnTop = false;
+    let initSubTitle = '';
+    let lastTaskId;
+    tasksIncluded.forEach((task, index)=>{
+        const currentTaskId = getTaskId(index);
+        lastTaskId = currentTaskId;
+        if (0 === index) initSubTitle = paramStr(task);
+        if ('Planning' === task.type) {
+            var _task_output;
+            let locateElements = [];
+            if ('Plan' === task.subType) {
+                var _planTask_output;
+                const planTask = task;
+                const actions = (null == (_planTask_output = planTask.output) ? void 0 : _planTask_output.actions) || [];
+                if (actions.length > 0) {
+                    const action = actions[0];
+                    const knownFields = [
+                        'locate',
+                        'start',
+                        'end'
+                    ];
+                    if (action.param) {
+                        knownFields.forEach((field)=>{
+                            if (action.param[field] && 'object' == typeof action.param[field] && 'center' in (action.param[field] || {})) locateElements.push(action.param[field]);
+                        });
+                        for(const key in action.param)if (!knownFields.includes(key)) {
+                            if ('object' == typeof action.param[key] && 'center' in (action.param[key] || {})) locateElements.push(action.param[key]);
+                        }
+                    }
+                }
+            } else if ('Locate' === task.subType && (null == (_task_output = task.output) ? void 0 : _task_output.element)) {
+                const locateTask = task;
+                locateElements = [
+                    locateTask.output.element
+                ];
+            }
+            const title = typeStr(task);
+            const subTitle = paramStr(task);
+            const context = task.uiContext;
+            if (null == context ? void 0 : context.screenshot) {
+                var _context_shotSize, _context_shotSize1;
+                const width = (null == (_context_shotSize = context.shotSize) ? void 0 : _context_shotSize.width) || imageWidth;
+                const height = (null == (_context_shotSize1 = context.shotSize) ? void 0 : _context_shotSize1.height) || imageHeight;
+                const contextScreenshot = asScreenshot(context.screenshot);
+                scripts.push(createScript({
+                    type: 'img',
+                    duration: stillAfterInsightDuration,
+                    title,
+                    subTitle,
+                    imageWidth: width,
+                    imageHeight: height,
+                    taskId: currentTaskId
+                }, contextScreenshot));
+                locateElements.forEach((element)=>{
+                    var _task_log_taskInfo, _task_log, _context_shotSize, _context_shotSize1;
+                    const highlightElement = normalizeHighlightElementForReport(element);
+                    const highlightBox = getCenterHighlightBox(highlightElement);
+                    insightCameraState = _object_spread_props(_object_spread({}, cameraStateForRect(highlightBox, width, height)), {
+                        pointerLeft: highlightElement.center[0],
+                        pointerTop: highlightElement.center[1]
+                    });
+                    const newCameraState = insightCameraState;
+                    scripts.push(createScript({
+                        type: 'insight',
+                        context: context,
+                        camera: newCameraState,
+                        highlightElement,
+                        searchArea: null == (_task_log = task.log) ? void 0 : null == (_task_log_taskInfo = _task_log.taskInfo) ? void 0 : _task_log_taskInfo.searchArea,
+                        duration: 0.5 * locateDuration,
+                        insightCameraDuration: locateDuration,
+                        title,
+                        subTitle: highlightElement.description || subTitle,
+                        imageWidth: (null == (_context_shotSize = context.shotSize) ? void 0 : _context_shotSize.width) || imageWidth,
+                        imageHeight: (null == (_context_shotSize1 = context.shotSize) ? void 0 : _context_shotSize1.height) || imageHeight,
+                        taskId: currentTaskId
+                    }, contextScreenshot));
+                    insightOnTop = true;
+                });
+            }
+            const planningTask = task;
+            if (planningTask.recorder && planningTask.recorder.length > 0) {
+                var _planningTask_recorder_, _task_uiContext_shotSize, _task_uiContext, _task_uiContext_shotSize1, _task_uiContext1;
+                const screenshot = null == (_planningTask_recorder_ = planningTask.recorder[0]) ? void 0 : _planningTask_recorder_.screenshot;
+                scripts.push(createScript({
+                    type: 'img',
+                    duration: stillDuration,
+                    title: typeStr(task),
+                    subTitle: paramStr(task),
+                    imageWidth: (null == (_task_uiContext = task.uiContext) ? void 0 : null == (_task_uiContext_shotSize = _task_uiContext.shotSize) ? void 0 : _task_uiContext_shotSize.width) || imageWidth,
+                    imageHeight: (null == (_task_uiContext1 = task.uiContext) ? void 0 : null == (_task_uiContext_shotSize1 = _task_uiContext1.shotSize) ? void 0 : _task_uiContext_shotSize1.height) || imageHeight,
+                    taskId: currentTaskId
+                }, asScreenshot(screenshot)));
+            }
+        } else if ('Action Space' === task.type) {
+            var _task_recorder_, _task_recorder;
+            const title = typeStr(task);
+            const subTitle = paramStr(task);
+            scripts.push({
+                type: 'spinning-pointer',
+                duration: actionSpinningPointerDuration,
+                title,
+                subTitle,
+                taskId: currentTaskId
+            });
+            if (insightOnTop) {
+                scripts.push({
+                    type: 'clear-insight',
+                    duration: clearInsightDuration,
+                    title,
+                    subTitle,
+                    taskId: currentTaskId
+                });
+                insightOnTop = false;
+            }
+            scripts.push(setPointerScript(mousePointer, title, subTitle, currentTaskId));
+            const screenshot = null == (_task_recorder = task.recorder) ? void 0 : null == (_task_recorder_ = _task_recorder[0]) ? void 0 : _task_recorder_.screenshot;
+            const { width, height } = resolveTaskShotSize(task, imageWidth, imageHeight);
+            scripts.push(createScript({
+                type: 'img',
+                duration: actionDuration,
+                camera: 'Sleep' === task.subType ? createFullPageCameraState(width, height) : void 0,
+                title,
+                subTitle,
+                imageWidth: width,
+                imageHeight: height,
+                taskId: currentTaskId
+            }, asScreenshot(screenshot)));
+        } else {
+            var _task_recorder_1, _task_recorder1;
+            const title = typeStr(task);
+            const subTitle = paramStr(task);
+            const screenshot = null == (_task_recorder1 = task.recorder) ? void 0 : null == (_task_recorder_1 = _task_recorder1[task.recorder.length - 1]) ? void 0 : _task_recorder_1.screenshot;
+            if (screenshot) {
+                const { width, height } = resolveTaskShotSize(task, imageWidth, imageHeight);
+                scripts.push(createScript({
+                    type: 'img',
+                    duration: stillDuration,
+                    camera: createFullPageCameraState(width, height),
+                    title,
+                    subTitle,
+                    imageWidth: width,
+                    imageHeight: height,
+                    taskId: currentTaskId
+                }, asScreenshot(screenshot)));
+            }
+        }
+        if ('finished' !== task.status) {
+            var _task_recorder_2, _task_recorder2;
+            const errorTitle = typeStr(task);
+            const errorMsg = task.errorMessage || 'unknown error';
+            const errorSubTitle = errorMsg.indexOf('NOT_IMPLEMENTED_AS_DESIGNED') > 0 ? 'Further actions cannot be performed in the current environment' : errorMsg;
+            const screenshot = null == (_task_recorder2 = task.recorder) ? void 0 : null == (_task_recorder_2 = _task_recorder2[task.recorder.length - 1]) ? void 0 : _task_recorder_2.screenshot;
+            const { width, height } = resolveTaskShotSize(task, imageWidth, imageHeight);
+            scripts.push(createScript({
+                type: 'img',
+                camera: createFullPageCameraState(width, height),
+                duration: stillDuration,
+                title: errorTitle,
+                subTitle: errorSubTitle,
+                imageWidth: width,
+                imageHeight: height,
+                taskId: currentTaskId
+            }, asScreenshot(screenshot)));
+        }
+    });
+    if (insightOnTop) {
+        scripts.push({
+            type: 'clear-insight',
+            duration: clearInsightDuration,
+            title: '',
+            subTitle: '',
+            taskId: lastTaskId
+        });
+        insightOnTop = false;
+    }
+    const lastTaskShotSize = tasksIncluded.length > 0 ? resolveTaskShotSize(tasksIncluded[tasksIncluded.length - 1], imageWidth, imageHeight) : {
+        width: imageWidth,
+        height: imageHeight
+    };
+    scripts.push({
+        title: 'End',
+        subTitle: initSubTitle,
+        type: 'img',
+        duration: lastFrameDuration,
+        camera: createFullPageCameraState(lastTaskShotSize.width, lastTaskShotSize.height),
+        taskId: void 0
+    });
+    return scripts;
+};
+export { allScriptsFromDump, cameraStateForRect, extractDumpMetaInfo, generateAnimationScripts, mergeTwoCameraState };

package/dist/lib/component/blackboard/highlights.js

@@ -0,0 +1,84 @@
+"use strict";
+var __webpack_require__ = {};
+(()=>{
+    __webpack_require__.d = (exports1, definition)=>{
+        for(var key in definition)if (__webpack_require__.o(definition, key) && !__webpack_require__.o(exports1, key)) Object.defineProperty(exports1, key, {
+            enumerable: true,
+            get: definition[key]
+        });
+    };
+})();
+(()=>{
+    __webpack_require__.o = (obj, prop)=>Object.prototype.hasOwnProperty.call(obj, prop);
+})();
+(()=>{
+    __webpack_require__.r = (exports1)=>{
+        if ("u" > typeof Symbol && Symbol.toStringTag) Object.defineProperty(exports1, Symbol.toStringTag, {
+            value: 'Module'
+        });
+        Object.defineProperty(exports1, '__esModule', {
+            value: true
+        });
+    };
+})();
+var __webpack_exports__ = {};
+__webpack_require__.r(__webpack_exports__);
+__webpack_require__.d(__webpack_exports__, {
+    formatBlackboardHighlightSummary: ()=>formatBlackboardHighlightSummary,
+    normalizeBlackboardHighlights: ()=>normalizeBlackboardHighlights
+});
+function formatCenterKey(center) {
+    return `${center[0]}:${center[1]}`;
+}
+function formatRectKey(rect) {
+    return `${rect.left}:${rect.top}:${rect.width}:${rect.height}`;
+}
+function getElementLabel(element) {
+    if ('content' in element && element.content) return element.content;
+    if ("description" in element && element.description) return element.description;
+}
+function normalizeBlackboardHighlights(elements) {
+    if (!(null == elements ? void 0 : elements.length)) return [];
+    const deduped = new Map();
+    elements.forEach((element, index)=>{
+        if (!(null == element ? void 0 : element.rect) || !(null == element ? void 0 : element.center)) return;
+        const label = getElementLabel(element);
+        const dedupeKey = [
+            'id' in element ? element.id : '',
+            label || '',
+            formatCenterKey(element.center),
+            formatRectKey(element.rect)
+        ].join('|');
+        if (!deduped.has(dedupeKey)) deduped.set(dedupeKey, {
+            key: 'id' in element && element.id || `${dedupeKey || 'highlight'}-${index}`,
+            label,
+            center: element.center,
+            rect: element.rect
+        });
+    });
+    return Array.from(deduped.values());
+}
+function roundRect(rect) {
+    return {
+        left: Math.round(rect.left),
+        top: Math.round(rect.top),
+        width: Math.round(rect.width),
+        height: Math.round(rect.height)
+    };
+}
+function formatBlackboardHighlightSummary(highlight) {
+    const center = `[${Math.round(highlight.center[0])}, ${Math.round(highlight.center[1])}]`;
+    const rect = roundRect(highlight.rect);
+    const rectText = `rect=${JSON.stringify(rect)}`;
+    if (highlight.label) return `${highlight.label} center=${center}, ${rectText}`;
+    return `center=${center}, ${rectText}`;
+}
+exports.formatBlackboardHighlightSummary = __webpack_exports__.formatBlackboardHighlightSummary;
+exports.normalizeBlackboardHighlights = __webpack_exports__.normalizeBlackboardHighlights;
+for(var __rspack_i in __webpack_exports__)if (-1 === [
+    "formatBlackboardHighlightSummary",
+    "normalizeBlackboardHighlights"
+].indexOf(__rspack_i)) exports[__rspack_i] = __webpack_exports__[__rspack_i];
+Object.defineProperty(exports, '__esModule', {
+    value: true
+});