@octanejs/react-map-gl 0.0.1

package/src/mapbox/proxy-transform.ts

@@ -0,0 +1,155 @@
+// @ts-nocheck — byte-exact reuse of @vis.gl/react-mapbox 8.1.2. Upstream compiles
+// without strictNullChecks or noImplicitAny; this repository is strict. The copy
+// under upstream/ is typechecked with upstream's own configuration instead, so
+// nothing here is unchecked, only checked at the settings its authors chose.
+// Every line below this four-line banner is byte-identical to upstream.
+import type {Transform} from '../types/internal';
+import type {ViewState, LngLat} from '../types/common';
+import {applyViewStateToTransform, isViewStateControlled} from '../utils/transform';
+
+/**
+ * Mapbox map is stateful.
+ * During method calls/user interactions, map.transform is mutated and deviate from user-supplied props.
+ * In order to control the map reactively, we trap the transform mutations with a proxy,
+ * which reflects the view state resolved from both user-supplied props and the underlying state
+ */
+export type ProxyTransform = Transform & {
+  $internalUpdate: boolean;
+  $proposedTransform: Transform | null;
+  $reactViewState: Partial<ViewState>;
+};
+
+// These are Transform class methods that:
+// + do not mutate any view state properties
+// + populate private members derived from view state properties
+// They should always reflect the state of their owning instance and NOT trigger any proxied getter/setter
+const unproxiedMethods = new Set([
+  '_calcMatrices',
+  '_calcFogMatrices',
+  '_updateCameraState',
+  '_updateSeaLevelZoom'
+]);
+
+export function createProxyTransform(tr: Transform): ProxyTransform {
+  let internalUpdate = false;
+  let reactViewState: Partial<ViewState> = {};
+  /**
+   * Reflects view state set by react props
+   * This is the transform seen by painter, style etc.
+   */
+  const controlledTransform: Transform = tr;
+  /** Populated during camera move (handler/easeTo) if there is a discrepency between react props and proposed view state
+   * This is the transform seen by Mapbox's input handlers
+   */
+  let proposedTransform: Transform | null = null;
+
+  const handlers: ProxyHandler<Transform> = {
+    get(target: Transform, prop: string) {
+      // Props added by us
+      if (prop === '$reactViewState') {
+        return reactViewState;
+      }
+      if (prop === '$proposedTransform') {
+        return proposedTransform;
+      }
+      if (prop === '$internalUpdate') {
+        return internalUpdate;
+      }
+
+      // Ugly - this method is called from HandlerManager bypassing zoom setter
+      if (prop === '_setZoom') {
+        return (z: number) => {
+          if (internalUpdate) {
+            proposedTransform?.[prop](z);
+          }
+          if (!Number.isFinite(reactViewState.zoom)) {
+            controlledTransform[prop](z);
+          }
+        };
+      }
+
+      // Ugly - this method is called from HandlerManager and mutates transform._camera
+      if (
+        internalUpdate &&
+        prop === '_translateCameraConstrained' &&
+        isViewStateControlled(reactViewState)
+      ) {
+        proposedTransform = proposedTransform || controlledTransform.clone();
+      }
+
+      if (unproxiedMethods.has(prop)) {
+        // When this function is executed, it updates both transforms respectively
+        return function (...parms: unknown[]) {
+          proposedTransform?.[prop](...parms);
+          controlledTransform[prop](...parms);
+        };
+      }
+
+      // Expose the proposed transform to input handlers
+      if (internalUpdate && proposedTransform) {
+        return proposedTransform[prop];
+      }
+
+      // Expose the controlled transform to renderer, markers, and event listeners
+      return controlledTransform[prop];
+    },
+
+    set(target: Transform, prop: string, value: unknown) {
+      // Props added by us
+      if (prop === '$reactViewState') {
+        reactViewState = value as Partial<ViewState>;
+        applyViewStateToTransform(controlledTransform, reactViewState);
+        return true;
+      }
+      if (prop === '$proposedTransform') {
+        proposedTransform = value as Transform;
+        return true;
+      }
+      if (prop === '$internalUpdate') {
+        internalUpdate = value as boolean;
+        return true;
+      }
+
+      // Controlled props
+      let controlledValue = value;
+      if (prop === 'center' || prop === '_center') {
+        if (Number.isFinite(reactViewState.longitude) || Number.isFinite(reactViewState.latitude)) {
+          // @ts-expect-error LngLat constructor is not typed
+          controlledValue = new value.constructor(
+            reactViewState.longitude ?? (value as LngLat).lng,
+            reactViewState.latitude ?? (value as LngLat).lat
+          );
+        }
+      } else if (prop === 'zoom' || prop === '_zoom' || prop === '_seaLevelZoom') {
+        if (Number.isFinite(reactViewState.zoom)) {
+          controlledValue = controlledTransform[prop];
+        }
+      } else if (prop === '_centerAltitude') {
+        if (Number.isFinite(reactViewState.elevation)) {
+          controlledValue = controlledTransform[prop];
+        }
+      } else if (prop === 'pitch' || prop === '_pitch') {
+        if (Number.isFinite(reactViewState.pitch)) {
+          controlledValue = controlledTransform[prop];
+        }
+      } else if (prop === 'bearing' || prop === 'rotation' || prop === 'angle') {
+        if (Number.isFinite(reactViewState.bearing)) {
+          controlledValue = controlledTransform[prop];
+        }
+      }
+
+      // During camera update, we save view states that are overriden by controlled values in proposedTransform
+      if (internalUpdate && controlledValue !== value) {
+        proposedTransform = proposedTransform || controlledTransform.clone();
+      }
+      if (internalUpdate && proposedTransform) {
+        proposedTransform[prop] = value;
+      }
+
+      // controlledTransform is not exposed to view state mutation
+      controlledTransform[prop] = controlledValue;
+      return true;
+    }
+  };
+  return new Proxy(tr, handlers) as ProxyTransform;
+}

