esrieact 0.1.0 → 0.2.0

package/dist/layers/MapImageLayer.d.ts

@@ -0,0 +1,14 @@
+import React from "react";
+import EsriMapImageLayer from "@arcgis/core/layers/MapImageLayer";
+/**
+ * A MapImageLayer component
+ *
+ * ArcGIS JS API Source Components:
+ * - [MapImageLayer](https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-MapImageLayer.html)
+ */
+export declare const MapImageLayer: React.ForwardRefExoticComponent<__esri.MapImageLayerProperties & {
+    children?: React.ReactNode;
+} & {
+    events?: {} | undefined;
+    layerOrder?: number | undefined;
+} & React.RefAttributes<EsriMapImageLayer>>;

package/dist/layers/MapImageLayer.js

@@ -0,0 +1,13 @@
+import React from "react";
+import EsriMapImageLayer from "@arcgis/core/layers/MapImageLayer";
+import { createLayerComponent, } from "./createLayerComponent";
+const createLayer = (properties) => {
+    return new EsriMapImageLayer(properties);
+};
+/**
+ * A MapImageLayer component
+ *
+ * ArcGIS JS API Source Components:
+ * - [MapImageLayer](https://developers.arcgis.com/javascript/latest/api-reference/esri-layers-MapImageLayer.html)
+ */
+export const MapImageLayer = React.forwardRef((properties, ref) => createLayerComponent(createLayer, ref, properties));

package/dist/layers/createLayerComponent.js

