@accelint/map-toolkit 0.6.0 → 1.1.0

package/dist/deckgl/shapes/edit-shape-layer/events.js

@@ -0,0 +1,56 @@
+/*
+ * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+
+'use client';
+
+//#region src/deckgl/shapes/edit-shape-layer/events.ts
+/**
+* Edit Shape Events
+*
+* Note on event payload structure:
+* These events define explicit payload types rather than using the `Payload<T, P>` helper
+* from @accelint/bus. This is because the `Shape` type contains GeoJSON `Feature` objects
+* from the `geojson` package, which don't satisfy TypeScript's `StructuredCloneable` type
+* constraint used by the bus.
+*
+* The issue: `StructuredCloneable` (from type-fest) requires objects to have an index
+* signature `[key: string]: StructuredCloneable`, but GeoJSON interfaces define strict
+* property types without index signatures. At runtime, GeoJSON data IS structurally
+* cloneable (can be passed through postMessage, stored in IndexedDB, etc.), but
+* TypeScript can't verify this statically.
+*
+* Events that only contain primitive values (like ShapeId, mapId) can use the `Payload`
+* helper directly - see shared/events.ts for examples.
+*
+* When emitting these events via the bus, use type assertions:
+* @example
+* ```ts
+* bus.emit('shapes:updated', {
+*   type: 'shapes:updated',
+*   payload: { shape, mapId },
+*   source: componentId,
+* } as unknown as Payload);
+* ```
+*/
+/**
+* Edit shape lifecycle events
+*/
+const EditShapeEvents = {
+	editing: "shapes:editing",
+	updated: "shapes:updated",
+	canceled: "shapes:edit-canceled"
+};
+
+//#endregion
+export { EditShapeEvents };
+//# sourceMappingURL=events.js.map