package/src/types/common.ts

@@ -0,0 +1,41 @@
+// @ts-nocheck — byte-exact reuse of @vis.gl/react-mapbox 8.1.2. Upstream compiles
+// without strictNullChecks or noImplicitAny; this repository is strict. The copy
+// under upstream/ is typechecked with upstream's own configuration instead, so
+// nothing here is unchecked, only checked at the settings its authors chose.
+// Every line below this four-line banner is byte-identical to upstream.
+import type {PaddingOptions} from 'mapbox-gl';
+
+export type {
+  Point,
+  PointLike,
+  LngLat,
+  LngLatLike,
+  LngLatBounds,
+  LngLatBoundsLike,
+  PaddingOptions,
+  GeoJSONFeature as MapGeoJSONFeature
+} from 'mapbox-gl';
+
+/* Public */
+
+/** Describes the camera's state */
+export type ViewState = {
+  /** Longitude at map center */
+  longitude: number;
+  /** Latitude at map center */
+  latitude: number;
+  /** Map zoom level */
+  zoom: number;
+  /** Map rotation bearing in degrees counter-clockwise from north */
+  bearing: number;
+  /** Map angle in degrees at which the camera is looking at the ground */
+  pitch: number;
+  /** Dimensions in pixels applied on each side of the viewport for shifting the vanishing point. */
+  padding: PaddingOptions;
+  /** Center elevation on terrain */
+  elevation?: number;
+};
+
+export interface ImmutableLike<T> {
+  toJS: () => T;
+}

package/src/types/events.ts

