keyboard-operable ClideTappable + palette nav (T-100)

Plug widgets into the keymap layer landed in T-117.

ClideTappable:
  - Wrap in `Actions(ActivateIntent → onTap)` outside a `Focus` so
    dispatch from the focused context walks up and hits the action.
  - Add a focus ring via `tokens.globalFocus` (DecoratedBox foreground
    overlay, transparent border when unfocused, no layout shift).
  - Disabled (`onTap == null`) skips focus traversal and shows the
    forbidden cursor.

ClidePalette:
  - Register Actions for the four palette intents
    (selectNext / selectPrev / accept / dismiss).
  - Publish `palette.open` scope flag via `KeymapService.setScopeFlag`
    so when-clauses can scope future bindings to "palette only".
  - Highlight the selected row with `listItemSelectedBackground`;
    scroll it into view on nav.
  - `PaletteController` grows `selectedIndex` + `selectNext` /
    `selectPrevious` / `acceptSelected`; index resets on open /
    filter change.

Intents.dart drops the `ClideIntent` base — `ActivateIntent` and
`DismissIntent` come from Flutter; clide owns the palette and text-
scale and command-bridge subclasses. `parseIntentId('activate')` →
Flutter's class; same for dismiss. Widget code uses the canonical
Flutter Intent types where they fit.

App root grows a PaletteOpenIntent action that calls
`services.palette.open()`, completing the ctrl/cmd+shift+p path
end-to-end.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

lib/widgets/src/clide_palette.dart

