More specific type checking for code component props

Hey, I’m trying to make the React FluentUI components available and the docs have left me hanging.

The FluentUI Dropdown component has the available options specified by an array of IDropDownOptions which is a type that adds isSelected to ISelectableOptions (which has a bunch of attributes) - how do I go about translating something like that into a registerComponent line?

What I have now uses type: "object"

PLASMIC.registerComponent(Dropdown, {
   name: "Dropdown",
   props: {
     label: "string",
     multiSelect: "boolean",
     readOnly: "boolean",
     defaultSelectedKeys: "string",
     ariaLabel: "string",
     options: {
       type: "object",
     },
   },
 });

It works if I set the object to:

[
  {
    "text": "Option 1",
    "index": 0
  },
  {
    "text": "Option 2",
    "index": 1
  }
]

But I’ve lost all that great specificity. Is there a way to say “it’s of type object, and its type is X”?

As an aside, the preview gives me a bunch of errors

TypeError: Failed to fetch

image.png

PS. Hello from Australia.

We’re actually actively working on some improvements in this exact area, but for now, yes, ‘object’ is the most specific type you can do for in-Plasmic-Studio feedback

Do you see that error if you create a new blank project and preview it? Or only on a specific project? Is that project app-hosted?

App-hosted, yep, blank apart from a button I’ve put in from the fluentui design system.

Today I’m getting SecurityError: Blocked a frame with origin "<http://localhost:3000>" from accessing a cross-origin frame. from the preview.

Oh, yarn’s died with 137

2021-12-18T03:09:28.034Z: Project piMK6NLBTa6BVDMyEBbMme updated to revision 47
Killed
error Command failed with exit code 137.

OK, that’s previewing now, but god that Ant Option looks bad

But I’m not getting that sync error I was getting yesterday. So :shrug: .

Re: crash and the fetch error: do you see these on even a fresh create-plasmic-app, or only with your specific app?

Re: ant: can you tell if the css was loaded?

Actually will move ant to the other thread