package/dist/deckgl/shapes/edit-shape-layer/events.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"events.js","names":[],"sources":["../../../../src/deckgl/shapes/edit-shape-layer/events.ts"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n/**\n * Edit Shape Events\n *\n * Note on event payload structure:\n * These events define explicit payload types rather than using the `Payload<T, P>` helper\n * from @accelint/bus. This is because the `Shape` type contains GeoJSON `Feature` objects\n * from the `geojson` package, which don't satisfy TypeScript's `StructuredCloneable` type\n * constraint used by the bus.\n *\n * The issue: `StructuredCloneable` (from type-fest) requires objects to have an index\n * signature `[key: string]: StructuredCloneable`, but GeoJSON interfaces define strict\n * property types without index signatures. At runtime, GeoJSON data IS structurally\n * cloneable (can be passed through postMessage, stored in IndexedDB, etc.), but\n * TypeScript can't verify this statically.\n *\n * Events that only contain primitive values (like ShapeId, mapId) can use the `Payload`\n * helper directly - see shared/events.ts for examples.\n *\n * When emitting these events via the bus, use type assertions:\n * @example\n * ```ts\n * bus.emit('shapes:updated', {\n *   type: 'shapes:updated',\n *   payload: { shape, mapId },\n *   source: componentId,\n * } as unknown as Payload);\n * ```\n */\n\n'use client';\n\nimport type { UniqueId } from '@accelint/core';\nimport type { Shape } from '../shared/types';\n\n/**\n * Edit shape lifecycle events\n */\nexport const EditShapeEvents = {\n  /** Editing has started for a shape */\n  editing: 'shapes:editing',\n  /** Shape has been successfully updated */\n  updated: 'shapes:updated',\n  /** Editing was canceled */\n  canceled: 'shapes:edit-canceled',\n} as const;\n\nexport type EditShapeEventType =\n  (typeof EditShapeEvents)[keyof typeof EditShapeEvents];\n\n/**\n * Payload for shapes:editing event.\n */\nexport type ShapeEditingPayload = {\n  /** The shape being edited */\n  shape: Shape;\n  /** Map instance ID for multi-map event isolation */\n  mapId: UniqueId;\n};\n\n/**\n * Event payload for shapes:editing\n * Emitted when editing starts\n */\nexport type ShapeEditingEvent = {\n  type: 'shapes:editing';\n  payload: ShapeEditingPayload;\n  source: UniqueId;\n  target?: UniqueId;\n};\n\n/**\n * Payload for shapes:updated event.\n */\nexport type ShapeUpdatedPayload = {\n  /** The updated shape with new geometry */\n  shape: Shape;\n  /** Map instance ID for multi-map event isolation */\n  mapId: UniqueId;\n};\n\n/**\n * Event payload for shapes:updated\n * Emitted when shape edits are saved\n */\nexport type ShapeUpdatedEvent = {\n  type: 'shapes:updated';\n  payload: ShapeUpdatedPayload;\n  source: UniqueId;\n  target?: UniqueId;\n};\n\n/**\n * Payload for shapes:edit-canceled event.\n */\nexport type ShapeEditCanceledPayload = {\n  /** The shape that was being edited (original, unchanged) */\n  shape: Shape;\n  /** Map instance ID for multi-map event isolation */\n  mapId: UniqueId;\n};\n\n/**\n * Event payload for shapes:edit-canceled\n * Emitted when editing is canceled\n */\nexport type ShapeEditCanceledEvent = {\n  type: 'shapes:edit-canceled';\n  payload: ShapeEditCanceledPayload;\n  source: UniqueId;\n  target?: UniqueId;\n};\n\n/**\n * Union of all edit shape event types\n */\nexport type EditShapeEvent =\n  | ShapeEditingEvent\n  | ShapeUpdatedEvent\n  | ShapeEditCanceledEvent;\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiDA,MAAa,kBAAkB;CAE7B,SAAS;CAET,SAAS;CAET,UAAU;CACX"}

package/dist/deckgl/shapes/edit-shape-layer/fiber.d.ts

@@ -0,0 +1,13 @@
+/*
+ * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+import "../draw-shape-layer/fiber.js";

package/dist/deckgl/shapes/edit-shape-layer/fiber.js

@@ -0,0 +1,14 @@
+/*
+ * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+
+import "../draw-shape-layer/fiber.js";

package/dist/deckgl/shapes/edit-shape-layer/index.d.ts

@@ -0,0 +1,63 @@
+/*
+ * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+import { EditShapeLayerProps } from "./types.js";
+import * as react_jsx_runtime3 from "react/jsx-runtime";
+
+//#region src/deckgl/shapes/edit-shape-layer/index.d.ts
+
+/**
+ * EditShapeLayer - A React component for editing existing shapes on the map.
+ *
+ * This component wraps the EditableGeoJsonLayer from @deck.gl-community/editable-layers
+ * and integrates with the map-mode and map-cursor systems for proper coordination.
+ *
+ * Key features:
+ * - Renders only when actively editing (returns null otherwise)
+ * - Uses cached mode instances to prevent deck.gl assertion errors
+ * - Integrates with the editing store for state management
+ * - Neutral mode authorization (lets UI decide how to handle mode conflicts)
+ * - Circles use ResizeCircleMode with tooltip, other shapes use ModifyMode
+ * - Fill colors rendered at 20% opacity, edit handles are white
+ * - Live dimension/area tooltips during editing
+ * - requestAnimationFrame() batching for smooth drag performance
+ *
+ * @example
+ * ```tsx
+ * // Import the fiber registration for JSX support
+ * import '@accelint/map-toolkit/deckgl/shapes/edit-shape-layer/fiber';
+ * import '@accelint/map-toolkit/deckgl/shapes/display-shape-layer/fiber';
+ *
+ * function Map({ mapId }) {
+ *   const { editingShape } = useEditShape(mapId);
+ *
+ *   return (
+ *     <BaseMap id={mapId}>
+ *       <displayShapeLayer
+ *         data={shapes}
+ *         mapId={mapId}
+ *         selectedShapeId={editingShape?.id}
+ *       />
+ *       <EditShapeLayer mapId={mapId} />
+ *     </BaseMap>
+ *   );
+ * }
+ * ```
+ */
+declare function EditShapeLayer({
+  id,
+  mapId,
+  unit
+}: EditShapeLayerProps): react_jsx_runtime3.JSX.Element | null;
+//#endregion
+export { EditShapeLayer };
+//# sourceMappingURL=index.d.ts.map

package/dist/deckgl/shapes/edit-shape-layer/index.js

@@ -0,0 +1,162 @@
+/*
+ * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+
+'use client';
+
+import { MapContext } from "../../base-map/provider.js";
+import { COMPLETION_EDIT_TYPES, CONTINUOUS_EDIT_TYPES } from "../shared/constants.js";
+import { getFillColor, getLineColor } from "../shared/utils/style-utils.js";
+import { ShapeFeatureType } from "../shared/types.js";
+import { useShiftZoomDisable } from "../shared/hooks/use-shift-zoom-disable.js";
+import { getDefaultEditableLayerProps } from "../shared/utils/layer-config.js";
+import { EDIT_SHAPE_LAYER_ID } from "./constants.js";
+import { getEditModeInstance } from "./modes/index.js";
+import { cancelEditingFromLayer, editStore, updateFeatureFromLayer } from "./store.js";
+import { useContext, useEffect, useRef } from "react";
+import { jsx } from "react/jsx-runtime";
+
+//#region src/deckgl/shapes/edit-shape-layer/index.tsx
+function isContinuousEditType(editType) {
+	return CONTINUOUS_EDIT_TYPES.has(editType);
+}
+function isCompletionEditType(editType) {
+	return COMPLETION_EDIT_TYPES.has(editType);
+}
+/**
+* Convert a GeoJSON Feature to a FeatureCollection for EditableGeoJsonLayer.
+* The editable-layers library accepts standard GeoJSON FeatureCollection at runtime,
+* but has stricter internal types. We use the geojson types which are compatible.
+*
+* For circles, adds the `shape: 'Circle'` property required by ResizeCircleMode.
+* ResizeCircleMode checks `properties.shape.includes('Circle')` to identify circles.
+*
+* For rectangles, adds the `shape: 'Rectangle'` property required by ModifyMode's
+* lockRectangles feature. ModifyMode checks `properties.shape === 'Rectangle'`.
+*/
+function toFeatureCollection(feature, shape) {
+	let shapeProperty;
+	if (shape === ShapeFeatureType.Circle) shapeProperty = "Circle";
+	else if (shape === ShapeFeatureType.Rectangle) shapeProperty = "Rectangle";
+	return {
+		type: "FeatureCollection",
+		features: [shapeProperty ? {
+			...feature,
+			properties: {
+				...feature.properties,
+				shape: shapeProperty
+			}
+		} : feature]
+	};
+}
+/**
+* EditShapeLayer - A React component for editing existing shapes on the map.
+*
+* This component wraps the EditableGeoJsonLayer from @deck.gl-community/editable-layers
+* and integrates with the map-mode and map-cursor systems for proper coordination.
+*
+* Key features:
+* - Renders only when actively editing (returns null otherwise)
+* - Uses cached mode instances to prevent deck.gl assertion errors
+* - Integrates with the editing store for state management
+* - Neutral mode authorization (lets UI decide how to handle mode conflicts)
+* - Circles use ResizeCircleMode with tooltip, other shapes use ModifyMode
+* - Fill colors rendered at 20% opacity, edit handles are white
+* - Live dimension/area tooltips during editing
+* - requestAnimationFrame() batching for smooth drag performance
+*
+* @example
+* ```tsx
+* // Import the fiber registration for JSX support
+* import '@accelint/map-toolkit/deckgl/shapes/edit-shape-layer/fiber';
+* import '@accelint/map-toolkit/deckgl/shapes/display-shape-layer/fiber';
+*
+* function Map({ mapId }) {
+*   const { editingShape } = useEditShape(mapId);
+*
+*   return (
+*     <BaseMap id={mapId}>
+*       <displayShapeLayer
+*         data={shapes}
+*         mapId={mapId}
+*         selectedShapeId={editingShape?.id}
+*       />
+*       <EditShapeLayer mapId={mapId} />
+*     </BaseMap>
+*   );
+* }
+* ```
+*/
+function EditShapeLayer({ id = EDIT_SHAPE_LAYER_ID, mapId, unit }) {
+	const contextId = useContext(MapContext);
+	const actualMapId = mapId ?? contextId;
+	if (!actualMapId) throw new Error("EditShapeLayer requires either a mapId prop or to be used within a MapProvider");
+	const { state: editingState } = editStore.use(actualMapId);
+	useShiftZoomDisable(actualMapId, editingState?.editingShape != null);
+	const pendingUpdateRef = useRef(null);
+	useEffect(() => {
+		return () => {
+			if (pendingUpdateRef.current) cancelAnimationFrame(pendingUpdateRef.current.rafId);
+		};
+	}, []);
+	if (!editingState?.editingShape) return null;
+	const { editingShape, editMode, featureBeingEdited } = editingState;
+	const mode = getEditModeInstance(editMode);
+	const data = toFeatureCollection(featureBeingEdited ?? editingShape.feature, editingShape.shape);
+	const cancelPendingUpdate = () => {
+		if (pendingUpdateRef.current) {
+			cancelAnimationFrame(pendingUpdateRef.current.rafId);
+			pendingUpdateRef.current = null;
+		}
+	};
+	const handleEdit = ({ updatedData, editType }) => {
+		const feature = updatedData.features[0];
+		if (isContinuousEditType(editType) && feature) {
+			cancelPendingUpdate();
+			pendingUpdateRef.current = {
+				feature,
+				rafId: requestAnimationFrame(() => {
+					updateFeatureFromLayer(actualMapId, feature);
+					pendingUpdateRef.current = null;
+				})
+			};
+			return;
+		}
+		if (isCompletionEditType(editType)) {
+			cancelPendingUpdate();
+			if (feature) updateFeatureFromLayer(actualMapId, feature);
+			return;
+		}
+		if (editType === "cancelFeature") {
+			cancelPendingUpdate();
+			cancelEditingFromLayer(actualMapId);
+		}
+	};
+	const fillColor = getFillColor(editingShape.feature, true);
+	const lineColor = getLineColor(editingShape.feature);
+	return /* @__PURE__ */ jsx("editableGeoJsonLayer", {
+		id,
+		data,
+		mode,
+		selectedFeatureIndexes: [0],
+		onEdit: handleEdit,
+		getFillColor: fillColor,
+		getLineColor: lineColor,
+		getTentativeFillColor: fillColor,
+		getTentativeLineColor: lineColor,
+		...getDefaultEditableLayerProps(unit)
+	});
+}
+
+//#endregion
+export { EditShapeLayer };
+//# sourceMappingURL=index.js.map

package/dist/deckgl/shapes/edit-shape-layer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["shapeProperty: string | undefined"],"sources":["../../../../src/deckgl/shapes/edit-shape-layer/index.tsx"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\n'use client';\n\nimport { useContext, useEffect, useRef } from 'react';\nimport { MapContext } from '../../base-map/provider';\nimport { useShiftZoomDisable } from '../shared/hooks/use-shift-zoom-disable';\nimport { ShapeFeatureType, type ShapeFeatureTypeValues } from '../shared/types';\nimport { getDefaultEditableLayerProps } from '../shared/utils/layer-config';\nimport { getFillColor, getLineColor } from '../shared/utils/style-utils';\nimport {\n  COMPLETION_EDIT_TYPES,\n  CONTINUOUS_EDIT_TYPES,\n  EDIT_SHAPE_LAYER_ID,\n} from './constants';\nimport { getEditModeInstance } from './modes';\nimport {\n  cancelEditingFromLayer,\n  editStore,\n  updateFeatureFromLayer,\n} from './store';\nimport type {\n  EditAction,\n  FeatureCollection,\n} from '@deck.gl-community/editable-layers';\nimport type { Feature } from 'geojson';\nimport type { EditShapeLayerProps } from './types';\n\nfunction isContinuousEditType(editType: string): boolean {\n  return CONTINUOUS_EDIT_TYPES.has(editType);\n}\n\nfunction isCompletionEditType(editType: string): boolean {\n  return COMPLETION_EDIT_TYPES.has(editType);\n}\n\n/**\n * Convert a GeoJSON Feature to a FeatureCollection for EditableGeoJsonLayer.\n * The editable-layers library accepts standard GeoJSON FeatureCollection at runtime,\n * but has stricter internal types. We use the geojson types which are compatible.\n *\n * For circles, adds the `shape: 'Circle'` property required by ResizeCircleMode.\n * ResizeCircleMode checks `properties.shape.includes('Circle')` to identify circles.\n *\n * For rectangles, adds the `shape: 'Rectangle'` property required by ModifyMode's\n * lockRectangles feature. ModifyMode checks `properties.shape === 'Rectangle'`.\n */\nfunction toFeatureCollection(\n  feature: Feature,\n  shape: ShapeFeatureTypeValues,\n): import('geojson').FeatureCollection {\n  // Add shape property for modes that require it\n  // - ResizeCircleMode requires shape: 'Circle'\n  // - ModifyMode lockRectangles requires shape: 'Rectangle'\n  let shapeProperty: string | undefined;\n  if (shape === ShapeFeatureType.Circle) {\n    shapeProperty = 'Circle';\n  } else if (shape === ShapeFeatureType.Rectangle) {\n    shapeProperty = 'Rectangle';\n  }\n\n  const featureWithShape = shapeProperty\n    ? {\n        ...feature,\n        properties: {\n          ...feature.properties,\n          shape: shapeProperty,\n        },\n      }\n    : feature;\n\n  return {\n    type: 'FeatureCollection',\n    features: [featureWithShape],\n  };\n}\n\n/**\n * EditShapeLayer - A React component for editing existing shapes on the map.\n *\n * This component wraps the EditableGeoJsonLayer from @deck.gl-community/editable-layers\n * and integrates with the map-mode and map-cursor systems for proper coordination.\n *\n * Key features:\n * - Renders only when actively editing (returns null otherwise)\n * - Uses cached mode instances to prevent deck.gl assertion errors\n * - Integrates with the editing store for state management\n * - Neutral mode authorization (lets UI decide how to handle mode conflicts)\n * - Circles use ResizeCircleMode with tooltip, other shapes use ModifyMode\n * - Fill colors rendered at 20% opacity, edit handles are white\n * - Live dimension/area tooltips during editing\n * - requestAnimationFrame() batching for smooth drag performance\n *\n * @example\n * ```tsx\n * // Import the fiber registration for JSX support\n * import '@accelint/map-toolkit/deckgl/shapes/edit-shape-layer/fiber';\n * import '@accelint/map-toolkit/deckgl/shapes/display-shape-layer/fiber';\n *\n * function Map({ mapId }) {\n *   const { editingShape } = useEditShape(mapId);\n *\n *   return (\n *     <BaseMap id={mapId}>\n *       <displayShapeLayer\n *         data={shapes}\n *         mapId={mapId}\n *         selectedShapeId={editingShape?.id}\n *       />\n *       <EditShapeLayer mapId={mapId} />\n *     </BaseMap>\n *   );\n * }\n * ```\n */\nexport function EditShapeLayer({\n  id = EDIT_SHAPE_LAYER_ID,\n  mapId,\n  unit,\n}: EditShapeLayerProps) {\n  // Get mapId from context if not provided\n  const contextId = useContext(MapContext);\n  const actualMapId = mapId ?? contextId;\n\n  if (!actualMapId) {\n    throw new Error(\n      'EditShapeLayer requires either a mapId prop or to be used within a MapProvider',\n    );\n  }\n\n  // Subscribe to editing state using the v2 store API\n  const { state: editingState } = editStore.use(actualMapId);\n\n  const isEditing = editingState?.editingShape != null;\n\n  // Disable zoom while Shift is held during editing\n  // This prevents boxZoom (Shift+drag) from interfering with Shift modifier constraints\n  // (e.g., Shift for uniform scaling, Shift for rotation snap)\n  useShiftZoomDisable(actualMapId, isEditing);\n\n  // RAF batching for movePosition events to reduce React updates during drag\n  const pendingUpdateRef = useRef<{\n    feature: Feature;\n    rafId: number;\n  } | null>(null);\n\n  // Cleanup RAF on unmount\n  useEffect(() => {\n    return () => {\n      if (pendingUpdateRef.current) {\n        cancelAnimationFrame(pendingUpdateRef.current.rafId);\n      }\n    };\n  }, []);\n\n  // If not editing, return null (don't render the editable layer)\n  if (!editingState?.editingShape) {\n    return null;\n  }\n\n  const { editingShape, editMode, featureBeingEdited } = editingState;\n\n  // Get the cached mode instance\n  const mode = getEditModeInstance(editMode);\n\n  // Use the live feature being edited, or fall back to original shape\n  const featureToRender = featureBeingEdited ?? editingShape.feature;\n  const data = toFeatureCollection(featureToRender, editingShape.shape);\n\n  // Helper to cancel any pending RAF update\n  const cancelPendingUpdate = () => {\n    if (pendingUpdateRef.current) {\n      cancelAnimationFrame(pendingUpdateRef.current.rafId);\n      pendingUpdateRef.current = null;\n    }\n  };\n\n  // Handle edit events from EditableGeoJsonLayer\n  const handleEdit = ({\n    updatedData,\n    editType,\n  }: EditAction<FeatureCollection>) => {\n    const feature = updatedData.features[0];\n\n    // Continuous events (during drag): batch with RAF for smooth performance\n    if (isContinuousEditType(editType) && feature) {\n      cancelPendingUpdate();\n      const rafId = requestAnimationFrame(() => {\n        updateFeatureFromLayer(actualMapId, feature as Feature);\n        pendingUpdateRef.current = null;\n      });\n      pendingUpdateRef.current = { feature: feature as Feature, rafId };\n      return;\n    }\n\n    // Completion events (drag end): update immediately\n    if (isCompletionEditType(editType)) {\n      cancelPendingUpdate();\n      if (feature) {\n        updateFeatureFromLayer(actualMapId, feature as Feature);\n      }\n      return;\n    }\n\n    // ESC key cancellation\n    if (editType === 'cancelFeature') {\n      cancelPendingUpdate();\n      cancelEditingFromLayer(actualMapId);\n    }\n  };\n\n  // Get colors from the shape's existing style properties with base opacity applied\n  const fillColor = getFillColor(editingShape.feature, true);\n  const lineColor = getLineColor(editingShape.feature);\n\n  return (\n    <editableGeoJsonLayer\n      id={id}\n      data={data}\n      mode={mode}\n      selectedFeatureIndexes={[0]}\n      onEdit={handleEdit}\n      getFillColor={fillColor}\n      getLineColor={lineColor}\n      getTentativeFillColor={fillColor}\n      getTentativeLineColor={lineColor}\n      {...getDefaultEditableLayerProps(unit)}\n    />\n  );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAsCA,SAAS,qBAAqB,UAA2B;AACvD,QAAO,sBAAsB,IAAI,SAAS;;AAG5C,SAAS,qBAAqB,UAA2B;AACvD,QAAO,sBAAsB,IAAI,SAAS;;;;;;;;;;;;;AAc5C,SAAS,oBACP,SACA,OACqC;CAIrC,IAAIA;AACJ,KAAI,UAAU,iBAAiB,OAC7B,iBAAgB;UACP,UAAU,iBAAiB,UACpC,iBAAgB;AAalB,QAAO;EACL,MAAM;EACN,UAAU,CAZa,gBACrB;GACE,GAAG;GACH,YAAY;IACV,GAAG,QAAQ;IACX,OAAO;IACR;GACF,GACD,QAI0B;EAC7B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyCH,SAAgB,eAAe,EAC7B,KAAK,qBACL,OACA,QACsB;CAEtB,MAAM,YAAY,WAAW,WAAW;CACxC,MAAM,cAAc,SAAS;AAE7B,KAAI,CAAC,YACH,OAAM,IAAI,MACR,iFACD;CAIH,MAAM,EAAE,OAAO,iBAAiB,UAAU,IAAI,YAAY;AAO1D,qBAAoB,aALF,cAAc,gBAAgB,KAKL;CAG3C,MAAM,mBAAmB,OAGf,KAAK;AAGf,iBAAgB;AACd,eAAa;AACX,OAAI,iBAAiB,QACnB,sBAAqB,iBAAiB,QAAQ,MAAM;;IAGvD,EAAE,CAAC;AAGN,KAAI,CAAC,cAAc,aACjB,QAAO;CAGT,MAAM,EAAE,cAAc,UAAU,uBAAuB;CAGvD,MAAM,OAAO,oBAAoB,SAAS;CAI1C,MAAM,OAAO,oBADW,sBAAsB,aAAa,SACT,aAAa,MAAM;CAGrE,MAAM,4BAA4B;AAChC,MAAI,iBAAiB,SAAS;AAC5B,wBAAqB,iBAAiB,QAAQ,MAAM;AACpD,oBAAiB,UAAU;;;CAK/B,MAAM,cAAc,EAClB,aACA,eACmC;EACnC,MAAM,UAAU,YAAY,SAAS;AAGrC,MAAI,qBAAqB,SAAS,IAAI,SAAS;AAC7C,wBAAqB;AAKrB,oBAAiB,UAAU;IAAW;IAAoB,OAJ5C,4BAA4B;AACxC,4BAAuB,aAAa,QAAmB;AACvD,sBAAiB,UAAU;MAC3B;IAC+D;AACjE;;AAIF,MAAI,qBAAqB,SAAS,EAAE;AAClC,wBAAqB;AACrB,OAAI,QACF,wBAAuB,aAAa,QAAmB;AAEzD;;AAIF,MAAI,aAAa,iBAAiB;AAChC,wBAAqB;AACrB,0BAAuB,YAAY;;;CAKvC,MAAM,YAAY,aAAa,aAAa,SAAS,KAAK;CAC1D,MAAM,YAAY,aAAa,aAAa,QAAQ;AAEpD,QACE,oBAAC;EACK;EACE;EACA;EACN,wBAAwB,CAAC,EAAE;EAC3B,QAAQ;EACR,cAAc;EACd,cAAc;EACd,uBAAuB;EACvB,uBAAuB;EACvB,GAAI,6BAA6B,KAAK;GACtC"}

package/dist/deckgl/shapes/edit-shape-layer/modes/base-transform-mode.js

@@ -0,0 +1,154 @@
+/*
+ * Copyright 2025 Hypergiant Galactic Systems Inc. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at https://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */
+
+
+import { filterGeometryAwarePicks } from "../../shared/utils/pick-filtering.js";
+import { CompositeMode } from "@deck.gl-community/editable-layers";
+
+//#region src/deckgl/shapes/edit-shape-layer/modes/base-transform-mode.ts
+/**
+* Abstract base class for composite transform modes.
+*
+* This class extracts the common patterns shared by CircleTransformMode,
+* BoundingTransformMode, and VertexTransformMode:
+*
+* - Active mode tracking during drag operations
+* - Cursor aggregation from child modes
+* - Pick-based mode selection at drag start
+* - Shift key modifier handling for scale/rotate operations
+* - Clean state reset on drag stop
+* - Pick filtering to prevent TypeError from sublayer elements
+*
+* Subclasses define their specific modes and handle matchers, while this
+* base class handles the delegation logic.
+*/
+var BaseTransformMode = class extends CompositeMode {
+	/** Track which mode is currently handling the drag operation */
+	activeDragMode = null;
+	/** Track current Shift state for dynamic modifier behavior */
+	isShiftHeld = false;
+	/** Tooltip for operations that show live measurements */
+	tooltip = null;
+	/**
+	* Aggregates cursor updates from all child modes.
+	* The first non-null cursor from any mode is used.
+	*/
+	handlePointerMove(event, props) {
+		let updatedCursor = null;
+		super.handlePointerMove(event, {
+			...props,
+			onUpdateCursor: (cursor) => {
+				updatedCursor = cursor || updatedCursor;
+			}
+		});
+		props.onUpdateCursor(updatedCursor);
+	}
+	/**
+	* Determines which mode should handle the drag based on picked handles.
+	* Cancels map panning and delegates to the matched mode.
+	*/
+	handleStartDragging(event, props) {
+		if (event.picks.length) event.cancelPan();
+		const picks = event.picks ?? [];
+		const matchers = this.getHandleMatchers();
+		for (const matcher of matchers) if (picks.some(matcher.match)) {
+			this.activeDragMode = matcher.mode;
+			break;
+		}
+		if (!this.activeDragMode) this.activeDragMode = this.getDefaultMode();
+		this.activeDragMode.handleStartDragging(event, props);
+	}
+	/**
+	* Delegates dragging to the active mode with Shift key handling.
+	* Reads Shift state from the source event and applies configured modifiers.
+	*/
+	handleDragging(event, props) {
+		if (!this.activeDragMode) return;
+		this.isShiftHeld = event.sourceEvent?.shiftKey ?? false;
+		const shiftConfig = this.getHandleMatchers().find((m) => m.mode === this.activeDragMode)?.shiftConfig;
+		if (shiftConfig && this.isShiftHeld) {
+			const propsWithConfig = {
+				...props,
+				modeConfig: {
+					...props.modeConfig,
+					[shiftConfig.configKey]: shiftConfig.value ?? true
+				}
+			};
+			this.activeDragMode.handleDragging(event, propsWithConfig);
+		} else this.activeDragMode.handleDragging(event, props);
+		this.onDragging?.(event, props);
+	}
+	/**
+	* Delegates stop dragging to the active mode with final Shift state.
+	* Resets all drag-related state.
+	*/
+	handleStopDragging(event, props) {
+		if (!this.activeDragMode) return;
+		const shiftConfig = this.getHandleMatchers().find((m) => m.mode === this.activeDragMode)?.shiftConfig;
+		if (shiftConfig && this.isShiftHeld) {
+			const propsWithConfig = {
+				...props,
+				modeConfig: {
+					...props.modeConfig,
+					[shiftConfig.configKey]: shiftConfig.value ?? true
+				}
+			};
+			this.activeDragMode.handleStopDragging(event, propsWithConfig);
+		} else this.activeDragMode.handleStopDragging(event, props);
+		this.resetDragState();
+	}
+	/**
+	* Returns tooltips for display during drag operations.
+	* Subclasses update `this.tooltip` in their `onDragging` hook.
+	*/
+	getTooltips() {
+		return this.tooltip ? [this.tooltip] : [];
+	}
+	/**
+	* Filters picks to prevent TypeError from sublayer elements without geometry.
+	*
+	* Some child modes (like ModifyMode, ResizeCircleMode) access
+	* `pick.object.geometry.type` which throws if the pick doesn't have
+	* a geometry property. This happens when picks include sublayer elements
+	* like tooltip text that aren't GeoJSON features.
+	*/
+	getGuides(props) {
+		const picks = props.lastPointerMoveEvent?.picks;
+		if (picks && picks.length > 0) {
+			const { filteredPicks, didFilter } = filterGeometryAwarePicks(picks);
+			if (didFilter) {
+				const filteredProps = {
+					...props,
+					lastPointerMoveEvent: {
+						...props.lastPointerMoveEvent,
+						picks: filteredPicks
+					}
+				};
+				return super.getGuides(filteredProps);
+			}
+		}
+		return super.getGuides(props);
+	}
+	/**
+	* Resets drag-related state. Called after drag stops.
+	* Subclasses can override to reset additional state but should call super.
+	*/
+	resetDragState() {
+		this.activeDragMode = null;
+		this.isShiftHeld = false;
+		this.tooltip = null;
+	}
+};
+
+//#endregion
+export { BaseTransformMode };
+//# sourceMappingURL=base-transform-mode.js.map

package/dist/deckgl/shapes/edit-shape-layer/modes/base-transform-mode.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"base-transform-mode.js","names":["updatedCursor: string | null | undefined","propsWithConfig: ModeProps<FeatureCollection>","filteredProps: ModeProps<FeatureCollection>"],"sources":["../../../../../src/deckgl/shapes/edit-shape-layer/modes/base-transform-mode.ts"],"sourcesContent":["/*\n * Copyright 2026 Hypergiant Galactic Systems Inc. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at https://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {\n  CompositeMode,\n  type DraggingEvent,\n  type FeatureCollection,\n  type GeoJsonEditMode,\n  type GuideFeatureCollection,\n  type ModeProps,\n  type PointerMoveEvent,\n  type StartDraggingEvent,\n  type StopDraggingEvent,\n  type Tooltip,\n} from '@deck.gl-community/editable-layers';\nimport { filterGeometryAwarePicks } from '../../shared/utils/pick-filtering';\n\n/**\n * Configuration for how a mode handles the Shift key modifier.\n */\nexport type ShiftKeyConfig = {\n  /** The modeConfig property name to set (e.g., 'lockScaling', 'snapRotation') */\n  configKey: string;\n  /** The value to set when Shift is held (defaults to true) */\n  value?: boolean;\n};\n\n/**\n * Definition for how to detect and handle a specific edit handle type.\n */\nexport type HandleMatcher = {\n  /** Function to determine if a pick matches this handle type */\n  match: (pick: {\n    isGuide?: boolean;\n    object?: {\n      properties?: {\n        guideType?: string;\n        editHandleType?: string;\n        mode?: string;\n      };\n    };\n  }) => boolean;\n  /** The mode instance to delegate to when this handle is matched */\n  mode: GeoJsonEditMode;\n  /** Optional Shift key configuration for this mode */\n  shiftConfig?: ShiftKeyConfig;\n};\n\n/**\n * Abstract base class for composite transform modes.\n *\n * This class extracts the common patterns shared by CircleTransformMode,\n * BoundingTransformMode, and VertexTransformMode:\n *\n * - Active mode tracking during drag operations\n * - Cursor aggregation from child modes\n * - Pick-based mode selection at drag start\n * - Shift key modifier handling for scale/rotate operations\n * - Clean state reset on drag stop\n * - Pick filtering to prevent TypeError from sublayer elements\n *\n * Subclasses define their specific modes and handle matchers, while this\n * base class handles the delegation logic.\n */\nexport abstract class BaseTransformMode extends CompositeMode {\n  /** Track which mode is currently handling the drag operation */\n  protected activeDragMode: GeoJsonEditMode | null = null;\n\n  /** Track current Shift state for dynamic modifier behavior */\n  protected isShiftHeld = false;\n\n  /** Tooltip for operations that show live measurements */\n  protected tooltip: Tooltip | null = null;\n\n  /**\n   * Get the handle matchers that define how picks map to modes.\n   * Matchers are evaluated in order; first match wins.\n   * The last matcher should typically be a catch-all for the default mode.\n   */\n  protected abstract getHandleMatchers(): HandleMatcher[];\n\n  /**\n   * Get the default mode to use when no handle matchers match.\n   * This is typically TranslateMode for dragging the shape body.\n   */\n  protected abstract getDefaultMode(): GeoJsonEditMode;\n\n  /**\n   * Optional hook called during drag when the active mode is set.\n   * Subclasses can override to update tooltips or perform other side effects.\n   */\n  protected onDragging?(\n    event: DraggingEvent,\n    props: ModeProps<FeatureCollection>,\n  ): void;\n\n  /**\n   * Aggregates cursor updates from all child modes.\n   * The first non-null cursor from any mode is used.\n   */\n  override handlePointerMove(\n    event: PointerMoveEvent,\n    props: ModeProps<FeatureCollection>,\n  ) {\n    let updatedCursor: string | null | undefined = null;\n\n    super.handlePointerMove(event, {\n      ...props,\n      onUpdateCursor: (cursor: string | null | undefined) => {\n        updatedCursor = cursor || updatedCursor;\n      },\n    });\n\n    props.onUpdateCursor(updatedCursor);\n  }\n\n  /**\n   * Determines which mode should handle the drag based on picked handles.\n   * Cancels map panning and delegates to the matched mode.\n   */\n  override handleStartDragging(\n    event: StartDraggingEvent,\n    props: ModeProps<FeatureCollection>,\n  ) {\n    if (event.picks.length) {\n      event.cancelPan();\n    }\n\n    const picks = event.picks ?? [];\n    const matchers = this.getHandleMatchers();\n\n    // Find the first matcher that matches any pick\n    for (const matcher of matchers) {\n      if (picks.some(matcher.match)) {\n        this.activeDragMode = matcher.mode;\n        break;\n      }\n    }\n\n    // Fall back to default mode if no matcher matched\n    if (!this.activeDragMode) {\n      this.activeDragMode = this.getDefaultMode();\n    }\n\n    this.activeDragMode.handleStartDragging(event, props);\n  }\n\n  /**\n   * Delegates dragging to the active mode with Shift key handling.\n   * Reads Shift state from the source event and applies configured modifiers.\n   */\n  override handleDragging(\n    event: DraggingEvent,\n    props: ModeProps<FeatureCollection>,\n  ) {\n    if (!this.activeDragMode) {\n      return;\n    }\n\n    const sourceEvent = event.sourceEvent as KeyboardEvent | undefined;\n    this.isShiftHeld = sourceEvent?.shiftKey ?? false;\n\n    // Find the matcher for the active mode to get shift config\n    const matchers = this.getHandleMatchers();\n    const activeMatcher = matchers.find((m) => m.mode === this.activeDragMode);\n    const shiftConfig = activeMatcher?.shiftConfig;\n\n    // Apply shift key modifier if configured\n    if (shiftConfig && this.isShiftHeld) {\n      const propsWithConfig: ModeProps<FeatureCollection> = {\n        ...props,\n        modeConfig: {\n          ...props.modeConfig,\n          [shiftConfig.configKey]: shiftConfig.value ?? true,\n        },\n      };\n      this.activeDragMode.handleDragging(event, propsWithConfig);\n    } else {\n      this.activeDragMode.handleDragging(event, props);\n    }\n\n    // Call subclass hook for tooltips or other side effects\n    this.onDragging?.(event, props);\n  }\n\n  /**\n   * Delegates stop dragging to the active mode with final Shift state.\n   * Resets all drag-related state.\n   */\n  override handleStopDragging(\n    event: StopDraggingEvent,\n    props: ModeProps<FeatureCollection>,\n  ) {\n    if (!this.activeDragMode) {\n      return;\n    }\n\n    // Find the matcher for the active mode to get shift config\n    const matchers = this.getHandleMatchers();\n    const activeMatcher = matchers.find((m) => m.mode === this.activeDragMode);\n    const shiftConfig = activeMatcher?.shiftConfig;\n\n    // Apply shift key modifier if configured (use last known state)\n    if (shiftConfig && this.isShiftHeld) {\n      const propsWithConfig: ModeProps<FeatureCollection> = {\n        ...props,\n        modeConfig: {\n          ...props.modeConfig,\n          [shiftConfig.configKey]: shiftConfig.value ?? true,\n        },\n      };\n      this.activeDragMode.handleStopDragging(event, propsWithConfig);\n    } else {\n      this.activeDragMode.handleStopDragging(event, props);\n    }\n\n    this.resetDragState();\n  }\n\n  /**\n   * Returns tooltips for display during drag operations.\n   * Subclasses update `this.tooltip` in their `onDragging` hook.\n   */\n  override getTooltips(): Tooltip[] {\n    return this.tooltip ? [this.tooltip] : [];\n  }\n\n  /**\n   * Filters picks to prevent TypeError from sublayer elements without geometry.\n   *\n   * Some child modes (like ModifyMode, ResizeCircleMode) access\n   * `pick.object.geometry.type` which throws if the pick doesn't have\n   * a geometry property. This happens when picks include sublayer elements\n   * like tooltip text that aren't GeoJSON features.\n   */\n  override getGuides(\n    props: ModeProps<FeatureCollection>,\n  ): GuideFeatureCollection {\n    const picks = props.lastPointerMoveEvent?.picks;\n\n    if (picks && picks.length > 0) {\n      const { filteredPicks, didFilter } = filterGeometryAwarePicks(picks);\n\n      if (didFilter) {\n        const filteredProps: ModeProps<FeatureCollection> = {\n          ...props,\n          lastPointerMoveEvent: {\n            ...props.lastPointerMoveEvent,\n            picks: filteredPicks,\n          },\n        };\n        return super.getGuides(filteredProps);\n      }\n    }\n\n    return super.getGuides(props);\n  }\n\n  /**\n   * Resets drag-related state. Called after drag stops.\n   * Subclasses can override to reset additional state but should call super.\n   */\n  protected resetDragState(): void {\n    this.activeDragMode = null;\n    this.isShiftHeld = false;\n    this.tooltip = null;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAyEA,IAAsB,oBAAtB,cAAgD,cAAc;;CAE5D,AAAU,iBAAyC;;CAGnD,AAAU,cAAc;;CAGxB,AAAU,UAA0B;;;;;CA4BpC,AAAS,kBACP,OACA,OACA;EACA,IAAIA,gBAA2C;AAE/C,QAAM,kBAAkB,OAAO;GAC7B,GAAG;GACH,iBAAiB,WAAsC;AACrD,oBAAgB,UAAU;;GAE7B,CAAC;AAEF,QAAM,eAAe,cAAc;;;;;;CAOrC,AAAS,oBACP,OACA,OACA;AACA,MAAI,MAAM,MAAM,OACd,OAAM,WAAW;EAGnB,MAAM,QAAQ,MAAM,SAAS,EAAE;EAC/B,MAAM,WAAW,KAAK,mBAAmB;AAGzC,OAAK,MAAM,WAAW,SACpB,KAAI,MAAM,KAAK,QAAQ,MAAM,EAAE;AAC7B,QAAK,iBAAiB,QAAQ;AAC9B;;AAKJ,MAAI,CAAC,KAAK,eACR,MAAK,iBAAiB,KAAK,gBAAgB;AAG7C,OAAK,eAAe,oBAAoB,OAAO,MAAM;;;;;;CAOvD,AAAS,eACP,OACA,OACA;AACA,MAAI,CAAC,KAAK,eACR;AAIF,OAAK,cADe,MAAM,aACM,YAAY;EAK5C,MAAM,cAFW,KAAK,mBAAmB,CACV,MAAM,MAAM,EAAE,SAAS,KAAK,eAAe,EACvC;AAGnC,MAAI,eAAe,KAAK,aAAa;GACnC,MAAMC,kBAAgD;IACpD,GAAG;IACH,YAAY;KACV,GAAG,MAAM;MACR,YAAY,YAAY,YAAY,SAAS;KAC/C;IACF;AACD,QAAK,eAAe,eAAe,OAAO,gBAAgB;QAE1D,MAAK,eAAe,eAAe,OAAO,MAAM;AAIlD,OAAK,aAAa,OAAO,MAAM;;;;;;CAOjC,AAAS,mBACP,OACA,OACA;AACA,MAAI,CAAC,KAAK,eACR;EAMF,MAAM,cAFW,KAAK,mBAAmB,CACV,MAAM,MAAM,EAAE,SAAS,KAAK,eAAe,EACvC;AAGnC,MAAI,eAAe,KAAK,aAAa;GACnC,MAAMA,kBAAgD;IACpD,GAAG;IACH,YAAY;KACV,GAAG,MAAM;MACR,YAAY,YAAY,YAAY,SAAS;KAC/C;IACF;AACD,QAAK,eAAe,mBAAmB,OAAO,gBAAgB;QAE9D,MAAK,eAAe,mBAAmB,OAAO,MAAM;AAGtD,OAAK,gBAAgB;;;;;;CAOvB,AAAS,cAAyB;AAChC,SAAO,KAAK,UAAU,CAAC,KAAK,QAAQ,GAAG,EAAE;;;;;;;;;;CAW3C,AAAS,UACP,OACwB;EACxB,MAAM,QAAQ,MAAM,sBAAsB;AAE1C,MAAI,SAAS,MAAM,SAAS,GAAG;GAC7B,MAAM,EAAE,eAAe,cAAc,yBAAyB,MAAM;AAEpE,OAAI,WAAW;IACb,MAAMC,gBAA8C;KAClD,GAAG;KACH,sBAAsB;MACpB,GAAG,MAAM;MACT,OAAO;MACR;KACF;AACD,WAAO,MAAM,UAAU,cAAc;;;AAIzC,SAAO,MAAM,UAAU,MAAM;;;;;;CAO/B,AAAU,iBAAuB;AAC/B,OAAK,iBAAiB;AACtB,OAAK,cAAc;AACnB,OAAK,UAAU"}