@@ -0,0 +1,130 @@
+// @ts-nocheck — byte-exact reuse of @vis.gl/react-mapbox 8.1.2. Upstream compiles
+// without strictNullChecks or noImplicitAny; this repository is strict. The copy
+// under upstream/ is typechecked with upstream's own configuration instead, so
+// nothing here is unchecked, only checked at the settings its authors chose.
+// Every line below this four-line banner is byte-identical to upstream.
+import type {ViewState, LngLat} from './common';
+import {
+  Marker,
+  Popup,
+  GeolocateControl,
+  MapEvent,
+  MapEventOf,
+  ErrorEvent,
+  MapMouseEvent,
+  MapTouchEvent,
+  MapStyleDataEvent,
+  MapSourceDataEvent,
+  MapWheelEvent
+} from 'mapbox-gl';
+
+export type {
+  MapEvent,
+  ErrorEvent,
+  MapMouseEvent,
+  MapTouchEvent,
+  MapStyleDataEvent,
+  MapSourceDataEvent,
+  MapWheelEvent
+};
+
+export type MapBoxZoomEvent =
+  | MapEventOf<'boxzoomstart'>
+  | MapEventOf<'boxzoomend'>
+  | MapEventOf<'boxzoomcancel'>;
+
+export type MapCallbacks = {
+  onMouseDown?: (e: MapMouseEvent) => void;
+  onMouseUp?: (e: MapMouseEvent) => void;
+  onMouseOver?: (e: MapMouseEvent) => void;
+  onMouseMove?: (e: MapMouseEvent) => void;
+  onClick?: (e: MapMouseEvent) => void;
+  onDblClick?: (e: MapMouseEvent) => void;
+  onMouseEnter?: (e: MapMouseEvent) => void;
+  onMouseLeave?: (e: MapMouseEvent) => void;
+  onMouseOut?: (e: MapMouseEvent) => void;
+  onContextMenu?: (e: MapMouseEvent) => void;
+  onTouchStart?: (e: MapTouchEvent) => void;
+  onTouchEnd?: (e: MapTouchEvent) => void;
+  onTouchMove?: (e: MapTouchEvent) => void;
+  onTouchCancel?: (e: MapTouchEvent) => void;
+
+  onMoveStart?: (e: ViewStateChangeEvent) => void;
+  onMove?: (e: ViewStateChangeEvent) => void;
+  onMoveEnd?: (e: ViewStateChangeEvent) => void;
+  onDragStart?: (e: ViewStateChangeEvent) => void;
+  onDrag?: (e: ViewStateChangeEvent) => void;
+  onDragEnd?: (e: ViewStateChangeEvent) => void;
+  onZoomStart?: (e: ViewStateChangeEvent) => void;
+  onZoom?: (e: ViewStateChangeEvent) => void;
+  onZoomEnd?: (e: ViewStateChangeEvent) => void;
+  onRotateStart?: (e: ViewStateChangeEvent) => void;
+  onRotate?: (e: ViewStateChangeEvent) => void;
+  onRotateEnd?: (e: ViewStateChangeEvent) => void;
+  onPitchStart?: (e: ViewStateChangeEvent) => void;
+  onPitch?: (e: ViewStateChangeEvent) => void;
+  onPitchEnd?: (e: ViewStateChangeEvent) => void;
+
+  onWheel?: (e: MapWheelEvent) => void;
+  onBoxZoomStart?: (e: MapBoxZoomEvent) => void;
+  onBoxZoomEnd?: (e: MapBoxZoomEvent) => void;
+  onBoxZoomCancel?: (e: MapBoxZoomEvent) => void;
+
+  onResize?: (e: MapEvent) => void;
+  onLoad?: (e: MapEvent) => void;
+  onRender?: (e: MapEvent) => void;
+  onIdle?: (e: MapEvent) => void;
+  onError?: (e: ErrorEvent) => void;
+  onRemove?: (e: MapEvent) => void;
+  onData?: (e: MapStyleDataEvent | MapSourceDataEvent) => void;
+  onStyleData?: (e: MapStyleDataEvent) => void;
+  onSourceData?: (e: MapSourceDataEvent) => void;
+};
+
+interface IMapEvent<SourceT, OriginalEventT = undefined> {
+  type: string;
+  target: SourceT;
+  originalEvent: OriginalEventT;
+}
+
+export interface Callbacks {
+  [key: `on${string}`]: Function;
+}
+
+export type ViewStateChangeEvent = MapEventOf<
+  | 'movestart'
+  | 'move'
+  | 'moveend'
+  | 'zoomstart'
+  | 'zoom'
+  | 'zoomend'
+  | 'rotatestart'
+  | 'rotate'
+  | 'rotateend'
+  | 'dragstart'
+  | 'drag'
+  | 'dragend'
+  | 'pitchstart'
+  | 'pitch'
+  | 'pitchend'
+> & {
+  viewState: ViewState;
+};
+
+export type PopupEvent = {
+  type: 'open' | 'close';
+  target: Popup;
+};
+
+export type MarkerEvent<OriginalEventT = undefined> = IMapEvent<Marker, OriginalEventT>;
+
+export type MarkerDragEvent = MarkerEvent & {
+  type: 'dragstart' | 'drag' | 'dragend';
+  lngLat: LngLat;
+};
+
+export type GeolocateEvent = IMapEvent<GeolocateControl>;
+
+export type GeolocateResultEvent = GeolocateEvent & GeolocationPosition;
+
+export type GeolocateErrorEvent = GeolocateEvent & GeolocationPositionError;

package/src/types/internal.ts

