feat: allow component metadata storage

[Traveller23]

Related discussion: https://github.com/prevwong/craft.js/discussions/576

After adding this feature, whenever we get the Node, we will also get the custom metadata of the user component. So we were able to automate some of the actions that we previously had to perform manually. This can bring more configurability to the whole framework.

[changeset-bot[bot]]

🦋 Changeset detected

Latest commit: df0bd8dcdbacc4888a1ba9137ff4af9b7776d700

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@craftjs/core	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
craftjs	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Feb 19, 2024 10:57am

[prevwong]

We can already achieve the same results with the custom prop already, no?

const Component = () => {}

Component.craft => {
  custom: {...}
} 

[Traveller23]

We can already achieve the same results with the custom prop already, no?

const Component = () => {}

Component.craft => {
  custom: {...}
} 

There's a difference between customMetadata and custom: the data in custom is saved to the SerializedNode and thus to each instance. The data in customMetadata is shared by all instances of the component, so it doesn't need to be saved to SerializedNode.

Also, since we don't need to serialize customMetadata, we can put methods in there. We've been missing a means to attach methods to components before (and invoke those methods through Node), now we don't have to worry about that with customMetadata.

[prevwong]

We can already achieve the same results with the custom prop already, no?

const Component = () => {}

Component.craft => {
  custom: {...}
} 

There's a difference between customMetadata and custom: the data in custom is saved to the SerializedNode and thus to each instance. The data in customMetadata is shared by all instances of the component, so it doesn't need to be saved to SerializedNode.

Also, since we don't need to serialize customMetadata, we can put methods in there. We've been missing a means to attach methods to components before (and invoke those methods through Node), now we don't have to worry about that with customMetadata.

Ah gotcha. Can we rename customMetadata to something like info?

[Traveller23]

We can already achieve the same results with the custom prop already, no?

const Component = () => {}

Component.craft => {
  custom: {...}
} 

There's a difference between customMetadata and custom: the data in custom is saved to the SerializedNode and thus to each instance. The data in customMetadata is shared by all instances of the component, so it doesn't need to be saved to SerializedNode. Also, since we don't need to serialize customMetadata, we can put methods in there. We've been missing a means to attach methods to components before (and invoke those methods through Node), now we don't have to worry about that with customMetadata.

Ah gotcha. Can we rename customMetadata to something like info?

Sure, I'll change it right away.

[Traveller23]

@prevwong Done. If any other changes need to be made, just let me know.