my-openlayer 2.4.12 → 2.5.1

package/core/polygon/PolygonMaskLayer.d.ts

@@ -0,0 +1,20 @@
+import Feature from "ol/Feature";
+import { Geometry } from "ol/geom";
+import Map from "ol/Map";
+import VectorLayer from "ol/layer/Vector";
+import VectorSource from "ol/source/Vector";
+import type { MapJSONData, MaskLayerOptions } from "../../types";
+/**
+ * 面遮罩图层辅助类。
+ */
+export default class PolygonMaskLayer {
+    static setOutLayer(map: Map, data: MapJSONData, options?: {
+        layerName?: string;
+        extent?: any;
+        fillColor?: string;
+        strokeWidth?: number;
+        strokeColor?: string;
+        zIndex?: number;
+    }): VectorLayer<VectorSource<Feature<Geometry>>, Feature<Geometry>>;
+    static addMaskLayer(map: Map, data: any, options?: MaskLayerOptions): VectorLayer<VectorSource>;
+}

package/core/polygon/PolygonMaskLayer.js

@@ -0,0 +1,107 @@
+import Feature from "ol/Feature";
+import GeoJSON from "ol/format/GeoJSON";
+import { LinearRing } from "ol/geom";
+import VectorLayer from "ol/layer/Vector";
+import VectorSource from "ol/source/Vector";
+import { Fill, Stroke, Style } from "ol/style";
+import { fromExtent } from "ol/geom/Polygon";
+import { ErrorHandler } from "../../utils/ErrorHandler";
+import ValidationUtils from "../../utils/ValidationUtils";
+import { ConfigManager } from "../map";
+/**
+ * 面遮罩图层辅助类。
+ */
+export default class PolygonMaskLayer {
+    static setOutLayer(map, data, options) {
+        function getCoordsGroup(geom) {
+            let group = [];
+            const geomType = geom.getType();
+            if (geomType === 'LineString') {
+                group.push(geom.getCoordinates());
+            }
+            else if (geomType === 'MultiLineString' || geomType === 'Polygon') {
+                group = geom.getCoordinates();
+            }
+            else if (geomType === 'MultiPolygon') {
+                geom.getPolygons().forEach((poly) => {
+                    group = group.concat(poly.getCoordinates());
+                });
+            }
+            else {
+                ErrorHandler.getInstance().warn('暂时不支持的类型');
+            }
+            return group;
+        }
+        function erase(geometries, view) {
+            let allParts = [];
+            geometries.forEach(geom => {
+                const parts = getCoordsGroup(geom);
+                if (parts && parts.length > 0) {
+                    allParts = allParts.concat(parts);
+                }
+            });
+            if (allParts.length === 0) {
+                return null;
+            }
+            const extent = view.getProjection().getExtent();
+            const polygonRing = fromExtent(extent);
+            allParts.forEach(item => {
+                polygonRing.appendLinearRing(new LinearRing(item));
+            });
+            return polygonRing;
+        }
+        const shadeStyle = new Style({
+            fill: new Fill({ color: options?.fillColor ?? 'rgba(0,27,59,0.8)' }),
+            stroke: new Stroke({
+                width: options?.strokeWidth ?? 1,
+                color: options?.strokeColor ?? 'rgba(0,27,59,0.8)'
+            })
+        });
+        const vtSource = new VectorSource();
+        const vtLayer = new VectorLayer({
+            source: vtSource,
+            style: shadeStyle,
+            zIndex: options?.zIndex ?? 12
+        });
+        vtLayer.set('layerName', options?.layerName ?? 'outLayer');
+        const features = new GeoJSON().readFeatures(data);
+        const geometries = [];
+        features.forEach(feature => {
+            const geometry = feature.getGeometry();
+            if (geometry) {
+                geometries.push(geometry);
+            }
+        });
+        if (geometries.length > 0) {
+            const polygon = erase(geometries, map.getView());
+            if (polygon) {
+                vtSource.addFeature(new Feature({ geometry: polygon }));
+            }
+        }
+        map.addLayer(vtLayer);
+        return vtLayer;
+    }
+    static addMaskLayer(map, data, options) {
+        ValidationUtils.validateMaskData(data);
+        const mergedOptions = {
+            ...ConfigManager.DEFAULT_MASK_OPTIONS,
+            ...options
+        };
+        const features = new GeoJSON().readFeatures(data);
+        const maskLayer = new VectorLayer({
+            source: new VectorSource({ features }),
+            style: new Style({
+                fill: new Fill({ color: mergedOptions.fillColor }),
+                stroke: mergedOptions.strokeColor ? new Stroke({
+                    color: mergedOptions.strokeColor,
+                    width: mergedOptions.strokeWidth || 1
+                }) : undefined
+            }),
+            opacity: mergedOptions.opacity,
+            visible: mergedOptions.visible
+        });
+        maskLayer.set('layerName', mergedOptions.layerName);
+        map.addLayer(maskLayer);
+        return maskLayer;
+    }
+}

