topic Re: ReactJS Typescript in ArcGIS JavaScript Maps SDK Questions

ReactJS Typescript

vijaybadugu — Thu, 23 Oct 2025 14:22:20 GMT

Is there any help online documentation for mapcomponents react js ?

Re: ReactJS Typescript

DavidSolari — Thu, 23 Oct 2025 15:53:13 GMT

If you're asking how to embed the new SDK components in a React component, the official docs go over how to render them and pass in data to their attributes. Once you hit a wall you can post about the specific component/attribute issue you're having and get focused help from there.

Re: ReactJS Typescript

vijaybadugu — Thu, 23 Oct 2025 16:55:17 GMT

I created a separate component ActionBar.tsx , Which includes, Layers, Legend and basemap Gallerty

<CalcitePanel

ref={(el) => { panelRefs.current['legend'] = el; }}

heading="Legend"

data-panel-id="legend"

closed={activeWidget !== 'legend'}

closable

onCalcitePanelClose={handlePanelClose}

style={{ height: '100%' }}

{mapRef && <ArcgisLegend legendStyle="classic" referenceElement={mapRef} />}

I have passed Map reference object and View object, Nothing is working. I was getting No Legend.

Re: ReactJS Typescript

Justin_Greco — Mon, 27 Oct 2025 21:42:38 GMT

I'm thinking it should be mapRef.current instead of just mapRef.

Re: ReactJS Typescript

vijaybadugu — Mon, 27 Oct 2025 21:48:20 GMT

I tried everything with no luck

Re: ReactJS Typescript

ReneRubalcava — Mon, 27 Oct 2025 22:20:22 GMT

If you have a github repo, can take a look, but our samples don't use the react wrappers

https://github.com/Esri/jsapi-resources/tree/main/component-samples/map-and-charts-components-react

Re: ReactJS Typescript

Justin_Greco — Fri, 31 Oct 2025 10:55:19 GMT

Can you post the entire code for your component?

Since you are using React 19 and if this is a new app, I’d recommend not using the calcite-components-react wrapper.