@@ -12,21 +12,91 @@ class ClidePalette extends StatefulWidget {
 
 class _ClidePaletteState extends State<ClidePalette> {
   final _input = TextEditingController();
-  final _focus = FocusNode();
+  final _focus = FocusNode(debugLabel: 'ClidePalette.input');
+  final _itemKeys = <int, GlobalKey>{};
+
+  PaletteController? _palette;
+  KeymapService? _keymap;
 
   @override
-  void initState() {
-    super.initState();
-    _focus.requestFocus();
+  void didChangeDependencies() {
+    super.didChangeDependencies();
+    final kernel = ClideKernel.of(context);
+    if (!identical(_palette, kernel.palette)) {
+      _palette?.removeListener(_onPaletteChanged);
+      _palette = kernel.palette;
+      _palette!.addListener(_onPaletteChanged);
+      _syncFromController();
+    }
+    _keymap = kernel.keymap;
+    // Sync the initial state: if the palette was opened before this
+    // widget mounted (e.g., open()-then-pumpWidget in a test), no
+    // listener fires for the "already open" condition. Mirror what
+    // _onPaletteChanged would have done.
+    final isOpen = _palette?.isOpen ?? false;
+    _keymap?.setScopeFlag('palette.open', isOpen);
+    if (isOpen && !_focus.hasFocus) {
+      WidgetsBinding.instance.addPostFrameCallback((_) {
+        if (mounted && (_palette?.isOpen ?? false)) _focus.requestFocus();
+      });
+    }
   }
 
   @override
   void dispose() {
+    _palette?.removeListener(_onPaletteChanged);
+    _keymap?.clearScopeFlag('palette.open');
     _input.dispose();
     _focus.dispose();
     super.dispose();
   }
 
+  void _onPaletteChanged() {
+    final isOpen = _palette?.isOpen ?? false;
+    _keymap?.setScopeFlag('palette.open', isOpen);
+    if (isOpen) _focus.requestFocus();
+    _syncFromController();
+  }
+
+  void _syncFromController() {
+    final f = _palette?.filter ?? '';
+    if (_input.text != f) {
+      _input.value = TextEditingValue(text: f, selection: TextSelection.collapsed(offset: f.length));
+    }
+  }
+
+  Object? _selectNext(PaletteSelectNextIntent _) {
+    _palette?.selectNext();
+    _scrollSelectedIntoView();
+    return null;
+  }
+
+  Object? _selectPrev(PaletteSelectPreviousIntent _) {
+    _palette?.selectPrevious();
+    _scrollSelectedIntoView();
+    return null;
+  }
+
+  Object? _accept(PaletteAcceptIntent _) {
+    _palette?.acceptSelected();
+    _input.clear();
+    return null;
+  }
+
+  Object? _dismiss(DismissIntent _) {
+    _palette?.close();
+    return null;
+  }
+
+  void _scrollSelectedIntoView() {
+    final idx = _palette?.selectedIndex;
+    if (idx == null) return;
+    final key = _itemKeys[idx];
+    final ctx = key?.currentContext;
+    if (ctx == null) return;
+    Scrollable.ensureVisible(ctx, duration: const Duration(milliseconds: 120), alignment: 0.5);
+  }
+
   @override
   Widget build(BuildContext context) {
     final kernel = ClideKernel.of(context);
@@ -36,71 +106,84 @@ class _ClidePaletteState extends State<ClidePalette> {
       builder: (ctx, _) {
         if (!kernel.palette.isOpen) return const SizedBox.shrink();
         final filtered = kernel.palette.filtered();
+        final selected = kernel.palette.selectedIndex;
         return Positioned(
           top: 60,
           left: 0,
           right: 0,
           child: Center(
-            child: Container(
-              width: 480,
-              constraints: const BoxConstraints(maxHeight: 360),
-              decoration: BoxDecoration(
-                color: tokens.dropdownBackground,
-                border: Border.all(color: tokens.dropdownBorder),
-                borderRadius: BorderRadius.circular(6),
-                boxShadow: const [
-                  BoxShadow(
-                    color: Color(0x40000000),
-                    blurRadius: 12,
-                    offset: Offset(0, 4),
-                  ),
-                ],
-              ),
-              child: Column(
-                mainAxisSize: MainAxisSize.min,
-                children: [
-                  Padding(
-                    padding: const EdgeInsets.all(8),
-                    child: EditableText(
-                      controller: _input,
-                      focusNode: _focus,
-                      style: TextStyle(
-                        fontFamily: clideMonoFamily,
-                        fontSize: clideFontMono,
-                        color: tokens.dropdownForeground,
-                      ),
-                      cursorColor: tokens.globalFocus,
-                      backgroundCursorColor: tokens.globalFocus,
-                      maxLines: 1,
-                      onChanged: (v) => kernel.palette.setFilter(v),
-                      onSubmitted: (_) {
-                        if (filtered.isNotEmpty) {
-                          kernel.palette.invoke(filtered.first.command);
+            child: Actions(
+              actions: <Type, Action<Intent>>{
+                PaletteSelectNextIntent: CallbackAction<PaletteSelectNextIntent>(onInvoke: _selectNext),
+                PaletteSelectPreviousIntent: CallbackAction<PaletteSelectPreviousIntent>(onInvoke: _selectPrev),
+                PaletteAcceptIntent: CallbackAction<PaletteAcceptIntent>(onInvoke: _accept),
+                DismissIntent: CallbackAction<DismissIntent>(onInvoke: _dismiss),
+              },
+              child: Container(
+                width: 480,
+                constraints: const BoxConstraints(maxHeight: 360),
+                decoration: BoxDecoration(
+                  color: tokens.dropdownBackground,
+                  border: Border.all(color: tokens.dropdownBorder),
+                  borderRadius: BorderRadius.circular(6),
+                  boxShadow: const [
+                    BoxShadow(
+                      color: Color(0x40000000),
+                      blurRadius: 12,
+                      offset: Offset(0, 4),
+                    ),
+                  ],
+                ),
+                child: Column(
+                  mainAxisSize: MainAxisSize.min,
+                  children: [
+                    Padding(
+                      padding: const EdgeInsets.all(8),
+                      child: EditableText(
+                        controller: _input,
+                        focusNode: _focus,
+                        style: TextStyle(
+                          fontFamily: clideMonoFamily,
+                          fontSize: clideFontMono,
+                          color: tokens.dropdownForeground,
+                        ),
+                        cursorColor: tokens.globalFocus,
+                        backgroundCursorColor: tokens.globalFocus,
+                        maxLines: 1,
+                        onChanged: (v) => kernel.palette.setFilter(v),
+                        // Enter on the input forwards to the palette
+                        // accept intent — keeps the legacy single-key
+                        // submit working alongside arrow-driven nav.
+                        onSubmitted: (_) {
+                          kernel.palette.acceptSelected();
                           _input.clear();
-                        }
-                      },
+                        },
+                      ),
                     ),
-                  ),
-                  Flexible(
-                    child: ListView.builder(
-                      shrinkWrap: true,
-                      padding: EdgeInsets.zero,
-                      itemCount: filtered.length,
-                      itemBuilder: (ctx, i) {
-                        final cmd = filtered[i];
-                        return _PaletteItem(
-                          title: cmd.title ?? cmd.command,
-                          command: cmd.command,
-                          binding: cmd.defaultBinding,
-                          onTap: () {
-                            kernel.palette.invoke(cmd.command);
-                            _input.clear();
-                          },
-                        );
-                      },
+                    Flexible(
+                      child: ListView.builder(
+                        shrinkWrap: true,
+                        padding: EdgeInsets.zero,
+                        itemCount: filtered.length,
+                        itemBuilder: (ctx, i) {
+                          final cmd = filtered[i];
+                          final key = _itemKeys.putIfAbsent(i, () => GlobalKey());
+                          return _PaletteItem(
+                            key: key,
+                            title: cmd.title ?? cmd.command,
+                            command: cmd.command,
+                            binding: cmd.defaultBinding,
+                            highlighted: i == selected,
+                            onTap: () {
+                              kernel.palette.invoke(cmd.command);
+                              _input.clear();
+                            },
+                          );
+                        },
+                      ),
                     ),
-                  ),
-                ],
+                  ],
+                ),
               ),
             ),
           ),
@@ -112,15 +195,18 @@ class _ClidePaletteState extends State<ClidePalette> {
 
 class _PaletteItem extends StatefulWidget {
   const _PaletteItem({
+    super.key,
     required this.title,
     required this.command,
     required this.onTap,
+    required this.highlighted,
     this.binding,
   });
 
   final String title;
   final String command;
   final String? binding;
+  final bool highlighted;
   final VoidCallback onTap;
 
   @override
@@ -133,6 +219,7 @@ class _PaletteItemState extends State<_PaletteItem> {
   @override
   Widget build(BuildContext context) {
     final tokens = ClideTheme.of(context).surface;
+    final selected = widget.highlighted;
     return MouseRegion(
       cursor: SystemMouseCursors.click,
       onEnter: (_) => setState(() => _hover = true),
@@ -140,14 +227,18 @@ class _PaletteItemState extends State<_PaletteItem> {
       child: GestureDetector(
         onTap: widget.onTap,
         child: Container(
-          color: _hover ? tokens.listItemHoverBackground : null,
+          color: selected
+              ? tokens.listItemSelectedBackground
+              : _hover
+                  ? tokens.listItemHoverBackground
+                  : null,
           padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
           child: Row(
             children: [
               Expanded(
                 child: ClideText(
                   widget.title,
-                  color: tokens.listItemForeground,
+                  color: selected ? tokens.listItemSelectedForeground : tokens.listItemForeground,
                 ),
               ),
               if (widget.binding != null)

lib/widgets/src/clide_tappable.dart

@@ -1,6 +1,15 @@
+import 'package:clide/kernel/kernel.dart' show ClideTheme;
 import 'package:clide/widgets/src/clide_tooltip.dart';
 import 'package:flutter/widgets.dart';
 
+/// Mouse + keyboard activatable surface. Wraps the [builder] child in
+/// a `Focus` so Tab traversal reaches it; an `Actions` provider that
+/// handles [ActivateIntent] by invoking [onTap] (the keymap binds
+/// Enter / Space to ActivateIntent by default); and a focus ring
+/// rendered via `tokens.globalFocus`.
+///
+/// Hover + pressed state still feed [builder] for visual feedback.
+/// Disabled state (`onTap == null`) blocks focus traversal too.
 class ClideTappable extends StatefulWidget {
   const ClideTappable({
     super.key,
@@ -10,6 +19,8 @@ class ClideTappable extends StatefulWidget {
     this.onPressChanged,
     this.cursor = SystemMouseCursors.click,
     this.tooltip,
+    this.focusNode,
+    this.autofocus = false,
   });
 
   final Widget Function(BuildContext context, bool hovered, bool pressed) builder;
@@ -18,6 +29,8 @@ class ClideTappable extends StatefulWidget {
   final ValueChanged<bool>? onPressChanged;
   final MouseCursor cursor;
   final String? tooltip;
+  final FocusNode? focusNode;
+  final bool autofocus;
 
   @override
   State<ClideTappable> createState() => _ClideTappableState();
@@ -26,6 +39,16 @@ class ClideTappable extends StatefulWidget {
 class _ClideTappableState extends State<ClideTappable> {
   bool _hover = false;
   bool _pressed = false;
+  bool _focused = false;
+  FocusNode? _internalFocus;
+
+  FocusNode get _effectiveFocus => widget.focusNode ?? (_internalFocus ??= FocusNode(debugLabel: 'ClideTappable'));
+
+  @override
+  void dispose() {
+    _internalFocus?.dispose();
+    super.dispose();
+  }
 
   void _setPressed(bool v) {
     if (_pressed == v) return;
@@ -33,10 +56,22 @@ class _ClideTappableState extends State<ClideTappable> {
     widget.onPressChanged?.call(v);
   }
 
+  void _setFocused(bool v) {
+    if (_focused == v) return;
+    setState(() => _focused = v);
+  }
+
+  Object? _activate(ActivateIntent _) {
+    widget.onTap?.call();
+    return null;
+  }
+
   @override
   Widget build(BuildContext context) {
+    final tokens = ClideTheme.of(context).surface;
+    final enabled = widget.onTap != null;
     Widget child = MouseRegion(
-      cursor: widget.cursor,
+      cursor: enabled ? widget.cursor : SystemMouseCursors.forbidden,
       onEnter: (_) => setState(() => _hover = true),
       onExit: (_) {
         setState(() => _hover = false);
@@ -46,12 +81,46 @@ class _ClideTappableState extends State<ClideTappable> {
         behavior: HitTestBehavior.opaque,
         onTap: widget.onTap,
         onLongPress: widget.onLongPress,
-        onTapDown: (_) => _setPressed(true),
-        onTapUp: (_) => _setPressed(false),
-        onTapCancel: () => _setPressed(false),
+        onTapDown: enabled ? (_) => _setPressed(true) : null,
+        onTapUp: enabled ? (_) => _setPressed(false) : null,
+        onTapCancel: enabled ? () => _setPressed(false) : null,
         child: widget.builder(context, _hover, _pressed),
       ),
     );
+
+    // Focus ring — 2 px outer outline in the global focus token. Drawn
+    // as a wrapping decoration so it sits outside the child's content
+    // without shifting layout (the same DecoratedBox always paints;
+    // border color falls through to transparent when unfocused).
+    child = DecoratedBox(
+      position: DecorationPosition.foreground,
+      decoration: BoxDecoration(
+        border: Border.all(
+          color: _focused ? tokens.globalFocus : const Color(0x00000000),
+          width: 2,
+        ),
+        borderRadius: BorderRadius.circular(3),
+      ),
+      child: child,
+    );
+
+    // Actions wraps Focus: dispatching ActivateIntent from the focused
+    // context (the node held by Focus) walks UP and finds this Actions
+    // provider. The reverse nesting would leave Actions as a descendant
+    // of the focused context — unreachable.
+    child = Actions(
+      actions: <Type, Action<Intent>>{
+        ActivateIntent: CallbackAction<ActivateIntent>(onInvoke: _activate),
+      },
+      child: Focus(
+        focusNode: _effectiveFocus,
+        canRequestFocus: enabled,
+        autofocus: widget.autofocus,
+        onFocusChange: _setFocused,
+        child: child,
+      ),
+    );
+
     if (widget.tooltip != null) {
       child = ClideTooltip(message: widget.tooltip!, child: child);
     }