@@ -23,7 +23,7 @@ export const createLayerComponent = (createLayer, ref, { children, events, layer
      */
     const instance = useMemo(() => {
         const layer = createLayer(properties);
-        // If the parent in a GroupLayer (or any EsriInstance that has the .add(layer) method), add it to that,
+        // If the parent is a GroupLayer (or any EsriInstance that has the .add(layer) method), add it to that,
         // otherwise, add directly to the map
         if (parent && parent.add) {
             parent.add(layer, layerOrder);
@@ -44,7 +44,12 @@ export const createLayerComponent = (createLayer, ref, { children, events, layer
      */
     useEffect(() => {
         return () => {
-            map.remove(instance);
+            if (parent && parent.remove) {
+                parent.remove(instance);
+            }
+            else {
+                map.remove(instance);
+            }
         };
     }, []);
     // If no children, there is no need to render a context provider

package/dist/layers/index.d.ts

@@ -9,3 +9,4 @@ export * from "./LayerView";
 export * from "./WebTileLayer";
 export * from "./WMSLayer";
 export * from "./VectorTileLayer";
+export * from "./MapImageLayer";

package/dist/layers/index.js

@@ -9,3 +9,4 @@ export * from "./LayerView";
 export * from "./WebTileLayer";
 export * from "./WMSLayer";
 export * from "./VectorTileLayer";
+export * from "./MapImageLayer";

package/dist/map/MapView.d.ts

@@ -69,21 +69,33 @@ interface MapContextProviderProps {
     children?: ReactNode | ReactNode[];
 }
 /**
- * Provider which provides the map context to all descedants
+ * Provider which provides the map context to all descedants.
+ *
+ * @Documentation
+ * [MapContextProvider](https://slutske22.github.io/esrieact/map-view#mapcontextprovider)
  */
 export declare const MapContextProvider: React.FC<MapContextProviderProps>;
 interface Props extends HTMLAttributes<HTMLDivElement> {
     /**
      * Properties passed to the [Map](https://developers.arcgis.com/javascript/latest/api-reference/esri-Map.html)
+     *
+     * @Documentation
+     * [MapProperties](https://slutske22.github.io/esrieact/map-view#mapproperties)
      */
     MapProperties?: __esri.MapProperties;
     /**
      * Properties passed to the [MapView](https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html)
+     *
+     * @Documentation
+     * [ViewProperties](https://slutske22.github.io/esrieact/map-view#viewproperties)
      */
     ViewProperties?: __esri.MapViewProperties & {
         /**
          * Events that are attached to the MapView.  Can be an event handler function map, or a function of the `view`
          * which return an event handler function map
+         *
+         * @Documentation
+         * [ViewProperties.events](https://slutske22.github.io/esrieact/map-view#viewpropertiesevents)
          */
         events?: ViewEventHandlerFnMap | ((view: __esri.MapView) => ViewEventHandlerFnMap);
     };
@@ -96,7 +108,10 @@ interface Props extends HTMLAttributes<HTMLDivElement> {
  * MapView Component for 2D map. Accepts properties for both the Map and the MapView.  Renders the container
  * div, and once mounted, renders the map to it.
  *
- * ***Does not provide its own Map Context, and as such, will fail if you do not manuaaly provide one***
+ * ***Does not provide its own Map Context, and as such, will fail if you do not manually provide one***
+ *
+ * @Documentation
+ * [MapViewCore](https://slutske22.github.io/esrieact/map-view#mapviewcore)
  *
  * @example
  * // App.tsx
@@ -132,6 +147,9 @@ export declare const MapViewCore: React.ForwardRefExoticComponent<Props & React.
  * MapView Component for 2D map. Accepts properties for both the Map and the MapView.  Renders the container
  * div, and once mounted, renders the map to it.
  *
+ * @Documentation
+ * [MapView](https://slutske22.github.io/esrieact/map-view)
+ *
  * ArcGIS JS API Source Components:
  * - [Map](https://developers.arcgis.com/javascript/latest/api-reference/esri-Map.html)
  * - [MapView](https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html)

package/dist/map/MapView.js

@@ -9,7 +9,10 @@ import { useEsriPropertyUpdates, useEvents, } from "../utils";
  */
 export const MapContext = React.createContext({});
 /**
- * Provider which provides the map context to all descedants
+ * Provider which provides the map context to all descedants.
+ *
+ * @Documentation
+ * [MapContextProvider](https://slutske22.github.io/esrieact/map-view#mapcontextprovider)
  */
 export const MapContextProvider = ({ children, }) => {
     const [map, setMap] = useState(undefined);
@@ -25,7 +28,10 @@ export const MapContextProvider = ({ children, }) => {
  * MapView Component for 2D map. Accepts properties for both the Map and the MapView.  Renders the container
  * div, and once mounted, renders the map to it.
  *
- * ***Does not provide its own Map Context, and as such, will fail if you do not manuaaly provide one***
+ * ***Does not provide its own Map Context, and as such, will fail if you do not manually provide one***
+ *
+ * @Documentation
+ * [MapViewCore](https://slutske22.github.io/esrieact/map-view#mapviewcore)
  *
  * @example
  * // App.tsx
@@ -90,6 +96,9 @@ export const MapViewCore = React.forwardRef((props, ref) => {
  * MapView Component for 2D map. Accepts properties for both the Map and the MapView.  Renders the container
  * div, and once mounted, renders the map to it.
  *
+ * @Documentation
+ * [MapView](https://slutske22.github.io/esrieact/map-view)
+ *
  * ArcGIS JS API Source Components:
  * - [Map](https://developers.arcgis.com/javascript/latest/api-reference/esri-Map.html)
  * - [MapView](https://developers.arcgis.com/javascript/latest/api-reference/esri-views-MapView.html)
@@ -101,8 +110,9 @@ export const MapView = React.forwardRef((props, ref) => {
  * Utility hook to get the undnerlying `map` and `view` instances of a MapView
  */
 export const useMap = () => {
-    const { map, view } = useContext(MapContext);
-    if (!map || !view) {
+    const context = useContext(MapContext);
+    const { map, view } = context;
+    if (!context) {
         throw new Error("Cannot find esrieact map context, are you sure your component is a descendent of a MapContext?");
     }
     return { map, view };

package/dist/symbols/SymbolPreview.d.ts

@@ -3,7 +3,7 @@ interface Props {
     /**
      * The symbol to render in HTML
      */
-    symbol: __esri.Symbol;
+    symbol: __esri.SymbolUnion;
     /**
      * HTML rendering options to be passed to `renderPreviewHTML`
      */

package/dist/utils/useEsriPropertyUpdates.js

@@ -1,4 +1,4 @@
-import { useUpdateEffect } from "usehooks-ts";
+import { useUpdateEffect } from "./useUpdateEffect";
 import { usePrevious } from "./usePrevious";
 import { getObjectDiff } from ".";
 /**

package/dist/utils/usePrevious.js

@@ -1,6 +1,6 @@
 import { useEffect, useRef } from "react";
 export function usePrevious(value) {
-    const ref = useRef();
+    const ref = useRef(undefined);
     useEffect(() => {
         ref.current = value;
     }, [value]);

package/dist/utils/useUpdateEffect.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+/**
+ * Like useEffect, but skips the initial mount.
+ */
+export declare function useUpdateEffect(effect: React.EffectCallback, deps?: React.DependencyList): void;

package/dist/utils/useUpdateEffect.js

@@ -0,0 +1,14 @@
+import { useEffect, useRef } from "react";
+/**
+ * Like useEffect, but skips the initial mount.
+ */
+export function useUpdateEffect(effect, deps) {
+    const isFirst = useRef(true);
+    useEffect(() => {
+        if (isFirst.current) {
+            isFirst.current = false;
+            return;
+        }
+        return effect();
+    }, deps);
+}

package/dist/widgets/Expand.js

@@ -11,5 +11,6 @@ const createWidget = (properties) => {
  * - [Expand](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Expand.html)
  */
 export const Expand = React.forwardRef((properties, ref) => {
+    // @ts-expect-error internal mismatch of arcgis types?
     return createWidgetComponent(createWidget, ref, properties);
 });

package/dist/widgets/Legend.js

@@ -11,5 +11,6 @@ const createWidget = (properties) => {
  * - [Legend](https://developers.arcgis.com/javascript/latest/api-reference/esri-widgets-Legend.html)
  */
 export const Legend = React.forwardRef((properties, ref) => {
+    // @ts-expect-error internal mismatch of arcgis types?
     return createWidgetComponent(createWidget, ref, properties);
 });

package/dist/widgets/SearchBar.js

@@ -2,6 +2,7 @@ import React from "react";
 import EsriSearch from "@arcgis/core/widgets/Search";
 import { createWidgetComponent } from ".";
 const createSearchWidget = (properties) => {
+    // @ts-expect-error internal mismatch of arcgis types?
     return new EsriSearch(properties);
 };
 /**

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "esrieact",
   "private": false,
-  "version": "0.1.0",
+  "version": "0.2.0",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "files": [
@@ -23,17 +23,16 @@
     "./widgets/*": "./dist/widgets/*"
   },
   "dependencies": {
-    "lodash.isequal": "^4.5.0",
-    "usehooks-ts": "^2.9.1"
+    "lodash.isequal": "^4.5.0"
   },
   "peerDependencies": {
-    "@arcgis/core": "^4.28.10",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0"
+    "@arcgis/core": "^4.30.0",
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
   },
   "devDependencies": {
-    "@types/react": "^18.2.43",
-    "@types/react-dom": "^18.2.17",
+    "@types/react": "^19.0.0",
+    "@types/react-dom": "^19.0.0",
     "typescript": "^5.2.2"
   }
 }