Skip to content

Conversation

@dmjio
Copy link
Owner

@dmjio dmjio commented Nov 21, 2025

This adds the React Fragment feature.

This adds a fourth case to our VTree DSL (VFrag). This accounts for returning bulk sets of nodes from a component. This allows the inling of nodes from a child component into a parent component, avoiding interemdiate placeholder nodes from entering the DOM. This also means that a parent node list can contain children from potentially n-many different components.

Like React, this also makes event delegation global across all currently mounted 'Component', previously each Component had its own delegation.

  • Add VFrag case in Haskell / TypeScript.
  • Update mountComponent() callback to pass in parent
  • Remove +> , in favor of simpler mount combinator.
  • Make event delegation global, drop continue case in event.ts
  • Adds global references for entire VTree along with currently delegated events (those listened on by mountPoint (typically <body>)

Supercedes #1221

cc @ners

@dmjio dmjio force-pushed the react-fragment branch 2 times, most recently from 65e30f7 to bcc770c Compare November 21, 2025 08:50
This adds the [React Fragment](https://react.dev/reference/react/Fragment) feature.

This adds a fourth case to `VTree` DSL, `VFrag`. This accounts for returning
bulk sets of nodes from a 'Component'. This allows the inling of nodes
from a child component into a parent component, avoiding
interemdiate placeholder nodes from entering the DOM. This also means
that a parent node list can contain children from potentially n-many
different components.

Like React, this also changes event delegation to be global across all
currently mounted 'Component'.

- [x] Add `VFrag` case in Haskell / TypeScript.
- [x] Update `mountComponent()` callback to pass in `parent`
- [x] Remove `+>` , in favor of simpler `mount` combinator.
- [x] Make event delegation global, drop `continue` case in `event.ts`
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants