@joewinke/jatui 0.17.1 → 0.18.1

package/dist/actions/listNav.d.ts

@@ -6,6 +6,12 @@
  * select, contenteditable) and most modifier combos are skipped so the
  * shortcuts never interfere with typing or app-level keybindings.
  *
+ * Focus honesty (mos-5lzns.59): Enter/Space only select the j/k cursor's
+ * item when real DOM focus is not on a different activatable control
+ * (a link/button/summary/[role=button]). After Tab moves focus elsewhere,
+ * Enter activates that control and Space keeps its native meaning instead
+ * of triggering the highlighted item.
+ *
  * Vim-motion layer (always on):
  *
  *   gg           jump to first item

package/dist/actions/listNav.js

@@ -6,6 +6,12 @@
  * select, contenteditable) and most modifier combos are skipped so the
  * shortcuts never interfere with typing or app-level keybindings.
  *
+ * Focus honesty (mos-5lzns.59): Enter/Space only select the j/k cursor's
+ * item when real DOM focus is not on a different activatable control
+ * (a link/button/summary/[role=button]). After Tab moves focus elsewhere,
+ * Enter activates that control and Space keeps its native meaning instead
+ * of triggering the highlighted item.
+ *
  * Vim-motion layer (always on):
  *
  *   gg           jump to first item
@@ -75,6 +81,18 @@ function isTypingTarget(target) {
         return true;
     return target.isContentEditable;
 }
+/** Controls that own Enter/Space by real DOM focus. When one of these holds
+ *  focus (and it is not the focused list item itself), listNav must not
+ *  consume the key — the browser default (follow the link, press the
+ *  button, toggle the disclosure) or the page's own handler wins. */
+const ACTIVATABLE_SELECTOR = 'a[href], button, summary, [role="button"]';
+function isActivatable(target) {
+    if (typeof HTMLElement === 'undefined')
+        return false;
+    if (!(target instanceof HTMLElement))
+        return false;
+    return target.matches(ACTIVATABLE_SELECTOR);
+}
 function hasModifier(e) {
     return e.ctrlKey || e.metaKey || e.altKey;
 }
@@ -497,6 +515,13 @@ function makeController(optsRef) {
                 const el = items[focused];
                 if (!el)
                     return false;
+                // Focus honesty (mos-5lzns.59): when real DOM focus sits on a
+                // different activatable control (the user Tabbed away from the
+                // list), Enter/Space belongs to that control — Enter must follow
+                // the link / press the button, and Space must keep scrolling.
+                // Bail without consuming the event.
+                if (e.target !== el && isActivatable(e.target))
+                    return false;
                 e.preventDefault();
                 clearPending();
                 opts.onSelect?.(el, focused);

package/dist/components/Button.svelte

@@ -7,9 +7,20 @@
 	 * success check animation, error shake → auto-idle.
 	 */
 
+	import type { HTMLButtonAttributes } from 'svelte/elements';
+
 	type SubmitState = 'idle' | 'loading' | 'success' | 'error';
 
-	interface Props {
+	/**
+	 * Any other native attribute (aria-*, data-*, name, value, form, title, id,
+	 * event handlers…) passes straight through to the rendered <button> — or to
+	 * the <a> when `href` is set. The props below are owned by the component.
+	 */
+	interface Props
+		extends Omit<
+			HTMLButtonAttributes,
+			'type' | 'disabled' | 'class' | 'onclick' | 'children'
+		> {
 		variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'error' | 'warning' | 'success' | 'info';
 		size?: 'xs' | 'sm' | 'md' | 'lg';
 		href?: string;
@@ -48,7 +59,8 @@
 		pressed,
 		class: className = '',
 		onclick,
-		children
+		children,
+		...rest
 	}: Props = $props();
 
 	// Merge legacy boolean props into the state machine
@@ -63,7 +75,10 @@
 	const isError    = $derived(effectiveState === 'error');
 
 	// Only a provided boolean becomes aria-pressed; undefined omits the attribute.
-	const ariaPressed = $derived(pressed === undefined ? undefined : pressed ? 'true' : 'false');
+	// A raw aria-pressed in the rest props is honoured when `pressed` is omitted.
+	const ariaPressed = $derived(
+		pressed === undefined ? rest['aria-pressed'] : pressed ? 'true' : 'false'
+	);
 
 	const variantClass = $derived(
 		{
@@ -128,15 +143,23 @@
 </script>
 
 {#if href}
-	<a {href} class={buttonClass} role="button" tabindex="0" aria-pressed={ariaPressed}>
+	<a
+		{...rest as Record<string, unknown>}
+		{href}
+		class={buttonClass}
+		role={rest.role ?? 'button'}
+		aria-pressed={ariaPressed}
+		{onclick}
+	>
 		{#if children}{@render children()}{/if}
 	</a>
 {:else}
 	<button
+		{...rest}
 		bind:this={btnEl}
 		{type}
 		disabled={disabled || isLoading}
-		aria-busy={isLoading || undefined}
+		aria-busy={isLoading || rest['aria-busy']}
 		aria-pressed={ariaPressed}
 		class={buttonClass}
 		{onclick}

package/dist/components/Button.svelte.d.ts

@@ -1,12 +1,18 @@
 /**
- * Button Component
- *
- * Generic DaisyUI button with variant, size, loading state, and optional href.
- * Adds: press squish, submit state machine (idle/loading/success/error),
- * success check animation, error shake → auto-idle.
- */
+     * Button Component
+     *
+     * Generic DaisyUI button with variant, size, loading state, and optional href.
+     * Adds: press squish, submit state machine (idle/loading/success/error),
+     * success check animation, error shake → auto-idle.
+     */
+import type { HTMLButtonAttributes } from 'svelte/elements';
 type SubmitState = 'idle' | 'loading' | 'success' | 'error';
-interface Props {
+/**
+ * Any other native attribute (aria-*, data-*, name, value, form, title, id,
+ * event handlers…) passes straight through to the rendered <button> — or to
+ * the <a> when `href` is set. The props below are owned by the component.
+ */
+interface Props extends Omit<HTMLButtonAttributes, 'type' | 'disabled' | 'class' | 'onclick' | 'children'> {
     variant?: 'primary' | 'secondary' | 'outline' | 'ghost' | 'error' | 'warning' | 'success' | 'info';
     size?: 'xs' | 'sm' | 'md' | 'lg';
     href?: string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@joewinke/jatui",
-  "version": "0.17.1",
+  "version": "0.18.1",
   "private": false,
   "description": "Shared Svelte 5 component library for JAT projects",
   "type": "module",