package/core/polygon/PolygonStyleFactory.d.ts

@@ -0,0 +1,12 @@
+import Feature from "ol/Feature";
+import type { FeatureColorUpdateOptions, PolygonOptions } from "../../types";
+/**
+ * 面图层样式工厂。
+ */
+export default class PolygonStyleFactory {
+    static getFeatureText(feature: Feature, options: PolygonOptions | FeatureColorUpdateOptions): string;
+    static createStyle(options: PolygonOptions): any;
+    static updateSingleFeatureColor(feature: Feature, colorObj?: {
+        [propName: string]: string;
+    }, options?: FeatureColorUpdateOptions): void;
+}

package/core/polygon/PolygonStyleFactory.js

@@ -0,0 +1,100 @@
+import { Fill, Stroke, Style, Text } from "ol/style";
+/**
+ * 面图层样式工厂。
+ */
+export default class PolygonStyleFactory {
+    static getFeatureText(feature, options) {
+        if (options.textCallBack) {
+            return options.textCallBack(feature) || '';
+        }
+        if (options.textKey) {
+            return feature.get(options.textKey) || '';
+        }
+        return '';
+    }
+    static createStyle(options) {
+        if (options.style) {
+            return options.style;
+        }
+        const withDefaultStroke = options.withDefaultStroke ?? true;
+        const withDefaultFill = options.withDefaultFill ?? true;
+        const strokeColor = options.strokeColor ?? (withDefaultStroke ? '#EBEEF5' : undefined);
+        const strokeWidth = options.strokeWidth ?? 2;
+        const staticFillColor = options.fillColor ?? (withDefaultFill ? 'rgba(255, 255, 255, 0)' : undefined);
+        const stroke = strokeColor ? new Stroke({
+            color: strokeColor,
+            width: strokeWidth,
+            lineDash: options.lineDash,
+            lineDashOffset: options.lineDashOffset
+        }) : undefined;
+        let baseStyle;
+        if (!options.fillColorCallBack) {
+            const fill = staticFillColor ? new Fill({ color: staticFillColor }) : undefined;
+            if (stroke || fill) {
+                baseStyle = new Style({ stroke, fill });
+            }
+        }
+        if (baseStyle && !options.textVisible) {
+            return baseStyle;
+        }
+        return (feature) => {
+            const styles = [];
+            if (baseStyle) {
+                styles.push(baseStyle);
+            }
+            else {
+                const fillColor = options.fillColorCallBack ? options.fillColorCallBack(feature) : staticFillColor;
+                const fill = fillColor ? new Fill({ color: fillColor }) : undefined;
+                if (stroke || fill) {
+                    styles.push(new Style({ stroke, fill }));
+                }
+            }
+            if (options.textVisible) {
+                const text = PolygonStyleFactory.getFeatureText(feature, options);
+                if (text) {
+                    styles.push(new Style({
+                        text: new Text({
+                            text,
+                            font: options.textFont,
+                            fill: new Fill({ color: options.textFillColor }),
+                            stroke: new Stroke({
+                                color: options.textStrokeColor,
+                                width: options.textStrokeWidth
+                            })
+                        })
+                    }));
+                }
+            }
+            return styles;
+        };
+    }
+    static updateSingleFeatureColor(feature, colorObj, options) {
+        const name = options?.textKey ? feature.get(options.textKey) : '';
+        const withDefaultStroke = options?.withDefaultStroke ?? true;
+        const withDefaultFill = options?.withDefaultFill ?? true;
+        const strokeColor = options?.strokeColor ?? (withDefaultStroke ? '#EBEEF5' : undefined);
+        const strokeWidth = options?.strokeWidth ?? 2;
+        const defaultFillColor = 'rgba(255, 255, 255, 0.3)';
+        const resolvedFillColor = options?.fillColor ?? (withDefaultFill ? defaultFillColor : undefined);
+        const newColor = colorObj?.[name] || resolvedFillColor;
+        const featureStyle = new Style({
+            stroke: strokeColor ? new Stroke({ color: strokeColor, width: strokeWidth }) : undefined,
+            fill: newColor ? new Fill({ color: newColor }) : undefined
+        });
+        if (options?.textVisible) {
+            const text = PolygonStyleFactory.getFeatureText(feature, options);
+            if (text) {
+                featureStyle.setText(new Text({
+                    text,
+                    font: options.textFont,
+                    fill: new Fill({ color: options.textFillColor }),
+                    stroke: new Stroke({
+                        color: options.textStrokeColor,
+                        width: options.textStrokeWidth
+                    })
+                }));
+            }
+        }
+        feature.setStyle(featureStyle);
+    }
+}

