Custom component not accepting text

Issues
1

When using a custom component, I can’t seem to set any text content (dynamic text is allowed, however) - see video below:

2

This is how I’m registering the component:

// Navigation
PLASMIC.registerComponent(BreadcrumbItem, {
  name: 'BreadcrumbItem',
  props: {
    key: 'string',
    elementType: 'string',
    isCurrent: 'boolean',
    isDisabled: 'boolean',
    children: 'slot',
  },
});

PLASMIC.registerComponent(Breadcrumbs, {
  name: 'Breadcrumbs',
  props: {
    className: 'string',
    children: {
      type: 'slot',
      allowedComponents: ['BreadcrumbItem'],
      defaultValue: [
        {
          type: 'component',
          name: 'BreadcrumbItem',
          props: {
            key: 'home',
            children: {
              type: 'text',
              value: 'Home',
            },
          },
        },
        {
          type: 'component',
          name: 'BreadcrumbItem',
          props: {
            key: 'store',
            children: {
              type: 'text',
              value: 'Store',
            },
          },
        },
      ],
    },
  },
});
3

I’ve also disabled react strict mode, it will then allow me to edit some text, but there seems to be a memory leak in Plasmic.

Screenshot 2023-07-17 at 16.11.38.png
Screenshot 2023-07-17 at 16.11.38.png786×160 11.1 KB

4

^ when this error occurs, it doesn’t allow me to edit any further

5

These React component may be doing something funky with the React elements - where are these components from? We can take a look

For now, unless you need them to be slots, you can also make them configurable as regular string props

6

These React component may be doing something funky with the React elements - where are these components from? We can take a look
These are both components created from react-aria. Using their hooks to compose a new code component

7

I’ll test if text works over slots shortly. PS: We have a bunch of other components by react-aria and they work fine in Plasmic

8

We do React.cloneElement for the breadcrumbs, could that be an issue? See RA example: https://react-spectrum.adobe.com/react-aria/useBreadcrumbs.html#example