Attribute `expandRootOnLoad` in Layers component from `@craftjs/layers` not working in Basic page editor example

[jeffquach]

Describe the bug
After following the tutorial to create a basic page editor in the documentation and adding the layers package the expandRootOnLoad attribute doesn't work as expected in the <Layers /> component.

To Reproduce
Steps to reproduce the behavior:

1. Followed the tutorial outlined here: https://craft.js.org/docs/guides/basic-tutorial.
2. Made slight modifications to the code to not use material-ui.
3. Code for the page editor can be viewed below:

import React from 'react';

import { Toolbox } from '../components/Toolbox';
import { SettingsPanel } from '../components/SettingsPanel';
import { Topbar } from '../components/Topbar';
import { Container } from '../components/user/Container';
import { Button } from '../components/user/Button';
import { Card, CardTop, CardBottom } from '../components/user/Card';
import { Text } from '../components/user/Text';
import { Editor, Frame, Element } from "@craftjs/core";
import { Layers } from "@craftjs/layers"

const App: React.FC = () => {
  return (
    <div style={{margin: "0 auto", width: "800px"}}>
      <h2 style={{ textAlign: 'center' }}>A super simple page editor</h2>
      <Editor resolver={{ Card, Button, Text, Container, CardTop, CardBottom }}>
        <Layers
          expandRootOnLoad={true}
        />
        <div>
          <Topbar />
        </div>
        <div style={{ display: 'flex', gap: '24px' }}>
          <div style={{ flex: 1 }}>
            <Frame>
              <Element is={Container} padding={5} background="#eee" canvas>
                <Card /> // Node of type Card
                <Button size="small" variant="outlined" text="Click" /> // Node of type Button, draggable
                <Text fontSize={12} text="Hi world!" /> // Node of type Text, draggable
                <Element is={Container} padding={2} background="#999" canvas> // Canvas Node of type Container, droppable and draggable
                  <Text text="It's me again!" /> // Node of type Text, draggable
                </Element>
              </Element>
            </Frame>
          </div>
          <div style={{ width: '25%' }}>
            <div style={{
              backgroundColor: '#fff',
              boxShadow: '0px 2px 1px -1px rgba(0,0,0,0.2), 0px 1px 1px 0px rgba(0,0,0,0.14), 0px 1px 3px 0px rgba(0,0,0,0.12)',
              borderRadius: '4px',
              padding: '16px'
            }}>
              <Toolbox />
              <SettingsPanel />
            </div>
          </div>
        </div>
      </Editor>
    </div>
  );
}

export default App;

Expected behavior
The children of the root node in the Layers panel is expected to be visible when using the expandRootOnLoad attribute.

Additional context
Would be great if the tutorial to create a basic page editor didn't rely on an outdated external library such as material-ui.

Your environment

Software	Version(s)
@craftjs/core	^0.2.11
@craftjs/layers	^0.2.6
React	^18.2.0
TypeScript	^5.1.6
Browser	Brave v1.73.104
npm/Yarn	npm 10.5.0
Operating System	Ubuntu 24.04.1 LTS

[fizefeko]

I have the same issue