package/core/polygon/index.d.ts

@@ -0,0 +1,5 @@
+export { default as Polygon } from './Polygon';
+export { default as PolygonStyleFactory } from './PolygonStyleFactory';
+export { default as PolygonMaskLayer } from './PolygonMaskLayer';
+export { default as PolygonImageLayer } from './PolygonImageLayer';
+export { default as PolygonHeatmapLayer } from './PolygonHeatmapLayer';

package/core/polygon/index.js

@@ -0,0 +1,5 @@
+export { default as Polygon } from './Polygon';
+export { default as PolygonStyleFactory } from './PolygonStyleFactory';
+export { default as PolygonMaskLayer } from './PolygonMaskLayer';
+export { default as PolygonImageLayer } from './PolygonImageLayer';
+export { default as PolygonHeatmapLayer } from './PolygonHeatmapLayer';

package/core/{SelectHandler.d.ts → select/SelectHandler.d.ts}

@@ -1,7 +1,6 @@
 import OlMap from "ol/Map";
 import { FeatureLike } from "ol/Feature";
-import { Style } from "ol/style";
-import { SelectOptions, SelectMode, ProgrammaticSelectOptions } from "../types";
+import { SelectOptions, SelectMode, ProgrammaticSelectOptions } from "../../types";
 /**
  * 要素选择处理器类
  * 用于在地图上选择和高亮显示要素，支持单选、多选等多种选择模式
@@ -79,7 +78,7 @@ export default class SelectHandler {
     private ensureMainInteraction;
     isSelectEnabled(): boolean;
     getCurrentMode(): SelectMode | undefined;
-    updateSelectStyle(selectStyle: Style | Style[] | ((feature: FeatureLike, resolution: number) => Style | Style[])): this;
+    updateSelectStyle(selectStyle: SelectOptions['selectStyle']): this;
     private fitToFeatures;
     destroy(): void;
     private getSelectCondition;

package/core/{SelectHandler.js → select/SelectHandler.js}

@@ -5,9 +5,9 @@ import VectorLayer from "ol/layer/Vector";
 import { Style, Fill, Stroke, Circle as CircleStyle } from "ol/style";
 import Collection from 'ol/Collection';
 import { getUid } from "ol/util";
-import { EventManager } from "./EventManager";
-import { ValidationUtils } from "../utils/ValidationUtils";
-import { ErrorHandler, MyOpenLayersError, ErrorType } from "../utils/ErrorHandler";
+import EventManager from "../map/EventManager";
+import ValidationUtils from "../../utils/ValidationUtils";
+import { ErrorHandler, MyOpenLayersError, ErrorType } from "../../utils/ErrorHandler";
 /**
  * 要素选择处理器类
  * 用于在地图上选择和高亮显示要素，支持单选、多选等多种选择模式
@@ -370,7 +370,7 @@ export default class SelectHandler {
         const styleSource = this.currentSelectStyle;
         if (styleSource) {
             if (typeof styleSource === 'function') {
-                return styleSource(feature, resolution);
+                return styleSource(feature);
             }
             return styleSource;
         }

package/core/select/index.d.ts

@@ -0,0 +1 @@
+export { default as SelectHandler } from './SelectHandler';

package/core/select/index.js

@@ -0,0 +1 @@
+export { default as SelectHandler } from './SelectHandler';

package/core/{VueTemplatePoint.d.ts → vue-template-point/VueTemplatePoint.d.ts}

@@ -1,5 +1,5 @@
 import { Map as OLMap } from 'ol';
-import { VueTemplatePointInstance } from '../types';
+import { VueTemplatePointInstance } from '../../types';
 /**
  * Vue模板点位管理类
  * 用于在地图上添加和管理Vue组件覆盖物

package/core/{VueTemplatePoint.js → vue-template-point/VueTemplatePoint.js}

@@ -1,8 +1,8 @@
 import Overlay from 'ol/Overlay';
-import { VueTemplatePointState } from '../types';
-import { ErrorHandler, ErrorType } from '../utils/ErrorHandler';
-import { ValidationUtils } from '../utils/ValidationUtils';
-import { ConfigManager } from './ConfigManager';
+import { VueTemplatePointState } from '../../types';
+import { ErrorHandler, ErrorType } from '../../utils/ErrorHandler';
+import ValidationUtils from '../../utils/ValidationUtils';
+import { ConfigManager } from '../map';
 // 动态导入Vue
 let Vue = null;
 let isVue3 = false;

package/core/vue-template-point/index.d.ts

@@ -0,0 +1 @@
+export { default as VueTemplatePoint } from './VueTemplatePoint';

package/core/vue-template-point/index.js

@@ -0,0 +1 @@
+export { default as VueTemplatePoint } from './VueTemplatePoint';

package/docs/.vitepress/config.mts

@@ -1,57 +1,57 @@
-import { defineConfig } from 'vitepress'
-
-export default defineConfig({
-  base: '/my-openlayer/',
-  title: "MyOpenLayer",
-  description: "基于 OpenLayers 的现代地图组件库",
-  lang: 'zh-CN',
-  themeConfig: {
-    nav: [
-      { text: '首页', link: '/' },
-      { text: '指南', link: '/MyOl' },
-      { text: 'API', link: '/MyOl' },
-      { text: 'GitHub', link: 'https://github.com/cuteyuchen/my-openlayer' }
-    ],
-
-    sidebar: [
-      {
-        text: '核心类库',
-        items: [
-          { text: 'MyOl 地图入口', link: '/MyOl' },
-          { text: 'MapBaseLayers 底图管理', link: '/MapBaseLayers' },
-          { text: 'ConfigManager 配置管理', link: '/ConfigManager' },
-          { text: 'EventManager 事件管理', link: '/EventManager' },
-          { text: 'ErrorHandler 错误处理', link: '/ErrorHandler' }
-        ]
-      },
-      {
-        text: '要素操作',
-        items: [
-          { text: 'Point 点要素', link: '/Point' },
-          { text: 'Line 线要素', link: '/Line' },
-          { text: 'Polygon 面要素', link: '/Polygon' },
-          { text: 'VueTemplatePoint Vue点位', link: '/VueTemplatePoint' },
-          { text: 'RiverLayerManager 河流图层', link: '/RiverLayerManager' }
-        ]
-      },
-      {
-        text: '交互与工具',
-        items: [
-          { text: 'SelectHandler 要素选择', link: '/SelectHandler' },
-          { text: 'MeasureHandler 测量工具', link: '/MeasureHandler' },
-          { text: 'MapTools 地图工具', link: '/MapTools' },
-          { text: 'ValidationUtils 验证工具', link: '/ValidationUtils' }
-        ]
-      }
-    ],
-
-    socialLinks: [
-      { icon: 'github', link: 'https://github.com/cuteyuchen/my-openlayer' }
-    ],
-
-    footer: {
-      message: 'Released under the MIT License.',
-      copyright: 'Copyright © 2024-present'
-    }
-  }
-})
+import { defineConfig } from 'vitepress'
+
+export default defineConfig({
+  base: '/my-openlayer/',
+  title: "MyOpenLayer",
+  description: "基于 OpenLayers 的现代地图组件库",
+  lang: 'zh-CN',
+  themeConfig: {
+    nav: [
+      { text: '首页', link: '/' },
+      { text: '指南', link: '/MyOl' },
+      { text: 'API', link: '/MyOl' },
+      { text: 'GitHub', link: 'https://github.com/cuteyuchen/my-openlayer' }
+    ],
+
+    sidebar: [
+      {
+        text: '核心类库',
+        items: [
+          { text: 'MyOl 地图入口', link: '/MyOl' },
+          { text: 'MapBaseLayers 底图管理', link: '/MapBaseLayers' },
+          { text: 'ConfigManager 配置管理', link: '/ConfigManager' },
+          { text: 'EventManager 事件管理', link: '/EventManager' },
+          { text: 'ErrorHandler 错误处理', link: '/ErrorHandler' }
+        ]
+      },
+      {
+        text: '要素操作',
+        items: [
+          { text: 'Point 点要素', link: '/Point' },
+          { text: 'Line 线要素', link: '/Line' },
+          { text: 'Polygon 面要素', link: '/Polygon' },
+          { text: 'VueTemplatePoint Vue点位', link: '/VueTemplatePoint' },
+          { text: 'RiverLayerManager 河流图层', link: '/RiverLayerManager' }
+        ]
+      },
+      {
+        text: '交互与工具',
+        items: [
+          { text: 'SelectHandler 要素选择', link: '/SelectHandler' },
+          { text: 'MeasureHandler 测量工具', link: '/MeasureHandler' },
+          { text: 'MapTools 地图工具', link: '/MapTools' },
+          { text: 'ValidationUtils 验证工具', link: '/ValidationUtils' }
+        ]
+      }
+    ],
+
+    socialLinks: [
+      { icon: 'github', link: 'https://github.com/cuteyuchen/my-openlayer' }
+    ],
+
+    footer: {
+      message: 'Released under the MIT License.',
+      copyright: 'Copyright © 2024-present'
+    }
+  }
+})

package/docs/ConfigManager.md

@@ -1,71 +1,71 @@
-# ConfigManager 配置管理
-
-`ConfigManager` 类用于统一管理地图组件的默认配置和常量。它提供了一系列静态只读属性，确保整个应用中使用一致的配置默认值。
-
-## 导入
-
-```typescript
-import { ConfigManager } from 'my-openlayer';
-```
-
-## 静态属性
-
-`ConfigManager` 包含以下类别的默认配置：
-
-### 点位配置 (Point Options)
-
-| 属性名 | 类型 | 描述 | 默认值 |
-| :--- | :--- | :--- | :--- |
-| `DEFAULT_POINT_OPTIONS` | `object` | 默认点位基础配置 | `{ visible: true, zIndex: 21 }` |
-| `DEFAULT_POINT_TEXT_OPTIONS` | `object` | 默认点位文本配置 | `{ textFont: '12px Calibri,sans-serif', textFillColor: '#FFF', textStrokeColor: '#000', textStrokeWidth: 3, textOffsetY: 20 }` |
-| `DEFAULT_POINT_ICON_SCALE` | `number` | 默认图标缩放比例 | `1` |
-| `DEFAULT_CLUSTER_OPTIONS` | `object` | 默认聚合配置 | `{ distance: 40, minDistance: 0, zIndex: 21 }` |
-| `DEFAULT_DOM_POINT_OVERLAY_OPTIONS` | `object` | 默认 DOM 点覆盖物配置 | `{ positioning: 'center-center', stopEvent: false }` |
-
-### 线配置 (Line Options)
-
-| 属性名 | 类型 | 描述 | 默认值 |
-| :--- | :--- | :--- | :--- |
-| `DEFAULT_LINE_OPTIONS` | `object` | 默认线样式配置 | `{ type: 'line', strokeColor: 'rgba(3, 122, 255, 1)', strokeWidth: 2, visible: true, layerName: 'lineLayer', zIndex: 15 }` |
-
-### 面配置 (Polygon Options)
-
-| 属性名 | 类型 | 描述 | 默认值 |
-| :--- | :--- | :--- | :--- |
-| `DEFAULT_POLYGON_OPTIONS` | `object` | 默认面样式配置 | `{ zIndex: 11, visible: true, textFont: '14px Calibri,sans-serif', textFillColor: '#FFF', textStrokeColor: '#409EFF', textStrokeWidth: 2 }` |
-| `DEFAULT_POLYGON_COLOR_MAP` | `object` | 默认面颜色映射 (用于分级渲染) | `{ '0': 'rgba(255, 0, 0, 0.6)', '1': 'rgba(245, 154, 35, 0.6)', ... }` |
-
-## 使用示例
-
-### 获取默认配置
-
-```typescript
-import { ConfigManager } from 'my-openlayer';
-
-// 获取默认点位配置
-const pointOptions = {
-  ...ConfigManager.DEFAULT_POINT_OPTIONS,
-  ...ConfigManager.DEFAULT_POINT_TEXT_OPTIONS
-};
-
-// 获取默认线配置
-const lineOptions = ConfigManager.DEFAULT_LINE_OPTIONS;
-```
-
-### 在自定义组件中使用
-
-```typescript
-import { ConfigManager } from 'my-openlayer';
-
-class MyComponent {
-  private options: any;
-
-  constructor(options: any) {
-    // 合并用户配置和默认配置
-    this.options = {
-      ...ConfigManager.DEFAULT_POINT_OPTIONS,
-      ...options
-    };
-  }
-}
-```
+# ConfigManager 配置管理
+
+`ConfigManager` 类用于统一管理地图组件的默认配置和常量。它提供了一系列静态只读属性，确保整个应用中使用一致的配置默认值。
+
+## 导入
+
+```typescript
+import { ConfigManager } from 'my-openlayer';
+```
+
+## 静态属性
+
+`ConfigManager` 包含以下类别的默认配置：
+
+### 点位配置 (Point Options)
+
+| 属性名 | 类型 | 描述 | 默认值 |
+| :--- | :--- | :--- | :--- |
+| `DEFAULT_POINT_OPTIONS` | `object` | 默认点位基础配置 | `{ visible: true, zIndex: 21 }` |
+| `DEFAULT_POINT_TEXT_OPTIONS` | `object` | 默认点位文本配置 | `{ textFont: '12px Calibri,sans-serif', textFillColor: '#FFF', textStrokeColor: '#000', textStrokeWidth: 3, textOffsetY: 20 }` |
+| `DEFAULT_POINT_ICON_SCALE` | `number` | 默认图标缩放比例 | `1` |
+| `DEFAULT_CLUSTER_OPTIONS` | `object` | 默认聚合配置 | `{ distance: 40, minDistance: 0, zIndex: 21 }` |
+| `DEFAULT_DOM_POINT_OVERLAY_OPTIONS` | `object` | 默认 DOM 点覆盖物配置 | `{ positioning: 'center-center', stopEvent: false }` |
+
+### 线配置 (Line Options)
+
+| 属性名 | 类型 | 描述 | 默认值 |
+| :--- | :--- | :--- | :--- |
+| `DEFAULT_LINE_OPTIONS` | `object` | 默认线样式配置 | `{ type: 'line', strokeColor: 'rgba(3, 122, 255, 1)', strokeWidth: 2, visible: true, layerName: 'lineLayer', zIndex: 15 }` |
+
+### 面配置 (Polygon Options)
+
+| 属性名 | 类型 | 描述 | 默认值 |
+| :--- | :--- | :--- | :--- |
+| `DEFAULT_POLYGON_OPTIONS` | `object` | 默认面样式配置 | `{ zIndex: 11, visible: true, textFont: '14px Calibri,sans-serif', textFillColor: '#FFF', textStrokeColor: '#409EFF', textStrokeWidth: 2 }` |
+| `DEFAULT_POLYGON_COLOR_MAP` | `object` | 默认面颜色映射 (用于分级渲染) | `{ '0': 'rgba(255, 0, 0, 0.6)', '1': 'rgba(245, 154, 35, 0.6)', ... }` |
+
+## 使用示例
+
+### 获取默认配置
+
+```typescript
+import { ConfigManager } from 'my-openlayer';
+
+// 获取默认点位配置
+const pointOptions = {
+  ...ConfigManager.DEFAULT_POINT_OPTIONS,
+  ...ConfigManager.DEFAULT_POINT_TEXT_OPTIONS
+};
+
+// 获取默认线配置
+const lineOptions = ConfigManager.DEFAULT_LINE_OPTIONS;
+```
+
+### 在自定义组件中使用
+
+```typescript
+import { ConfigManager } from 'my-openlayer';
+
+class MyComponent {
+  private options: any;
+
+  constructor(options: any) {
+    // 合并用户配置和默认配置
+    this.options = {
+      ...ConfigManager.DEFAULT_POINT_OPTIONS,
+      ...options
+    };
+  }
+}
+```