Skip to content

feat: Fragment support to have multiple children in a component#32

Merged
maartenbreddels merged 2 commits intomasterfrom
feat_fragment
Mar 22, 2024
Merged

feat: Fragment support to have multiple children in a component#32
maartenbreddels merged 2 commits intomasterfrom
feat_fragment

Conversation

@maartenbreddels
Copy link
Copy Markdown
Contributor

Similar to React, where children in a Fragment will be 'extended' to a parent list (like children) instead of 'appended'

Example

import reacton
import reacton.ipywidgets as w

@reacton.component
def Children():
    with reacton.Fragment():  # option for reacton, mandatory for solara
        w.Button(description="1")
        w.Button(description="2")

@reacton.component
def Test():
    with w.VBox():
        Children()
Test()

Since solara overrides the '_default_container', this is mandatory to use with solara (even when just imported). For solara v2 we will probably also start using fragments.

Similar to React, where children in a Fragment will be 'extended' to
a parent list (like children) instead of 'appended'

Example

```python
import reacton
import reacton.ipywidgets as w

@reacton.component
def Children():
    with reacton.Fragment():  # option for reacton, mandatory for solara
        w.Button(description="1")
        w.Button(description="2")

@reacton.component
def Test():
    with w.VBox():
        Children()
Test()
```

Since solara overrides the '_default_container', this is mandatory to
use with solara (even when just imported). For solara v2 we will
probably also start using fragments.
@maartenbreddels
Copy link
Copy Markdown
Contributor Author

To make this work in solara, use:

import solara # this changes reacton.core. _default_container
import reacton.core
# now restore it
reacton.core. _default_container = reacton.Fragment

@maartenbreddels
Copy link
Copy Markdown
Contributor Author

Note, Fragment does not have to be used explicitly.

import reacton
import reacton.ipywidgets as w

@reacton.component
def Children():
    # will use fragment implicitly, because we have 2 elements
    w.Button(description="1")
    w.Button(description="2")

@reacton.component
def Test():
    with w.VBox():
        Children()
Test()

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.

1 participant