@@ -0,0 +1,20 @@
+// @ts-nocheck — byte-exact reuse of @vis.gl/react-mapbox 8.1.2. Upstream compiles
+// without strictNullChecks or noImplicitAny; this repository is strict. The copy
+// under upstream/ is typechecked with upstream's own configuration instead, so
+// nothing here is unchecked, only checked at the settings its authors chose.
+// Every line below this four-line banner is byte-identical to upstream.
+// Internal types
+import type {Map} from 'mapbox-gl';
+
+export type Transform = Map['transform'];
+
+export type {
+  GeoJSONSource as GeoJSONSourceImplementation,
+  ImageSource as ImageSourceImplementation,
+  CanvasSource as CanvasSourceImplementation,
+  VectorTileSource as VectorSourceImplementation,
+  RasterTileSource as RasterSourceImplementation,
+  RasterDemTileSource as RasterDemSourceImplementation,
+  VideoSource as VideoSourceImplementation,
+  Source as AnySourceImplementation
+} from 'mapbox-gl';

package/src/types/lib.ts

@@ -0,0 +1,70 @@
+// @ts-nocheck — byte-exact reuse of @vis.gl/react-mapbox 8.1.2. Upstream compiles
+// without strictNullChecks or noImplicitAny; this repository is strict. The copy
+// under upstream/ is typechecked with upstream's own configuration instead, so
+// nothing here is unchecked, only checked at the settings its authors chose.
+// Every line below this four-line banner is byte-identical to upstream.
+import type {
+  Map,
+  MapOptions,
+  Marker,
+  MarkerOptions,
+  Popup,
+  PopupOptions,
+  AttributionControl,
+  AttributionControlOptions,
+  FullscreenControl,
+  FullscreenControlOptions,
+  GeolocateControl,
+  GeolocateControlOptions,
+  NavigationControl,
+  NavigationControlOptions,
+  ScaleControl,
+  ScaleControlOptions
+} from 'mapbox-gl';
+
+export type {
+  ControlPosition,
+  IControl,
+  Map as MapInstance,
+  MapOptions,
+  Marker as MarkerInstance,
+  MarkerOptions,
+  Popup as PopupInstance,
+  PopupOptions,
+  AttributionControl as AttributionControlInstance,
+  AttributionControlOptions,
+  FullscreenControl as FullscreenControlInstance,
+  FullscreenControlOptions,
+  GeolocateControl as GeolocateControlInstance,
+  GeolocateControlOptions,
+  NavigationControl as NavigationControlInstance,
+  NavigationControlOptions,
+  ScaleControl as ScaleControlInstance,
+  ScaleControlOptions,
+  CustomLayerInterface
+} from 'mapbox-gl';
+
+/**
+ * A user-facing type that represents the minimal intersection between Mapbox and Maplibre
+ * User provided `mapLib` is supposed to implement this interface
+ * Only losely typed for compatibility
+ */
+export interface MapLib {
+  supported?: (options: any) => boolean;
+
+  Map: {new (options: MapOptions): Map};
+
+  Marker: {new (options: MarkerOptions): Marker};
+
+  Popup: {new (options: PopupOptions): Popup};
+
+  AttributionControl: {new (options: AttributionControlOptions): AttributionControl};
+
+  FullscreenControl: {new (options: FullscreenControlOptions): FullscreenControl};
+
+  GeolocateControl: {new (options: GeolocateControlOptions): GeolocateControl};
+
+  NavigationControl: {new (options: NavigationControlOptions): NavigationControl};
+
+  ScaleControl: {new (options: ScaleControlOptions): ScaleControl};
+}

package/src/types/octane.ts

@@ -0,0 +1,27 @@
+/**
+ * Octane replacements for the React types the upstream binding uses in its
+ * public props. Upstream reaches for `React.CSSProperties`, `React.ReactNode`
+ * and `React.Ref`; this module is where those three become Octane types so the
+ * ported components read like their upstream counterparts everywhere else.
+ *
+ * There is no upstream module at this path. It is a port-owned addition.
+ */
+import type { OctaneNode } from 'octane';
+import type { Octane } from 'octane/jsx-runtime';
+
+/** Structural equivalent of `React.CSSProperties`, taken from the host typing. */
+export type CSSProperties = Exclude<
+	Octane.JSX.IntrinsicElements['div']['style'],
+	string | undefined
+> & {
+	[customProperty: `--${string}`]: string | number | undefined;
+};
+
+/** Anything renderable in a child position — upstream's `React.ReactNode`. */
+export type MapChildren = OctaneNode;
+
+/**
+ * Octane has no `forwardRef`: a ref is an ordinary prop, so a component that
+ * exposes an imperative handle declares `ref?: Ref<T>` in its own props.
+ */
+export type Ref<T> = ((value: T | null) => void) | { current: T | null } | null;

