@opentiny/next-sdk 0.4.2 → 0.4.3

package/page-tools/configs/console-cloud.ts

@@ -1,172 +0,0 @@
-/**
- * 云控制台（consoleCloud）专用 PageAgentToolOptions。
- *
- * 控制台基于 Tiny3（ti3-*）+ Angular，大量自定义组件缺少 role / aria-*：
- * - Tab：`.ti3-tab-li` 无 role=tab，选中靠 `.ti3-tab-active`
- * - 下拉：`.ti3-select-dominator-container` / `.selected-label` 无 combobox 语义
- * - 图标按钮：仅有 `cf-uba` / 子节点 `title`，无 aria-label
- * - 服务列表侧栏、区域选择等用 class 表达选中态
- *
- * 书写约定：优先 selector；仅当需要计算样式等复杂判断时再用 match。
- * （roles 的 selector 为自身 matches；states 的 selector 为 closest）
- */
-
-import { defineA11yConfig } from '../a11y/config'
-import type { PageAgentToolOptions } from '../tool-config'
-
-/** 云控制台 page-agent-tool 预设配置 */
-export const consoleCloudPageAgentToolOptions: PageAgentToolOptions = {
-  enableHighlight: false,
-  a11yConfig: defineA11yConfig({
-    roles: [
-      // Tiny3 Tabs：真正可聚焦/可点击的是内部 .ti3-tabs-text（tabindex=0）
-      { role: 'tablist', selector: 'ul.ti3-tabs' },
-      { role: 'tab', selector: '.ti3-tabs-text' },
-      { role: 'tabpanel', selector: ['ti-tab.ti3-tab-pane', '.ti3-tab-pane'] },
-
-      // 自定义下拉 / 区域选择触发器
-      {
-        role: 'combobox',
-        selector: [
-          '.ti3-select-dominator-container',
-          '.selected-label',
-          '.sort-select',
-          '.service-select',
-          '.region-select',
-          '[cf-uba="searchableRegion..open"]'
-        ]
-      },
-
-      // 图标型 / 无语义按钮
-      {
-        role: 'button',
-        selector: [
-          '.modules-service-list-menu-service-icon-container',
-          '.ti3-btn-only-icon-noborder',
-          '.ti3-select-dominator-dropdown-btn',
-          '.modules-right-sidebar-icon-item-wrapper',
-          '.modules-right-sidebar-hide-state-plugin',
-          '.components-service-list-container-service-list-input-service-close',
-          '.modules-searchable-region-region-panel-close',
-          '.modules-searchable-region-region-panel-search-btn',
-          '[cf-uba="rightSidebar..hideBtn"]',
-          // Tiny3 图标组件：帮助中心固定/全屏/关闭等（ti-icon / tp-icon 无原生 button 语义）
-          '.ti-global-help-panel-header-icon',
-          'ti-icon[name]',
-          'tp-icon[name]',
-          // 无 name 的箭头/操作图标（如 latest news 区 common-icon 展开箭头）
-          'tp-icon.common-icon',
-          'ti-icon.common-icon',
-          'ti-icon.ti3-icon-full-screen',
-          'ti-icon.ti3-icon-close',
-          'tp-icon.ti3-icon-full-screen',
-          'tp-icon.ti3-icon-close'
-        ]
-      },
-
-      // 服务列表侧栏分类 / 顶栏菜单项
-      {
-        role: 'menuitem',
-        selector: [
-          '.components-service-list-left-box-sidebar-visit-panel > li',
-          '.modules-menus-menu-item',
-          '.components-menu-wrapper-menu-text'
-        ]
-      },
-
-      // 区域筛选项 / 下拉选项
-      {
-        role: 'option',
-        selector: [
-          '.region-selector-item',
-          '.modules-searchable-region-project-item-region-item',
-          '.modules-searchable-region-region-panel-recent-region-item',
-          '.ti3-multiselect-box-cell'
-        ]
-      }
-    ],
-    states: {
-      // 选中态：挂在容器 class 上，用 selector + closest 即可命中内部交互节点
-      selected: [
-        { selector: 'li.ti3-tab-li.ti3-tab-active' },
-        // Tiny3 按钮组（计费模式等）：ti3-active 在 .ti3-btn-item-container 上，不在 button 上
-        { selector: '.ti3-btn-item-container.ti3-active' },
-        { selector: '.components-service-list-left-box-active' },
-        {
-          selector: [
-            '.modules-searchable-region-project-item-region-item-selected',
-            '.components-search-content-search-select-search-select-selected'
-          ]
-        }
-      ],
-      hasPopup: [
-        {
-          selector: [
-            '.ti3-select-dominator-container',
-            '.selected-label',
-            '.sort-select',
-            '.service-select',
-            '.region-select',
-            '[cf-uba="searchableRegion..open"]',
-            '[cf-uba="serviceList..open"]',
-            '[cf-uba="userinfo"]'
-          ]
-        }
-      ],
-      disabled: [{ selector: '.ti3-disabled' }],
-      // 展开态：需结合计算样式，选择器表达不了「可见」
-      expanded: [
-        {
-          match: (el) => {
-            try {
-              if (
-                !el.matches(
-                  '.modules-layout-module-sidebar-panel, .modules-searchable-region-region-panel, .ti3-dropdown-container'
-                )
-              ) {
-                return false
-              }
-              const style = window.getComputedStyle(el as HTMLElement)
-              return style.display !== 'none' && style.visibility !== 'hidden' && style.opacity !== '0'
-            } catch {
-              return false
-            }
-          }
-        }
-      ]
-    },
-    // exposedAttributes 输出属性 token；带 name 的 ti-icon/tp-icon 可交互性由 roles/whitelist 中 ti-icon[name] 等规则判定。
-    exposedAttributes: ['cf-uba', 'data-qa-id', 'name'],
-    whitelist: [
-      '.modules-service-list-menu-service-icon-container',
-      '.ti3-tabs-text',
-      '[cf-uba="cloudShell"]',
-      '[cf-uba="messageBox"]',
-      '[cf-uba="helpFeedback"]',
-      '[cf-uba="globalMessage"]',
-      '[cf-uba="rightSidebar..hideBtn"]',
-      // 帮助中心等区域的 ti-icon / tp-icon 图标按钮
-      '.ti-global-help-panel-header-icon',
-      'ti-icon[name]',
-      'tp-icon[name]',
-      'tp-icon.common-icon',
-      'ti-icon.common-icon',
-      'ti-icon.ti3-icon-full-screen'
-    ],
-    blacklist: ['noscript', 'pan-gu', '#J_header'],
-    dialogSelectors: [
-      '[class*="ti3-modal"]',
-      '[class*="ti3-message-box"]',
-      '[class*="drawer"]',
-      '.modules-layout-module-sidebar-panel'
-    ]
-  })
-}
-
-/** 判断当前页面是否应使用云控制台（consoleCloud）预设 */
-export function isConsoleCloudHost(
-  hostname: string = typeof location !== 'undefined' ? location.hostname : ''
-): boolean {
-  // 要求 console 前为域名边界（开头或 `.`），避免误匹配 xconsole.huaweicloud.com
-  return /(^|\.)console\.huaweicloud\.com$/i.test(hostname)
-}

