Add component edit form to contextual panel

hooroomoo → changed the visibility of the branch 3452512-edit-2 to hidden.

Started on edit-3 branch which is off the most recent 0.x that has ✨ [MR Only] Edit any component prop, powered by a new FieldForComponentSuggester service, which will power the JS UI Fixed . Didn't get very far yet, currently the branch is just rendering the values from field.feld..node.article.field_xb_demo which is hard-coded in layout-default.json. Not sure if there's an endpoint that exists yet that I can fetch the tree and props/model from.

See gitlab MR description for more details...

There isn't any 😅

hooroomoo → changed the visibility of the branch 3452512-noop to hidden.

@hooroomoo shared a screenshot in Slack, attaching here:

👆 Unfortunately, I can’t get to that point locally — maybe because of

$ npm run build

> vite-template-redux@0.0.0 build
> tsc && vite build

nsrc/features/panel/ContextualPanel.tsx:30:35 - error TS7031: Binding element 'htmlString' implicitly has an 'any' type.

30 const BadHtmlParserComponent = ({ htmlString }) => {
                                     ~~~~~~~~~~

src/features/panel/ContextualPanel.tsx:43:62 - error TS2345: Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
  Type 'undefined' is not assignable to type 'string'.

43   const responseAsDocument = new DOMParser().parseFromString(response.data, 'text/html');
                                                                ~~~~~~~~~~~~~


Found 2 errors in the same file, starting at: src/features/panel/ContextualPanel.tsx:30

wim.leers at MacBookPro-WimLeers in ~/core/modules/contrib/experience_builder/ui on edit-3*

Ah yeah I see there are TS errors that cause the build to fail. But if you run in development mode npm run dev you should be able to reproduce it. I will fix the build errors though.

We still need to wait for new endpoints to actually make changes to the backend so this is still in early stages.

What are the missing endpoints? Are there Drupal.org issues for these endpoints already? Can we link them here for clarity?

Updated IS with details of how the form is being generated.

Current state it only has the text prop rendering right now:

Radix tooltip that shows unique data to prove JSX-ified drupal form can be integrated with our frontend

This is using Drupal's autocomplete behavior

Marking for the remarks I posted.

Plus, @effulgentsia just requested that "undo" support works correctly even when the autocomplete is used — that's indeed worth verifying that it works correctly.

After my remarks + @effulgentsia's is addressed, please assign this to @bnjmnm. When he gets back from PTO next week, I think he'd be the best person to extract pieces that can land today. No pieces that call/reuse TwoTerribleTextAreasWidget should land, and instead we should work on the next steps under in 🌱 [META] Early phase back-end work coordination Active .