Custom widget in popup

[sidd]

Hi Community,

I am transitioning from using the ArcGIS JavaScript API to ArcGIS Experience Builder Developer Edition, and I need some guidance regarding popup customization.

In the ArcGIS JavaScript API, I was able to create custom popups using the PopupTemplate. Specifically, I used the type: "custom" feature in the content section to render a React component within the popup. Here's an example of how I achieved this:

//////////////////////////////////////////////////////////////////////////////////

  export const SiteCustomPopupTemplate = {

  title: "Site Name: {site_name}",

  fieldInfos: site_fields, // Array of fields to display content:

  content: [

    {

        type: "custom",

        creator: (event) => {

        const container = document.createElement("div");

        const selected_site = event.graphic.attributes.site_name;

        const feature_attributes = event.graphic.attributes;

        ReactDOM.render(

          <SiteReactComponent

            selected_site={selected_site}

            featureAttributes={feature_attributes} />,

          container);

        return container;

      },

    },

  ],

};

//////////////////////////////////////////////////////////////////////////////////

 

 

This approach allowed me to embed a fully functional React component (<SiteReactComponent />) within the popup. As I am working with about real time data, the component updates its UI every 60 seconds by querying other related published data from the ArcGIS portal.

Now, I am working in ArcGIS Experience Builder Developer Edition and would like to replicate this functionality. However, I couldn't find a way to include a custom widget or even available widgets within a popup in Experience Builder.

My Question:

Is it possible to add a custom-developed widget in a popup in ArcGIS Experience Builder? If so, how can I achieve this?

Any guidance, code examples, or documentation links would be greatly appreciated!

Thank you for your help!

[TimWestern]

I'm not sure if I understand what you are trying to do.  It looks like you are trying to render different urls within the popup?  (I wonder how that works with how CORS works currently).  

I know popups can be setup on maps, and you can enable or disable their appearance on layers.  The last time I wanted something to pop out, I had to design a component that would use CSS to draw outside of the normal widget frame.  I seem to recall it was quite a pain to get it to do what I desired, knowing how CSS works helped, unfortunately I don't have any other suggestions that might work.

What I do know is its possible to create custom actions that perform certain actions.  I recently used a search selection to move the extent, drop a pin, and then find and load a specific widget from out of a panel.  That's not quite how popups look though, and it sounds like you might be looking for something more specific?