package/page-tools/constants.ts

@@ -1,12 +0,0 @@
-/** 校验错误默认选择器：ARIA 标准 + 主流 UI 框架（唯一来源为 a11y/constants.ts，此处重新导出保持旧路径可用） */
-export { DEFAULT_ERROR_SELECTORS, DEFAULT_DIALOG_SELECTORS } from './a11y/constants'
-
-/** registerPageAgentTool(options) 的入参类型，定义见 tool-config.ts（与运行期 setPageAgentToolConfig 的补丁类型一致） */
-export type { PageAgentToolOptions } from './tool-config'
-
-declare global {
-  interface Window {
-    /** 指定网站可覆盖该函数，在每次 getBrowserState 之前调用，常用于配合 setPageAgentToolConfig 动态调整当前页面的配置 */
-    __webmcpcli_beforeGetBrowserState?: (() => void) | null
-  }
-}

package/page-tools/context.ts

@@ -1,50 +0,0 @@
-import type { PageController } from '@page-agent/page-controller'
-import type { PageStateCache } from './page-state-cache'
-import type { RefMap } from './a11y-tree'
-
-export type PageAgentToolContentResult = {
-  content: Array<{ type: 'text'; text: string }>
-}
-
-export type PageAgentToolErrorResult = PageAgentToolContentResult & {
-  isError: true
-  error: string
-}
-
-export async function createActionErrorResult(
-  message: string,
-  buildBrowserStateResponse: ActionContext['buildBrowserStateResponse']
-): Promise<PageAgentToolErrorResult> {
-  try {
-    const browserState = await buildBrowserStateResponse('full')
-    return {
-      isError: true,
-      error: message,
-      content: [{ type: 'text', text: `${message}\n\n${browserState.content[0].text}` }]
-    }
-  } catch (error) {
-    return {
-      isError: true,
-      error: message,
-      content: [
-        {
-          type: 'text',
-          text: `${message}\n\n获取最新浏览器状态失败: ${error instanceof Error ? error.message : String(error)}`
-        }
-      ]
-    }
-  }
-}
-
-export interface ActionContext {
-  pageController: PageController
-  stateCache: PageStateCache
-  getRefMap: () => RefMap
-  setRefMap: (map: RefMap) => void
-  buildBrowserStateResponse: (
-    mode?: 'full' | 'diff' | 'both'
-  ) => Promise<{ content: Array<{ type: 'text'; text: string }> }>
-  refreshOnStaleRef: (action: string, index: number) => Promise<{ content: Array<{ type: 'text'; text: string }> }>
-  errContent: (msg: string) => Promise<{ content: Array<{ type: 'text'; text: string }> }>
-  actionError: (msg: string) => Promise<PageAgentToolErrorResult>
-}

