Remove click buffer, add CSS cursor:pointer for island controls
The click buffer (capture + stopPropagation + replay) caused more harm than good: synchronous XHR blocks the main thread during kernel load, so there's no window where clicks can be captured. The buffer was eating clicks after hydration due to property name mismatches. Replace with pure CSS: buttons/links/[role=button] inside islands get cursor:pointer from SSR. No JS needed, works immediately. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -76,9 +76,8 @@ details.group{overflow:hidden}details.group>summary{list-style:none}details.grou
|
||||
(body :class "bg-stone-50 text-stone-900"
|
||||
;; Server-rendered HTML — visible immediately before JS loads
|
||||
(div :id "sx-root" (raw! (or body-html "")))
|
||||
;; Event buffer — captures clicks during hydration gap, replayed after boot
|
||||
(style (raw! "@keyframes sx-pending-pulse{0%,100%{opacity:1}50%{opacity:.5}}.sx-pending{animation:sx-pending-pulse .8s ease-in-out infinite}"))
|
||||
(script (raw! "document.addEventListener('click',function(e){var i=e.target.closest('[data-sx-island]');if(i&&!i['_sxBoundisland-hydrated']){e.stopPropagation();var t=e.target.closest('button,a,[role=button]')||e.target;t.classList.add('sx-pending');(window._sxQ=window._sxQ||[]).push({t:t,ts:Date.now()})}},true)"))
|
||||
;; Island interactive elements — cursor pointer from SSR, no JS needed
|
||||
(style (raw! "[data-sx-island] button,[data-sx-island] a,[data-sx-island] [role=button]{cursor:pointer}"))
|
||||
(script :type "text/sx" :data-components true :data-hash component-hash
|
||||
(raw! (or component-defs "")))
|
||||
(when init-sx
|
||||
|
||||
Reference in New Issue
Block a user