package/src/types/style-spec.ts

@@ -0,0 +1,51 @@
+// @ts-nocheck — byte-exact reuse of @vis.gl/react-mapbox 8.1.2. Upstream compiles
+// without strictNullChecks or noImplicitAny; this repository is strict. The copy
+// under upstream/ is typechecked with upstream's own configuration instead, so
+// nothing here is unchecked, only checked at the settings its authors chose.
+// Every line below this four-line banner is byte-identical to upstream.
+/*
+ * Mapbox Style Specification types
+ */
+export type CanvasSourceSpecification = {
+  type: 'canvas';
+  coordinates: [[number, number], [number, number], [number, number], [number, number]];
+  animate?: boolean;
+  canvas: string | HTMLCanvasElement;
+};
+
+export type {
+  // Layers
+  LayerSpecification,
+  FillLayerSpecification,
+  LineLayerSpecification,
+  SymbolLayerSpecification,
+  CircleLayerSpecification,
+  HeatmapLayerSpecification,
+  FillExtrusionLayerSpecification,
+  RasterLayerSpecification,
+  RasterParticleLayerSpecification,
+  HillshadeLayerSpecification,
+  ModelLayerSpecification,
+  BackgroundLayerSpecification,
+  SkyLayerSpecification,
+  SlotLayerSpecification,
+  ClipLayerSpecification,
+
+  // Sources
+  SourceSpecification,
+  VectorSourceSpecification,
+  RasterSourceSpecification,
+  RasterDEMSourceSpecification,
+  RasterArraySourceSpecification,
+  GeoJSONSourceSpecification,
+  VideoSourceSpecification,
+  ImageSourceSpecification,
+  ModelSourceSpecification,
+
+  // Style
+  StyleSpecification,
+  LightSpecification,
+  FogSpecification,
+  TerrainSpecification,
+  ProjectionSpecification
+} from 'mapbox-gl';

package/src/utils/apply-react-style.ts

@@ -0,0 +1,26 @@
+import type { CSSProperties } from '../types/octane';
+// This is a simplified version of
+// https://github.com/facebook/react/blob/4131af3e4bf52f3a003537ec95a1655147c81270/src/renderers/dom/shared/CSSPropertyOperations.js#L62
+const unitlessNumber = /box|flex|grid|column|lineHeight|fontWeight|opacity|order|tabSize|zIndex/;
+
+// Ported from upstream src/utils/apply-react-style.ts. The only change is the
+// style type: upstream annotates it `React.CSSProperties`. The name is kept
+// because it is the upstream module name, not a claim about React.
+export function applyReactStyle(
+	element: HTMLElement | undefined,
+	styles: CSSProperties | undefined,
+): void {
+	if (!element || !styles) {
+		return;
+	}
+	const style = element.style;
+
+	for (const key in styles) {
+		const value = (styles as Record<string, unknown>)[key];
+		if (Number.isFinite(value) && !unitlessNumber.test(key)) {
+			(style as unknown as Record<string, unknown>)[key] = `${value}px`;
+		} else {
+			(style as unknown as Record<string, unknown>)[key] = value;
+		}
+	}
+}

package/src/utils/assert.ts

@@ -0,0 +1,10 @@
+// @ts-nocheck — byte-exact reuse of @vis.gl/react-mapbox 8.1.2. Upstream compiles
+// without strictNullChecks or noImplicitAny; this repository is strict. The copy
+// under upstream/ is typechecked with upstream's own configuration instead, so
+// nothing here is unchecked, only checked at the settings its authors chose.
+// Every line below this four-line banner is byte-identical to upstream.
+export default function assert(condition: any, message: string) {
+  if (!condition) {
+    throw new Error(message);
+  }
+}

package/src/utils/children.ts

