dsh-ptc-plus 0.4.8 → 0.4.10

package/src/client-copy.js

@@ -106,6 +106,9 @@ const CHROME_COPY = Object.freeze({
     'bindings.openHint': 'PTC Plus · 全局绑定与设置',
     'bindings.draftHint': 'PTC Plus 插件 · 绑定草稿待处理，点击查看',
     'bindings.quickHeading': '全局用户绑定 · 对所有会话生效',
+    'bindings.quickEnabled': '已启用（{count}）',
+    'bindings.quickDisabled': '停用（{count}）',
+    'bindings.quickNoEnabled': '暂无启用绑定',
     'bindings.quickDrafts': '待处理草稿',
     'bindings.quickLoading': '正在读取绑定…',
     'bindings.quickSaving': '正在保存…',
@@ -118,6 +121,8 @@ const CHROME_COPY = Object.freeze({
     'bindings.reviewExpand': '展开绑定草稿',
     'bindings.reviewCollapse': '折叠绑定草稿',
     'bindings.reviewClose': '关闭绑定草稿面板',
+    'bindings.reviewEnlarge': '放大查看绑定草稿',
+    'bindings.reviewRestore': '缩小显示绑定草稿',
     'bindings.reviewOpen': '打开草稿',
     'bindings.reviewMenuLabel': '绑定草稿（{count}）',
     'bindings.reviewLoading': '正在确认草稿操作资格…',
@@ -277,6 +282,9 @@ const CHROME_COPY = Object.freeze({
     'bindings.openHint': 'PTC Plus · Global bindings and settings',
     'bindings.draftHint': 'PTC Plus plugin · Binding draft pending; click to review',
     'bindings.quickHeading': 'Global bindings · Applies to all sessions',
+    'bindings.quickEnabled': 'Enabled ({count})',
+    'bindings.quickDisabled': 'Disabled ({count})',
+    'bindings.quickNoEnabled': 'No enabled bindings',
     'bindings.quickDrafts': 'Pending drafts',
     'bindings.quickLoading': 'Loading bindings…',
     'bindings.quickSaving': 'Saving…',
@@ -289,6 +297,8 @@ const CHROME_COPY = Object.freeze({
     'bindings.reviewExpand': 'Expand binding draft',
     'bindings.reviewCollapse': 'Collapse binding draft',
     'bindings.reviewClose': 'Close binding draft panel',
+    'bindings.reviewEnlarge': 'Enlarge binding draft',
+    'bindings.reviewRestore': 'Shrink binding draft',
     'bindings.reviewOpen': 'Open draft',
     'bindings.reviewMenuLabel': 'Binding drafts ({count})',
     'bindings.reviewLoading': 'Confirming draft actions…',

package/src/client-feature-gates.js

@@ -1,3 +1,5 @@
+import { CONFIG_DEFAULTS } from '../internal/config-spec.js'
+
 /**
  * Settings snapshot to feature eligibility. Each feature names the settings that
  * gate exactly one contribution, so a new gated surface reads one table instead
@@ -18,15 +20,20 @@ const FEATURE_SETTINGS = Object.freeze({
 })
 
 /**
- * Pure settings projection: a feature is eligible only from a ready snapshot
- * with the master switch on. These features default to on unless the user
- * turned them off. Writability gates setting writes, not contribution presence.
+ * Pure settings projection: a feature is eligible unless the settings say
+ * otherwise. Only a readable snapshot can turn a feature off — an unreadable or
+ * not-yet-arrived settings transport falls back to the defaults the plugin ships
+ * in `CONFIG_FIELDS`, so a transport outage degrades the settings surface
+ * instead of removing every contribution the plugin owns. Writability gates
+ * setting writes, not contribution presence.
  */
 export function featureEnabled(snapshot, feature) {
   const rule = FEATURE_SETTINGS[feature]
   if (rule === undefined) throw new Error(`Unknown client feature: ${feature}`)
-  if (snapshot?.status !== 'ready' || snapshot.value?.enabled !== true) return false
-  const value = snapshot.value
+  const value = snapshot?.status === 'ready' && snapshot.value !== undefined
+    ? snapshot.value
+    : CONFIG_DEFAULTS
+  if (value.enabled === false) return false
   return rule.every(key => value[key] !== false)
 }
 

package/src/client-host-compat.js

@@ -1,4 +1,25 @@
 import { SETTINGS_NAMESPACE } from '../internal/config-spec.js'
+import { ForwardRef, Lazy, Memo, isValidElementType } from 'react-is'
+
+/** Host exports are components, including React's wrapped object types. */
+export function isHostComponent(component) {
+  if (typeof component === 'function') return true
+  if (typeof component !== 'object' || component === null) return false
+  const seen = new Set()
+  while (isValidElementType(component)) {
+    if (typeof component !== 'object' || component === null) return true
+    if (seen.has(component)) return false
+    seen.add(component)
+    // react-is also admits server references and wrappers with missing payloads.
+    if (component.$$typeof === ForwardRef) return typeof component.render === 'function'
+    if (component.$$typeof === Lazy) return typeof component._init === 'function'
+      && typeof component._payload === 'object' && component._payload !== null
+    if (component.$$typeof !== Memo) return false
+    if (component.compare != null && typeof component.compare !== 'function') return false
+    component = component.type
+  }
+  return false
+}
 
 const HOST_ICON_EXPORTS = Object.freeze({
   check: ['IconCheckOutlineRegular', 'IconCheckOutline14'],
@@ -28,7 +49,7 @@ ABSENT_HOST_ICON.absentHostIcon = true
 
 /** Whether a normalized icon entry is a glyph the host actually published. */
 export function isHostIconComponent(icon) {
-  return typeof icon === 'function' && icon.absentHostIcon !== true
+  return isHostComponent(icon) && icon.absentHostIcon !== true
 }
 
 /**
@@ -42,7 +63,7 @@ export function hostIconComponents(primitives) {
   return Object.fromEntries(Object.entries(HOST_ICON_EXPORTS).map(([name, candidates]) => [
     name,
     candidates.map(candidate => primitives?.[candidate])
-      .find(value => typeof value === 'function') ?? ABSENT_HOST_ICON,
+      .find(isHostComponent) ?? ABSENT_HOST_ICON,
   ]))
 }
 

package/src/client-primitives.js

@@ -0,0 +1,249 @@
+import { isHostComponent } from './client-host-compat.js'
+
+/**
+ * Resolve the Harness Client components this plugin renders against the
+ * installed generation.
+ *
+ * The plugin may load a generation that renamed, removed, or reshaped a
+ * primitive; a missing component would otherwise throw while rendering and take
+ * the whole slot entry down with it. Each component therefore resolves to the
+ * shipped primitive when that generation provides it and to a plugin-local
+ * fallback otherwise, so a primitive change degrades one control instead of
+ * blanking the entry that renders it.
+ */
+
+/** One menu row: separators and labels paint; every other row selects by id. */
+function menuEntry(React, item, onSelect) {
+  const h = React.createElement
+  const content = item.label ?? item.text ?? null
+  if (item.type === 'separator') {
+    return h('div', { key: item.id, className: 'ptcPlusFallbackMenuSeparator', role: 'separator' })
+  }
+  if (item.type === 'label') {
+    return h('div', { key: item.id, className: 'ptcPlusFallbackMenuLabel' }, content)
+  }
+  return h('button', {
+    key: item.id, type: 'button', role: 'menuitem', className: 'ptcPlusFallbackMenuItem',
+    disabled: item.disabled === true,
+    onClick: () => onSelect?.(item.id),
+  }, content)
+}
+
+function useCompositionGuard(React, open) {
+  const composing = React.useRef(false)
+  const ended = React.useRef(false)
+  React.useEffect(() => {
+    composing.current = false
+    ended.current = false
+    if (!open) return undefined
+    const start = () => { composing.current = true }
+    const end = () => { composing.current = false; ended.current = true }
+    const release = () => { ended.current = false }
+    const blur = () => { composing.current = false; ended.current = false }
+    document.addEventListener('compositionstart', start, true)
+    document.addEventListener('compositionend', end, true)
+    document.addEventListener('keyup', release, true)
+    window.addEventListener('blur', blur)
+    return () => {
+      document.removeEventListener('compositionstart', start, true)
+      document.removeEventListener('compositionend', end, true)
+      document.removeEventListener('keyup', release, true)
+      window.removeEventListener('blur', blur)
+      composing.current = false
+      ended.current = false
+    }
+  }, [open])
+  return event => {
+    const guarded = composing.current || ended.current || event.isComposing === true || event.keyCode === 229
+    ended.current = false
+    return guarded
+  }
+}
+
+/** Menu fallback: the anchor, the item list, the pinned footer and the children region. */
+function createFallbackMenu(React, createPortal = content => content) {
+  const h = React.createElement
+  return function FallbackMenu({ open, items = [], children, footer, className, listClassName, autoFocus, anchor,
+    onClose, onSelect, portal = false, side = 'bottom', align = 'start', getAnchorRect, closeOnPointerLeave = false }) {
+    const root = React.useRef(null)
+    const list = React.useRef(null)
+    const closeTimer = React.useRef(null)
+    const close = React.useRef(onClose)
+    close.current = onClose
+    const isComposing = useCompositionGuard(React, open)
+    const cancelClose = () => { clearTimeout(closeTimer.current); closeTimer.current = null }
+    const scheduleClose = () => {
+      if (!closeOnPointerLeave) return
+      cancelClose()
+      closeTimer.current = setTimeout(() => close.current?.(), 180)
+    }
+    React.useEffect(() => cancelClose, [open])
+    React.useLayoutEffect(() => {
+      if (!open) return undefined
+      const place = () => {
+        const rect = getAnchorRect?.() ?? root.current?.getBoundingClientRect()
+        const surface = list.current
+        if (!rect || !surface) return
+        const viewport = window.visualViewport
+        const viewportTop = viewport?.offsetTop ?? 0
+        const viewportLeft = viewport?.offsetLeft ?? 0
+        const viewportHeight = viewport?.height ?? window.innerHeight
+        const viewportWidth = viewport?.width ?? window.innerWidth
+        const available = Math.max(0, side === 'top' ? rect.top - viewportTop - 12
+          : viewportTop + viewportHeight - rect.bottom - 12)
+        surface.style.maxHeight = `${available}px`
+        const measured = surface.getBoundingClientRect()
+        const left = align === 'end' ? rect.right - measured.width : rect.left
+        surface.style.left = `${Math.max(viewportLeft + 8, Math.min(left, viewportLeft + viewportWidth - measured.width - 8))}px`
+        surface.style.top = `${side === 'top' ? Math.max(viewportTop + 8, rect.top - measured.height - 4) : rect.bottom + 4}px`
+      }
+      place()
+      window.addEventListener('resize', place)
+      window.addEventListener('scroll', place, true)
+      window.visualViewport?.addEventListener('resize', place)
+      window.visualViewport?.addEventListener('scroll', place)
+      return () => {
+        window.removeEventListener('resize', place)
+        window.removeEventListener('scroll', place, true)
+        window.visualViewport?.removeEventListener('resize', place)
+        window.visualViewport?.removeEventListener('scroll', place)
+      }
+    }, [open, side, align, getAnchorRect, children, items, footer])
+    React.useEffect(() => {
+      if (!open) return undefined
+      if (autoFocus) list.current?.querySelector('button:not(:disabled)')?.focus()
+      const onKeyDown = event => {
+        if (event.defaultPrevented || isComposing(event)) return
+        if (event.key === 'Escape') {
+          event.preventDefault()
+          event.stopPropagation()
+          if (!event.repeat) close.current?.()
+          return
+        }
+        if (!root.current?.contains(event.target) && !list.current?.contains(event.target)) return
+        if (!['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) return
+        const controls = [...list.current.querySelectorAll('button:not(:disabled)')]
+        if (controls.length === 0) return
+        const current = controls.indexOf(document.activeElement)
+        const next = event.key === 'Home' ? 0 : event.key === 'End' ? controls.length - 1
+          : (current + (event.key === 'ArrowDown' ? 1 : -1) + controls.length) % controls.length
+        event.preventDefault()
+        controls[next].focus()
+      }
+      const onPointerDown = event => {
+        if (root.current?.contains(event.target) || list.current?.contains(event.target)) return
+        close.current?.()
+      }
+      document.addEventListener('keydown', onKeyDown)
+      document.addEventListener('pointerdown', onPointerDown, true)
+      return () => {
+        document.removeEventListener('keydown', onKeyDown)
+        document.removeEventListener('pointerdown', onPointerDown, true)
+      }
+    }, [open, autoFocus])
+    const rows = list => list.map(item => menuEntry(React, item, onSelect))
+    const surface = open ? h('div', { ref: list, className: ['ptcPlusFallbackMenuList', listClassName].filter(Boolean).join(' '),
+      role: 'menu', onPointerEnter: cancelClose, onPointerLeave: scheduleClose }, ...rows(items),
+      ...(Array.isArray(footer) ? rows(footer) : []),
+      children ?? null) : null
+    return h('span', { ref: root, className: ['ptcPlusFallbackMenu', className].filter(Boolean).join(' '),
+      onPointerEnter: cancelClose, onPointerLeave: scheduleClose }, anchor ?? null,
+      portal && surface !== null ? createPortal(surface, document.body) : surface)
+  }
+}
+
+/** Modal fallback: headless content or a titled dialog that closes on Escape and backdrop. */
+function createFallbackModal(React, createPortal = content => content) {
+  const h = React.createElement
+  const modalStack = []
+  return function FallbackModal({ open, onClose, title, closeLabel, description, className, contentClassName, headless, children }) {
+    const root = React.useRef(null)
+    const close = React.useRef(onClose)
+    close.current = onClose
+    const isComposing = useCompositionGuard(React, open)
+    const focusable = 'button:not(:disabled),input:not(:disabled),textarea:not(:disabled),select:not(:disabled),[href],[tabindex]:not([tabindex="-1"])'
+    React.useLayoutEffect(() => {
+      if (!open) return undefined
+      const previous = document.activeElement
+      const surface = root.current
+      const target = surface?.querySelector('[data-modal-autofocus]:not(:disabled)') ?? surface?.querySelector(focusable) ?? surface
+      target?.focus({ preventScroll: true })
+      modalStack.push(surface)
+      const onDocumentKeyDown = event => {
+        if (modalStack.at(-1) === surface) onKeyDown(event)
+      }
+      document.addEventListener('keydown', onDocumentKeyDown)
+      return () => {
+        document.removeEventListener('keydown', onDocumentKeyDown)
+        modalStack.splice(modalStack.indexOf(surface), 1)
+        if (document.activeElement === document.body || surface?.contains(document.activeElement)) previous?.focus?.({ preventScroll: true })
+      }
+    }, [open])
+    const onKeyDown = event => {
+      if (event.defaultPrevented || isComposing(event)) return
+      if (event.key === 'Escape') {
+        event.preventDefault()
+        event.stopPropagation()
+        if (!event.repeat) close.current?.()
+      } else if (event.key === 'Tab') {
+        const controls = [...root.current.querySelectorAll(focusable)]
+          .filter(control => control.getClientRects().length > 0)
+        const target = event.shiftKey ? controls.at(-1) : controls[0]
+        const boundary = event.shiftKey ? controls[0] : controls.at(-1)
+        if (controls.length === 0 || document.activeElement === boundary || !root.current.contains(document.activeElement)) {
+          event.preventDefault()
+          ;(target ?? root.current).focus({ preventScroll: true })
+        }
+      }
+    }
+    if (!open) return null
+    const body = h('div', { className: contentClassName ?? 'ptcPlusFallbackModalBody' }, children)
+    const surface = ['ptcPlusFallbackModal', className].filter(Boolean).join(' ')
+    return createPortal(h('div', {
+      className: 'ptcPlusFallbackModalBackdrop',
+      onPointerDown: event => { if (event.target === event.currentTarget) onClose?.() },
+    }, h('div', { ref: root, tabIndex: -1, className: surface, role: 'dialog', 'aria-modal': 'true', 'aria-label': title },
+      headless === true ? null : h('div', { className: 'ptcPlusFallbackModalHead' },
+        h('h2', null, title),
+        h('button', { type: 'button', className: 'ptcPlusDialogClose', 'aria-label': closeLabel ?? title, onClick: () => onClose?.() },
+          closeLabel ?? '\u00d7')),
+      headless === true || description === undefined ? null : h('p', { className: 'ptcPlusDetail' }, description),
+      headless === true ? children : body)), document.body)
+  }
+}
+
+/**
+ * Resolve every component the plugin renders.
+ * @param primitives - the installed generation's Client primitives.
+ * @param React - the browser React instance.
+ * @returns the component set the views consume.
+ */
+export function resolvePrimitives(primitives, React, createPortal) {
+  return Object.freeze({
+    Button: primitives.Button,
+    CodeBlock: primitives.CodeBlock,
+    DisclosureRow: primitives.DisclosureRow,
+    Menu: isHostComponent(primitives.Menu) ? primitives.Menu : createFallbackMenu(React, createPortal),
+    MenuFallback: createFallbackMenu(React, createPortal),
+    Modal: isHostComponent(primitives.Modal) ? primitives.Modal : createFallbackModal(React, createPortal),
+    Toast: primitives.Toast,
+    Tooltip: primitives.Tooltip,
+  })
+}
+
+/** Adapt host action styling, or own it completely when the primitive is absent. */
+export function createActionButton(React, Button) {
+  const h = React.createElement
+  return function ActionButton({ className = '', 'data-kind': kind, ...props }) {
+    const classes = className.split(/\s+/).filter(name => name !== '' && name !== 'ptcPlusButton')
+    return isHostComponent(Button)
+      ? h(Button, {
+        type: 'button', ...props, size: 'sm',
+        variant: kind === 'primary' ? 'primary' : kind === 'ghost' ? 'ghost' : 'outline',
+        className: classes.join(' '),
+      })
+      : h('button', { type: 'button', ...props, className: ['ptcPlusButton', ...classes].join(' '), 'data-kind': kind })
+  }
+}
+
+export { createFallbackMenu, createFallbackModal }

package/src/client-repl-view.js

@@ -1,4 +1,4 @@
-import { isHostIconComponent } from './client-host-compat.js'
+import { isHostComponent, isHostIconComponent } from './client-host-compat.js'
 
 /**
  * REPL surface views: the conversation tab (session bindings + global workbench)
@@ -23,7 +23,7 @@ export function createReplView(React, deps) {
         h('strong', null, entry.name),
         h('span', null, t('memory.location', entry.definition))),
       h('div', { className: 'ptcPlusObservationLabel' }, t('console.definition')),
-      typeof CodeBlock === 'function'
+      isHostComponent(CodeBlock)
         ? h(CodeBlock, { code: entry.definition.source, lang: 'typescript', className: 'ptcPlusObservationCode',
             copyLabel: t('tool.copy'), copiedLabel: t('tool.copied') })
         : h('pre', { className: 'ptcPlusObservationCode' }, entry.definition.source),
@@ -275,7 +275,7 @@ export function createReplView(React, deps) {
                       line: binding.definition.line,
                       column: binding.definition.column,
                     })),
-                    typeof CodeBlock === 'function'
+                    isHostComponent(CodeBlock)
                       ? h(CodeBlock, {
                         code: binding.definition.source,
                         lang: 'typescript',

package/src/client-settings-view.js

@@ -10,13 +10,13 @@ import { featureEnabled } from './client-feature-gates.js'
 export function createPtcSettingsView(React, deps) {
   const { ActionButton, BindingsDialog, Modal, useWorkbenchController, icons } = deps
   const h = React.createElement
-  const focusableSelector = 'button:not(:disabled),input:not(:disabled),textarea:not(:disabled),select:not(:disabled),[href],[tabindex]:not([tabindex="-1"]),[contenteditable=true],summary'
 
   function fieldInput(field, value, disabled, onChange, label) {
     if (field.type === 'boolean') {
       return h('input', {
         type: 'checkbox', role: 'switch', className: 'ptcPlusCheck', checked: value === true,
         disabled, 'aria-label': label,
+        'data-modal-autofocus': field.key === 'enabled' && !disabled ? true : undefined,
         onChange: event => onChange(field, event.target.checked),
       })
     }
@@ -174,34 +174,7 @@ export function createPtcSettingsView(React, deps) {
 
   function PTCPlusSettingsDialog(props) {
     const { t, onClose } = props
-    const body = React.useRef(null)
     const [bindingsOpen, setBindingsOpen] = React.useState(false)
-    React.useEffect(() => {
-      const dialog = body.current?.closest('[role=dialog]')
-      const target = body.current?.querySelector(focusableSelector)
-        ?? dialog?.querySelector(focusableSelector)
-      target?.focus({ preventScroll: true })
-    }, [])
-    React.useEffect(() => {
-      const trapFocus = event => {
-        if (event.key !== 'Tab' || bindingsOpen) return
-        const dialog = body.current?.closest('[role=dialog]')
-        if (dialog === undefined || dialog === null) return
-        const controls = [...dialog.querySelectorAll(focusableSelector)]
-          .filter(element => !element.closest('[hidden], [inert], [aria-hidden="true"]'))
-        const first = controls[0]
-        const last = controls.at(-1)
-        const active = document.activeElement
-        if (!dialog.contains(active)
-          || (event.shiftKey && active === first)
-          || (!event.shiftKey && active === last)) {
-          event.preventDefault()
-          ;(event.shiftKey ? last : first)?.focus({ preventScroll: true })
-        }
-      }
-      document.addEventListener('keydown', trapFocus)
-      return () => document.removeEventListener('keydown', trapFocus)
-    }, [bindingsOpen])
     const close = () => {
       if (!bindingsOpen) onClose()
     }
@@ -213,7 +186,7 @@ export function createPtcSettingsView(React, deps) {
       description: t('card.description'),
       className: 'ptcPlusSettingsModal',
       contentClassName: 'ptcPlusSettingsDialogContent',
-    }, h('div', { className: 'ptcPlusSettingsDialog', ref: body },
+    }, h('div', { className: 'ptcPlusSettingsDialog' },
       h(PTCPlusSettingsCard, { ...props, view: 'dialog', onBindingsOpenChange: setBindingsOpen })))
   }