package/page-tools/effects.ts

@@ -1,345 +0,0 @@
-/**
- * page-tools/effects - 页面工具调用提示效果模块（框架无关）
- *
- * 作用：
- * - 在调用通过 withPageTools 注册的页面工具时，显示页面级的调用状态提示
- * - 以左下角小 tip 形式展示“当前正在调用的工具”文案，尽量不打扰用户操作
- * - 纯 DOM + CSS 实现，不依赖 Vue/React 等框架
- */
-
-export type ToolInvokeEffectConfig = {
-  /**
-   * 自定义提示文案，默认使用“工具标题 || 工具名称”
-   * 例如："正在为你整理订单数据"
-   */
-  label?: string
-}
-
-type RuntimeEffectConfig = {
-  label: string
-}
-
-let overlayElement: HTMLDivElement | null = null
-let labelElement: HTMLDivElement | null = null
-let styleElement: HTMLStyleElement | null = null
-let activeCount = 0
-
-import { isDomAvailable } from '../utils/env'
-
-const BODY_GLOW_CLASS = 'next-sdk-tool-body-glow'
-
-function ensureDomReady() {
-  return isDomAvailable()
-}
-
-function ensureStyleElement() {
-  if (!ensureDomReady()) return
-  if (styleElement) return
-
-  const style = document.createElement('style')
-  style.textContent = `
-  .${BODY_GLOW_CLASS} {
-    position: relative;
-  }
-
-  .next-sdk-tool-overlay {
-    position: fixed;
-    inset: 0;
-    z-index: 999999;
-    pointer-events: none;
-    display: flex;
-    align-items: flex-end;
-    justify-content: flex-start;
-    padding: 0 0 18px 18px;
-    background: transparent;
-    animation: next-sdk-overlay-fade-in 260ms ease-out;
-  }
-
-  .next-sdk-tool-overlay--exit {
-    animation: next-sdk-overlay-fade-out 220ms ease-in forwards;
-  }
-
-  .next-sdk-tool-overlay__glow-ring {
-    display: none;
-  }
-
-  .next-sdk-tool-overlay__panel {
-    position: relative;
-    min-width: min(320px, 78vw);
-    max-width: min(420px, 82vw);
-    padding: 10px 14px;
-    border-radius: 999px;
-    background:
-      linear-gradient(135deg, rgba(15, 23, 42, 0.9), rgba(17, 24, 39, 0.9)),
-      radial-gradient(circle at top left, rgba(96, 165, 250, 0.25), transparent 55%),
-      radial-gradient(circle at bottom right, rgba(45, 212, 191, 0.22), transparent 60%);
-    box-shadow:
-      0 12px 28px rgba(15, 23, 42, 0.78),
-      0 0 0 1px rgba(148, 163, 184, 0.26);
-    display: flex;
-    align-items: center;
-    gap: 10px;
-    pointer-events: none;
-    transform-origin: center;
-    animation: next-sdk-panel-pop-in 260ms cubic-bezier(0.18, 0.89, 0.32, 1.28);
-    color: #e5e7eb;
-    font-family: system-ui, -apple-system, BlinkMacSystemFont, "SF Pro Text", sans-serif;
-  }
-
-  .next-sdk-tool-overlay__indicator {
-    width: 26px;
-    height: 26px;
-    border-radius: 999px;
-    background: radial-gradient(circle at 30% 10%, #f9fafb, #93c5fd);
-    box-shadow:
-      0 0 0 1px rgba(191, 219, 254, 0.6),
-      0 8px 18px rgba(37, 99, 235, 0.8),
-      0 0 28px rgba(56, 189, 248, 0.9);
-    position: relative;
-    flex-shrink: 0;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    overflow: hidden;
-  }
-
-  .next-sdk-tool-overlay__indicator-orbit {
-    position: absolute;
-    inset: 2px;
-    border-radius: inherit;
-    border: 1px solid rgba(248, 250, 252, 0.6);
-    box-sizing: border-box;
-    opacity: 0.9;
-  }
-
-  .next-sdk-tool-overlay__indicator-orbit::before {
-    content: '';
-    position: absolute;
-    width: 6px;
-    height: 6px;
-    border-radius: 999px;
-    background: #f9fafb;
-    box-shadow:
-      0 0 12px rgba(248, 250, 252, 0.9),
-      0 0 24px rgba(250, 249, 246, 0.9);
-    top: 0;
-    left: 50%;
-    transform: translate(-50%, -50%);
-    transform-origin: 50% 18px;
-    animation: next-sdk-indicator-orbit 1.4s linear infinite;
-  }
-
-  .next-sdk-tool-overlay__indicator-core {
-    width: 14px;
-    height: 14px;
-    border-radius: inherit;
-    background: radial-gradient(circle at 30% 20%, #f9fafb, #bfdbfe);
-    box-shadow:
-      0 0 12px rgba(248, 250, 252, 0.9),
-      0 0 32px rgba(191, 219, 254, 0.8);
-    opacity: 0.96;
-  }
-
-  .next-sdk-tool-overlay__content {
-    display: flex;
-    flex-direction: column;
-    gap: 1px;
-    min-width: 0;
-  }
-
-  .next-sdk-tool-overlay__title {
-    font-size: 11px;
-    letter-spacing: 0.08em;
-    text-transform: uppercase;
-    color: rgba(156, 163, 175, 0.96);
-    display: flex;
-    align-items: center;
-    gap: 6px;
-  }
-
-  .next-sdk-tool-overlay__title-dot {
-    width: 6px;
-    height: 6px;
-    border-radius: 999px;
-    background: #22c55e;
-    box-shadow:
-      0 0 8px rgba(34, 197, 94, 0.9),
-      0 0 14px rgba(22, 163, 74, 0.9);
-  }
-
-  .next-sdk-tool-overlay__label {
-    font-size: 12px;
-    font-weight: 500;
-    color: #e5e7eb;
-    white-space: nowrap;
-    text-overflow: ellipsis;
-    overflow: hidden;
-  }
-
-  @keyframes next-sdk-overlay-fade-in {
-    from { opacity: 0; }
-    to { opacity: 1; }
-  }
-
-  @keyframes next-sdk-overlay-fade-out {
-    from { opacity: 1; }
-    to { opacity: 0; }
-  }
-
-  @keyframes next-sdk-indicator-orbit {
-    from {
-      transform: translate(-50%, -50%) rotate(0deg) translateY(0);
-    }
-    to {
-      transform: translate(-50%, -50%) rotate(360deg) translateY(0);
-    }
-  }
-
-  @keyframes next-sdk-panel-pop-in {
-    0% {
-      opacity: 0;
-      transform: scale(0.92) translateY(10px);
-    }
-    100% {
-      opacity: 1;
-      transform: scale(1) translateY(0);
-    }
-  }
-  `
-
-  document.head.appendChild(style)
-  styleElement = style
-}
-
-function ensureOverlayElement() {
-  if (!ensureDomReady()) return
-  if (overlayElement) return
-
-  ensureStyleElement()
-
-  const overlay = document.createElement('div')
-  overlay.className = 'next-sdk-tool-overlay'
-
-  const glowRing = document.createElement('div')
-  glowRing.className = 'next-sdk-tool-overlay__glow-ring'
-
-  const panel = document.createElement('div')
-  panel.className = 'next-sdk-tool-overlay__panel'
-
-  const indicator = document.createElement('div')
-  indicator.className = 'next-sdk-tool-overlay__indicator'
-
-  const indicatorOrbit = document.createElement('div')
-  indicatorOrbit.className = 'next-sdk-tool-overlay__indicator-orbit'
-
-  const indicatorCore = document.createElement('div')
-  indicatorCore.className = 'next-sdk-tool-overlay__indicator-core'
-
-  const content = document.createElement('div')
-  content.className = 'next-sdk-tool-overlay__content'
-
-  const titleRow = document.createElement('div')
-  titleRow.className = 'next-sdk-tool-overlay__title'
-  titleRow.textContent = 'AI 正在调用页面工具'
-
-  const titleDot = document.createElement('span')
-  titleDot.className = 'next-sdk-tool-overlay__title-dot'
-
-  const label = document.createElement('div')
-  label.className = 'next-sdk-tool-overlay__label'
-
-  titleRow.prepend(titleDot)
-  content.appendChild(titleRow)
-  content.appendChild(label)
-
-  indicator.appendChild(indicatorOrbit)
-  indicator.appendChild(indicatorCore)
-  panel.appendChild(indicator)
-  panel.appendChild(content)
-  overlay.appendChild(glowRing)
-  overlay.appendChild(panel)
-
-  document.body.appendChild(overlay)
-
-  overlayElement = overlay
-  labelElement = label
-}
-
-function updateOverlay(config: RuntimeEffectConfig) {
-  if (!ensureDomReady()) return
-  ensureOverlayElement()
-  if (!overlayElement || !labelElement) return
-  overlayElement.classList.remove('next-sdk-tool-overlay--exit')
-  labelElement.textContent = config.label
-}
-
-function removeOverlayWithAnimation() {
-  if (!overlayElement) return
-  overlayElement.classList.add('next-sdk-tool-overlay--exit')
-  const localOverlay = overlayElement
-  let handled = false
-  let timerId: ReturnType<typeof setTimeout> | undefined
-  const handle = () => {
-    if (handled) return
-    handled = true
-    if (timerId !== undefined) {
-      clearTimeout(timerId)
-      timerId = undefined
-    }
-    if (localOverlay.parentNode) {
-      localOverlay.parentNode.removeChild(localOverlay)
-    }
-    if (overlayElement === localOverlay) {
-      overlayElement = null
-      labelElement = null
-    }
-    localOverlay.removeEventListener('animationend', handle)
-  }
-  localOverlay.addEventListener('animationend', handle)
-  // 兜底：若 animationend 未触发（如 prefers-reduced-motion 或样式被覆盖），确保清理
-  timerId = setTimeout(handle, 500)
-}
-
-/**
- * 在页面上显示工具调用提示效果。
- * - 若当前已有其他工具在执行，仅更新文案，不重复创建 DOM
- * - 会增加 activeCount 计数，需配对调用 hideToolInvokeEffect
- */
-export function showToolInvokeEffect(config: RuntimeEffectConfig) {
-  if (!ensureDomReady()) return
-  activeCount += 1
-  updateOverlay(config)
-}
-
-/**
- * 隐藏工具调用提示效果。
- * - 使用引用计数：只有当所有调用结束后才真正移除 Overlay
- */
-export function hideToolInvokeEffect() {
-  if (!ensureDomReady() || activeCount <= 0) return
-  activeCount -= 1
-  if (activeCount === 0) {
-    removeOverlayWithAnimation()
-  }
-}
-
-/**
- * 将 RouteConfig 中的 invokeEffect 配置编译成运行时效果配置。
- * - boolean / undefined：关闭或开启默认文案
- * - 对象：允许自定义 label
- */
-export function resolveRuntimeEffectConfig(
-  toolName: string,
-  toolTitle: string | undefined,
-  value: boolean | ToolInvokeEffectConfig | undefined
-): RuntimeEffectConfig | undefined {
-  if (!value) return undefined
-  const baseLabel = toolTitle || toolName
-  if (typeof value === 'boolean') {
-    return value ? { label: baseLabel } : undefined
-  }
-  return {
-    label: value.label || baseLabel
-  }
-}
-