@@ -0,0 +1,26 @@
+import { Children, isChildrenBlock } from 'octane';
+
+/**
+ * Upstream `Marker` asks whether it was given any children with
+ *
+ *     React.Children.forEach(props.children, el => { if (el) hasChildren = true })
+ *
+ * and uses the answer to choose between Mapbox's own default pin and a
+ * binding-created element it portals custom content into.
+ *
+ * Octane's compiler lowers a `.tsrx` parent's element children to a
+ * children-block render function rather than a descriptor array, so
+ * `Children.forEach` alone cannot see them. A `.tsx` parent still produces
+ * descriptors. Both dialects reach this binding, so both are handled here.
+ *
+ * There is no upstream module at this path. It is a port-owned addition.
+ */
+export function hasRenderableChildren(children: unknown): boolean {
+	if (children == null) return false;
+	if (isChildrenBlock(children)) return true;
+	let found = false;
+	Children.forEach(children, (child) => {
+		if (child) found = true;
+	});
+	return found;
+}

package/src/utils/compare-class-names.ts

@@ -0,0 +1,34 @@
+// @ts-nocheck — byte-exact reuse of @vis.gl/react-mapbox 8.1.2. Upstream compiles
+// without strictNullChecks or noImplicitAny; this repository is strict. The copy
+// under upstream/ is typechecked with upstream's own configuration instead, so
+// nothing here is unchecked, only checked at the settings its authors chose.
+// Every line below this four-line banner is byte-identical to upstream.
+/** Compare two classNames string and return the difference */
+export function compareClassNames(
+  prevClassName: string | undefined,
+  nextClassName: string | undefined
+): string[] | null {
+  if (prevClassName === nextClassName) {
+    return null;
+  }
+
+  const prevClassList = getClassList(prevClassName);
+  const nextClassList = getClassList(nextClassName);
+  const diff: string[] = [];
+
+  for (const c of nextClassList) {
+    if (!prevClassList.has(c)) {
+      diff.push(c);
+    }
+  }
+  for (const c of prevClassList) {
+    if (!nextClassList.has(c)) {
+      diff.push(c);
+    }
+  }
+  return diff.length === 0 ? null : diff;
+}
+
+function getClassList(className: string | undefined) {
+  return new Set(className ? className.trim().split(/\s+/) : []);
+}

package/src/utils/deep-equal.ts

@@ -0,0 +1,66 @@
+// @ts-nocheck — byte-exact reuse of @vis.gl/react-mapbox 8.1.2. Upstream compiles
+// without strictNullChecks or noImplicitAny; this repository is strict. The copy
+// under upstream/ is typechecked with upstream's own configuration instead, so
+// nothing here is unchecked, only checked at the settings its authors chose.
+// Every line below this four-line banner is byte-identical to upstream.
+import type {PointLike} from '../types/common';
+
+/**
+ * Compare two points
+ * @param a
+ * @param b
+ * @returns true if the points are equal
+ */
+export function arePointsEqual(a?: PointLike, b?: PointLike): boolean {
+  const ax = Array.isArray(a) ? a[0] : a ? a.x : 0;
+  const ay = Array.isArray(a) ? a[1] : a ? a.y : 0;
+  const bx = Array.isArray(b) ? b[0] : b ? b.x : 0;
+  const by = Array.isArray(b) ? b[1] : b ? b.y : 0;
+  return ax === bx && ay === by;
+}
+
+/* eslint-disable complexity */
+/**
+ * Compare any two objects
+ * @param a
+ * @param b
+ * @returns true if the objects are deep equal
+ */
+export function deepEqual(a: any, b: any): boolean {
+  if (a === b) {
+    return true;
+  }
+  if (!a || !b) {
+    return false;
+  }
+  if (Array.isArray(a)) {
+    if (!Array.isArray(b) || a.length !== b.length) {
+      return false;
+    }
+    for (let i = 0; i < a.length; i++) {
+      if (!deepEqual(a[i], b[i])) {
+        return false;
+      }
+    }
+    return true;
+  } else if (Array.isArray(b)) {
+    return false;
+  }
+  if (typeof a === 'object' && typeof b === 'object') {
+    const aKeys = Object.keys(a);
+    const bKeys = Object.keys(b);
+    if (aKeys.length !== bKeys.length) {
+      return false;
+    }
+    for (const key of aKeys) {
+      if (!b.hasOwnProperty(key)) {
+        return false;
+      }
+      if (!deepEqual(a[key], b[key])) {
+        return false;
+      }
+    }
+    return true;
+  }
+  return false;
+}