Edit/add prop values to update instance

Plasmic Studio Questions
1

How to I edit/add prop values of a registration code component and see it update the instance of that component on the canvas?
Like in this example, I’m adding align: "center". . I was expecting to right click the instance and update or something.

props: {
  spacing: '8',
  align: "center",
2

In addition, these props have a blue dot next to them , as soon as I drag the component to the canvas. So I can’t right click + Unset Align or Unset Spacing.

image.png
image.png830×238 21.5 KB

3

I tried “right click + Creating Component” in Plasmic from my code component on the canvas. Now I can update all props and the instances change as expected.

But now I have 2 components, my registered one and the new one via plasmic’s UI. I think
I would prefer to edit the props on the original code based one.

4

In saying that, my code based one shows selection options when hovering, which I think could be an issue as could accidentally move elements around (see image).
So is it considered best practice, to always create a Plasmic component via the UI?

image.png
image.png523×613 15.9 KB

5

hmm you shouldn’t be building UI through component registration… If you’re registering a LoginForm component, and you don’t intend to let the user drag around the input, then, you shouldn’t add input etc as default slot content; instead, you can just directly render the input from your LoginForm component

Default slot content is really just a way to stamp down some default content for the user to modify

6

I do intend to let the user drag around the input etc…
It was just that its all selectable as you hover, and therefore a little to easy to move things around. Yet if I “Create component” of the component it doesn’t do this, you have to click in it to edit in place and the reset of the screen is gray:

image.png
image.png672×676 19.3 KB

7

Ignoring this issue. My main question was … Can I edit to props of my code component via code and see it appear on instances?

8

… and avoid having 2 versions of the same component (…P is the plasmic created version ):

image.png

9

Changing the default slot content in the component registration call will not change the existing component instances you already have in your design; since it’s possible for the studio user to make changes to stuff in the slot content, we wouldn’t want to erase any changes that were made by the studio user.

From the studio, you could instead right-click on the slot for the component instance, and select “revert to default content”, which should pick up your new registered default content

10

“revert to default content” doesn’t appear to work in this instance.
In this case, I have a Stack core component with default content that I do not want:

children: {
      type: "slot",
      defaultValue: [
        {
          type: 'text',
          value: 'Click me!'
        }
      ]
    },

The registered component has other components in this slot, and those components have slots with components too (a tree). So I need all of this content to appear.

Sounds like this is not possible and maybe a feature request? Would be good to right click the instance (not a slot) and update to master component.