package/page-tools/handlers/browserState.ts

@@ -1,12 +0,0 @@
-import type { ActionContext } from '../context'
-
-export async function handleBrowserState(args: any, ctx: ActionContext) {
-  if (window.__webmcpcli_beforeGetBrowserState) {
-    try {
-      window.__webmcpcli_beforeGetBrowserState()
-    } catch (e) {
-      console.warn('__webmcpcli_beforeGetBrowserState error:', e)
-    }
-  }
-  return ctx.buildBrowserStateResponse(args.responseMode ?? 'diff')
-}

package/page-tools/handlers/click.ts

@@ -1,30 +0,0 @@
-import { clickElement } from '@page-agent/page-controller'
-import { waitForDomSettled } from '../utils/dom'
-import type { ActionContext } from '../context'
-
-export async function handleClick(args: any, ctx: ActionContext) {
-  const mode = args.responseMode ?? 'diff'
-  if (args.index === undefined) return ctx.actionError('点击结果: 缺少元素索引')
-  const el = ctx.getRefMap().get(args.index)
-  if (!el) {
-    return ctx.actionError(
-      `点击失败: ref 索引 ${args.index} 已失效（页面可能已刷新），已自动重新加载页面状态，请使用新的 ref 索引重试。`
-    )
-  }
-
-  // 若 ref 指向 shadow host，解析其内部真正的可点击元素
-  let targetEl = el as HTMLElement
-  if (el.shadowRoot && !(el instanceof HTMLButtonElement) && !(el instanceof HTMLAnchorElement)) {
-    const innerClickable = el.shadowRoot.querySelector(
-      'button, a, [role="button"], [role="link"]'
-    ) as HTMLElement | null
-    if (innerClickable) {
-      targetEl = innerClickable
-    }
-  }
-  await clickElement(targetEl)
-  // 等待框架异步插入的校验错误/条件渲染内容稳定后再采集状态
-  await waitForDomSettled()
-  // 操作成功后自动返回 diff/both/full
-  return ctx.buildBrowserStateResponse(mode)
-}

package/page-tools/handlers/executeJavascript.ts

@@ -1,22 +0,0 @@
-import type { ActionContext } from '../context'
-
-export async function handleExecuteJavascript(args: any, ctx: ActionContext) {
-  if (!args.script) return ctx.errContent('脚本执行异常: 缺少javascript代码')
-  // eslint-disable-next-line no-new-func
-  // 方式1：将脚本包裹在 async IIFE 中执行，允许 return 语句
-  let result = await new Function(`return (async () => { ${args.script} })()`)()
-  // 方式2：若 result 为 undefined（脚本没有 return），降级尝试以表达式方式求值
-  // 场景：Agent 写了 "Array.from(...).map(...)" 但没有 return 关键字
-  if (result === undefined) {
-    try {
-      // eslint-disable-next-line no-new-func
-      result = await new Function(`return (async () => (${args.script}))()`)()
-    } catch {
-      // 表达式求值也失败（如含 await/let/const 等语句），保持 undefined
-    }
-  }
-  await ctx.pageController.hideMask()
-  return {
-    content: [{ type: 'text' as const, text: `脚本执行结果: ${JSON.stringify(result)}` }]
-  }
-}