@chocozhang/three-model-render 1.0.1

package/dist/interaction/index.js

@@ -0,0 +1,661 @@
+'use strict';
+
+var THREE = require('three');
+var BufferGeometryUtils = require('three/examples/jsm/utils/BufferGeometryUtils.js');
+
+function _interopNamespaceDefault(e) {
+    var n = Object.create(null);
+    if (e) {
+        Object.keys(e).forEach(function (k) {
+            if (k !== 'default') {
+                var d = Object.getOwnPropertyDescriptor(e, k);
+                Object.defineProperty(n, k, d.get ? d : {
+                    enumerable: true,
+                    get: function () { return e[k]; }
+                });
+            }
+        });
+    }
+    n.default = e;
+    return Object.freeze(n);
+}
+
+var THREE__namespace = /*#__PURE__*/_interopNamespaceDefault(THREE);
+var BufferGeometryUtils__namespace = /*#__PURE__*/_interopNamespaceDefault(BufferGeometryUtils);
+
+/**
+ * 创建模型点击高亮工具（OutlinePass 版）- 优化版
+ *
+ * ✨ 功能增强：
+ * - 使用 AbortController 统一管理事件生命周期
+ * - 支持防抖处理避免频繁触发
+ * - 可自定义 Raycaster 参数
+ * - 根据相机距离动态调整描边厚度
+ *
+ * @param camera 相机
+ * @param scene 场景
+ * @param renderer 渲染器
+ * @param outlinePass 已初始化的 OutlinePass
+ * @param onClick 点击回调
+ * @param options 可选配置
+ * @returns dispose 函数，用于清理事件和资源
+ */
+function createModelClickHandler(camera, scene, renderer, outlinePass, onClick, options = {}) {
+    // 配置项
+    const { clickThreshold = 3, debounceDelay = 0, raycasterParams = {}, enableDynamicThickness = true, minThickness = 1, maxThickness = 10 } = options;
+    const raycaster = new THREE__namespace.Raycaster();
+    const mouse = new THREE__namespace.Vector2();
+    // 应用 raycaster 自定义参数
+    if (raycasterParams.near !== undefined)
+        raycaster.near = raycasterParams.near;
+    if (raycasterParams.far !== undefined)
+        raycaster.far = raycasterParams.far;
+    if (raycasterParams.pointsPrecision !== undefined) {
+        if (!raycaster.params.Points) {
+            raycaster.params.Points = { threshold: raycasterParams.pointsPrecision };
+        }
+        else {
+            raycaster.params.Points.threshold = raycasterParams.pointsPrecision;
+        }
+    }
+    let startX = 0;
+    let startY = 0;
+    let selectedObject = null;
+    let debounceTimer = null;
+    // 使用 AbortController 统一管理事件
+    const abortController = new AbortController();
+    const signal = abortController.signal;
+    /** 恢复对象高亮（清空 OutlinePass.selectedObjects） */
+    function restoreObject() {
+        outlinePass.selectedObjects = [];
+    }
+    /** 鼠标按下记录位置 */
+    function handleMouseDown(event) {
+        startX = event.clientX;
+        startY = event.clientY;
+    }
+    /** 鼠标抬起判定点击或拖动（带防抖） */
+    function handleMouseUp(event) {
+        const dx = Math.abs(event.clientX - startX);
+        const dy = Math.abs(event.clientY - startY);
+        if (dx > clickThreshold || dy > clickThreshold)
+            return; // 拖动不触发点击
+        // 防抖处理
+        if (debounceDelay > 0) {
+            if (debounceTimer !== null) {
+                clearTimeout(debounceTimer);
+            }
+            debounceTimer = window.setTimeout(() => {
+                processClick(event);
+                debounceTimer = null;
+            }, debounceDelay);
+        }
+        else {
+            processClick(event);
+        }
+    }
+    /** 实际的点击处理逻辑 */
+    function processClick(event) {
+        const rect = renderer.domElement.getBoundingClientRect();
+        mouse.x = ((event.clientX - rect.left) / rect.width) * 2 - 1;
+        mouse.y = -((event.clientY - rect.top) / rect.height) * 2 + 1;
+        raycaster.setFromCamera(mouse, camera);
+        const intersects = raycaster.intersectObjects(scene.children, true);
+        if (intersects.length > 0) {
+            let object = intersects[0].object;
+            // 点击不同模型，先清除之前高亮
+            if (selectedObject && selectedObject !== object)
+                restoreObject();
+            selectedObject = object;
+            // highlightObject(selectedObject); // 可选：是否自动高亮
+            onClick(selectedObject, {
+                name: selectedObject.name || '未命名模型',
+                position: selectedObject.getWorldPosition(new THREE__namespace.Vector3()),
+                uuid: selectedObject.uuid
+            });
+        }
+        else {
+            // 点击空白 → 清除高亮
+            if (selectedObject)
+                restoreObject();
+            selectedObject = null;
+            onClick(null);
+        }
+    }
+    // 使用 AbortController 的 signal 注册事件
+    renderer.domElement.addEventListener('mousedown', handleMouseDown, { signal });
+    renderer.domElement.addEventListener('mouseup', handleMouseUp, { signal });
+    /** 销毁函数：解绑事件并清除高亮 */
+    return () => {
+        // 清理防抖定时器
+        if (debounceTimer !== null) {
+            clearTimeout(debounceTimer);
+            debounceTimer = null;
+        }
+        // 一次性解绑所有事件
+        abortController.abort();
+        // 清除高亮
+        restoreObject();
+        // 清空引用
+        selectedObject = null;
+    };
+}
+
+// src/utils/ArrowGuide.ts
+/**
+ * ArrowGuide - 优化版
+ * 箭头引导效果工具，支持高亮模型并淡化其他对象
+ *
+ * ✨ 优化内容：
+ * - 使用 WeakMap 自动回收材质，避免内存泄漏
+ * - 使用 AbortController 管理事件生命周期
+ * - 添加材质复用机制，减少重复创建
+ * - 改进 dispose 逻辑，确保完全释放资源
+ * - 添加错误处理和边界检查
+ */
+class ArrowGuide {
+    constructor(renderer, camera, scene, options) {
+        var _a, _b, _c;
+        this.renderer = renderer;
+        this.camera = camera;
+        this.scene = scene;
+        this.lxMesh = null;
+        this.flowActive = false;
+        this.modelBrightArr = [];
+        this.pointerDownPos = new THREE__namespace.Vector2();
+        this.clickThreshold = 10;
+        this.raycaster = new THREE__namespace.Raycaster();
+        this.mouse = new THREE__namespace.Vector2();
+        // ✨ 使用 WeakMap 自动回收材质（GC 友好）
+        this.originalMaterials = new WeakMap();
+        this.fadedMaterials = new WeakMap();
+        // ✨ AbortController 用于事件管理
+        this.abortController = null;
+        // 配置：非高亮透明度和亮度
+        this.fadeOpacity = 0.5;
+        this.fadeBrightness = 0.1;
+        this.clickThreshold = (_a = options === null || options === void 0 ? void 0 : options.clickThreshold) !== null && _a !== void 0 ? _a : 10;
+        this.ignoreRaycastNames = new Set((options === null || options === void 0 ? void 0 : options.ignoreRaycastNames) || []);
+        this.fadeOpacity = (_b = options === null || options === void 0 ? void 0 : options.fadeOpacity) !== null && _b !== void 0 ? _b : 0.5;
+        this.fadeBrightness = (_c = options === null || options === void 0 ? void 0 : options.fadeBrightness) !== null && _c !== void 0 ? _c : 0.1;
+        this.abortController = new AbortController();
+        this.initEvents();
+    }
+    // —— 工具：缓存原材质（仅首次）
+    cacheOriginalMaterial(mesh) {
+        if (!this.originalMaterials.has(mesh)) {
+            this.originalMaterials.set(mesh, mesh.material);
+        }
+    }
+    // —— 工具：为某个材质克隆一个"半透明版本"，保留所有贴图与参数
+    makeFadedClone(mat) {
+        const clone = mat.clone();
+        const c = clone;
+        // 只改透明相关参数，不改 map / normalMap / roughnessMap 等细节
+        c.transparent = true;
+        if (typeof c.opacity === 'number')
+            c.opacity = this.fadeOpacity;
+        if (c.color && c.color.isColor) {
+            c.color.multiplyScalar(this.fadeBrightness); // 颜色整体变暗
+        }
+        // 为了让箭头在透明建筑后也能顺畅显示，常用策略：不写深度，仅测试深度
+        clone.depthWrite = false;
+        clone.depthTest = true;
+        clone.needsUpdate = true;
+        return clone;
+    }
+    // —— 工具：为 mesh.material（可能是数组）批量克隆"半透明版本"
+    createFadedMaterialFrom(mesh) {
+        const orig = mesh.material;
+        if (Array.isArray(orig)) {
+            return orig.map(m => this.makeFadedClone(m));
+        }
+        return this.makeFadedClone(orig);
+    }
+    /**
+     * 设置箭头 Mesh
+     */
+    setArrowMesh(mesh) {
+        this.lxMesh = mesh;
+        this.cacheOriginalMaterial(mesh);
+        try {
+            const mat = mesh.material;
+            if (mat && mat.map) {
+                const map = mat.map;
+                map.wrapS = THREE__namespace.RepeatWrapping;
+                map.wrapT = THREE__namespace.RepeatWrapping;
+                map.needsUpdate = true;
+            }
+            mesh.visible = false;
+        }
+        catch (error) {
+            console.error('ArrowGuide: 设置箭头材质失败', error);
+        }
+    }
+    /**
+     * 高亮指定模型
+     */
+    highlight(models) {
+        if (!models || models.length === 0) {
+            console.warn('ArrowGuide: 高亮模型列表为空');
+            return;
+        }
+        this.modelBrightArr = models;
+        this.flowActive = true;
+        if (this.lxMesh)
+            this.lxMesh.visible = true;
+        this.applyHighlight();
+    }
+    // ✅ 应用高亮效果：非高亮模型保留细节 → 使用"克隆后的半透明材质"
+    applyHighlight() {
+        // ✨ 使用 Set 提升查找性能
+        const keepMeshes = new Set();
+        this.modelBrightArr.forEach(obj => {
+            obj.traverse(child => {
+                if (child.isMesh)
+                    keepMeshes.add(child);
+            });
+        });
+        try {
+            this.scene.traverse(obj => {
+                if (obj.isMesh) {
+                    const mesh = obj;
+                    // 缓存原材质（用于恢复）
+                    this.cacheOriginalMaterial(mesh);
+                    if (!keepMeshes.has(mesh)) {
+                        // 非高亮：如果还没给它生成过"半透明克隆材质"，就创建一次
+                        if (!this.fadedMaterials.has(mesh)) {
+                            const faded = this.createFadedMaterialFrom(mesh);
+                            this.fadedMaterials.set(mesh, faded);
+                        }
+                        // 替换为克隆材质（保留所有贴图/法线等细节）
+                        const fadedMat = this.fadedMaterials.get(mesh);
+                        if (fadedMat)
+                            mesh.material = fadedMat;
+                    }
+                    else {
+                        // 高亮对象：确保回到原材质（避免上一次高亮后遗留）
+                        const orig = this.originalMaterials.get(mesh);
+                        if (orig && mesh.material !== orig) {
+                            mesh.material = orig;
+                            mesh.material.needsUpdate = true;
+                        }
+                    }
+                }
+            });
+        }
+        catch (error) {
+            console.error('ArrowGuide: 应用高亮失败', error);
+        }
+    }
+    // ✅ 恢复为原材质 & 释放克隆材质
+    restore() {
+        this.flowActive = false;
+        if (this.lxMesh)
+            this.lxMesh.visible = false;
+        try {
+            // ✨ 收集所有需要释放的材质
+            const materialsToDispose = [];
+            this.scene.traverse(obj => {
+                if (obj.isMesh) {
+                    const mesh = obj;
+                    const orig = this.originalMaterials.get(mesh);
+                    if (orig) {
+                        mesh.material = orig;
+                        mesh.material.needsUpdate = true;
+                    }
+                    // ✨ 收集待释放的淡化材质
+                    const faded = this.fadedMaterials.get(mesh);
+                    if (faded) {
+                        if (Array.isArray(faded)) {
+                            materialsToDispose.push(...faded);
+                        }
+                        else {
+                            materialsToDispose.push(faded);
+                        }
+                    }
+                }
+            });
+            // ✨ 批量释放材质（不触碰贴图资源）
+            materialsToDispose.forEach(mat => {
+                try {
+                    mat.dispose();
+                }
+                catch (error) {
+                    console.error('ArrowGuide: 释放材质失败', error);
+                }
+            });
+            // ✨ 创建新的 WeakMap（相当于清空）
+            this.fadedMaterials = new WeakMap();
+        }
+        catch (error) {
+            console.error('ArrowGuide: 恢复材质失败', error);
+        }
+    }
+    /**
+     * 动画更新（每帧调用）
+     */
+    animate() {
+        if (!this.flowActive || !this.lxMesh)
+            return;
+        try {
+            const mat = this.lxMesh.material;
+            if (mat && mat.map) {
+                const map = mat.map;
+                map.offset.y -= 0.01;
+                map.needsUpdate = true;
+            }
+        }
+        catch (error) {
+            console.error('ArrowGuide: 动画更新失败', error);
+        }
+    }
+    /**
+     * 初始化事件监听器
+     */
+    initEvents() {
+        const dom = this.renderer.domElement;
+        const signal = this.abortController.signal;
+        // ✨ 使用 AbortController signal 自动管理事件生命周期
+        dom.addEventListener('pointerdown', (e) => {
+            this.pointerDownPos.set(e.clientX, e.clientY);
+        }, { signal });
+        dom.addEventListener('pointerup', (e) => {
+            const dx = Math.abs(e.clientX - this.pointerDownPos.x);
+            const dy = Math.abs(e.clientY - this.pointerDownPos.y);
+            if (dx > this.clickThreshold || dy > this.clickThreshold)
+                return; // 拖拽
+            const rect = dom.getBoundingClientRect();
+            this.mouse.x = ((e.clientX - rect.left) / rect.width) * 2 - 1;
+            this.mouse.y = -((e.clientY - rect.top) / rect.height) * 2 + 1;
+            this.raycaster.setFromCamera(this.mouse, this.camera);
+            const intersects = this.raycaster.intersectObjects(this.scene.children, true);
+            const filtered = intersects.filter(i => {
+                if (!i.object)
+                    return false;
+                if (this.ignoreRaycastNames.has(i.object.name))
+                    return false;
+                return true;
+            });
+            if (filtered.length === 0)
+                this.restore(); // 点击空白恢复
+        }, { signal });
+    }
+    /**
+     * 释放所有资源
+     */
+    dispose() {
+        // ✨ 先恢复材质
+        this.restore();
+        // ✨ 使用 AbortController 一次性解绑所有事件
+        if (this.abortController) {
+            this.abortController.abort();
+            this.abortController = null;
+        }
+        // ✨ 清空引用
+        this.modelBrightArr = [];
+        this.lxMesh = null;
+        this.fadedMaterials = new WeakMap();
+        this.originalMaterials = new WeakMap();
+        this.ignoreRaycastNames.clear();
+    }
+}
+
+// utils/LiquidFillerGroup.ts
+/**
+ * LiquidFillerGroup - 优化版
+ * 支持单模型或多模型液位动画、独立颜色控制
+ *
+ * ✨ 优化内容：
+ * - 使用 renderer.domElement 替代 window 事件
+ * - 使用 AbortController 管理事件生命周期
+ * - 添加错误处理和边界检查
+ * - 优化动画管理，避免内存泄漏
+ * - 完善资源释放逻辑
+ */
+class LiquidFillerGroup {
+    /**
+     * 构造函数
+     * @param models 单个或多个 THREE.Object3D
+     * @param scene 场景
+     * @param camera 相机
+     * @param renderer 渲染器
+     * @param defaultOptions 默认液体选项
+     * @param clickThreshold 点击阈值，单位像素
+     */
+    constructor(models, scene, camera, renderer, defaultOptions, clickThreshold = 10) {
+        this.items = [];
+        this.raycaster = new THREE__namespace.Raycaster();
+        this.pointerDownPos = new THREE__namespace.Vector2();
+        this.clickThreshold = 10;
+        this.abortController = null; // ✨ 事件管理器
+        /** pointerdown 记录位置 */
+        this.handlePointerDown = (event) => {
+            this.pointerDownPos.set(event.clientX, event.clientY);
+        };
+        /** pointerup 判断点击空白，恢复原始材质 */
+        this.handlePointerUp = (event) => {
+            const dx = event.clientX - this.pointerDownPos.x;
+            const dy = event.clientY - this.pointerDownPos.y;
+            const distance = Math.sqrt(dx * dx + dy * dy);
+            if (distance > this.clickThreshold)
+                return; // 拖拽不触发
+            // ✨ 使用 renderer.domElement 的实际尺寸
+            const rect = this.renderer.domElement.getBoundingClientRect();
+            const pointerNDC = new THREE__namespace.Vector2(((event.clientX - rect.left) / rect.width) * 2 - 1, -((event.clientY - rect.top) / rect.height) * 2 + 1);
+            this.raycaster.setFromCamera(pointerNDC, this.camera);
+            // 点击空白 -> 所有模型恢复
+            const intersectsAny = this.items.some(item => this.raycaster.intersectObject(item.model, true).length > 0);
+            if (!intersectsAny) {
+                this.restoreAll();
+            }
+        };
+        this.scene = scene;
+        this.camera = camera;
+        this.renderer = renderer;
+        this.clickThreshold = clickThreshold;
+        // ✨ 创建 AbortController 用于事件管理
+        this.abortController = new AbortController();
+        const modelArray = Array.isArray(models) ? models : [models];
+        modelArray.forEach(model => {
+            var _a, _b, _c;
+            try {
+                const options = {
+                    color: (_a = defaultOptions === null || defaultOptions === void 0 ? void 0 : defaultOptions.color) !== null && _a !== void 0 ? _a : 0x00ff00,
+                    opacity: (_b = defaultOptions === null || defaultOptions === void 0 ? void 0 : defaultOptions.opacity) !== null && _b !== void 0 ? _b : 0.6,
+                    speed: (_c = defaultOptions === null || defaultOptions === void 0 ? void 0 : defaultOptions.speed) !== null && _c !== void 0 ? _c : 0.05,
+                };
+                // 保存原始材质
+                const originalMaterials = new Map();
+                model.traverse(obj => {
+                    if (obj.isMesh) {
+                        const mesh = obj;
+                        originalMaterials.set(mesh, mesh.material);
+                    }
+                });
+                // ✨ 边界检查：确保有材质可以保存
+                if (originalMaterials.size === 0) {
+                    console.warn('LiquidFillerGroup: 模型没有 Mesh 对象', model);
+                    return;
+                }
+                // 应用淡线框材质
+                model.traverse(obj => {
+                    if (obj.isMesh) {
+                        const mesh = obj;
+                        mesh.material = new THREE__namespace.MeshBasicMaterial({
+                            color: 0xffffff,
+                            wireframe: true,
+                            transparent: true,
+                            opacity: 0.2,
+                        });
+                    }
+                });
+                // 创建液体 Mesh
+                const geometries = [];
+                model.traverse(obj => {
+                    if (obj.isMesh) {
+                        const mesh = obj;
+                        const geom = mesh.geometry.clone();
+                        geom.applyMatrix4(mesh.matrixWorld);
+                        geometries.push(geom);
+                    }
+                });
+                if (geometries.length === 0) {
+                    console.warn('LiquidFillerGroup: 模型没有几何体', model);
+                    return;
+                }
+                const mergedGeometry = BufferGeometryUtils__namespace.mergeGeometries(geometries, false);
+                if (!mergedGeometry) {
+                    console.error('LiquidFillerGroup: 几何体合并失败', model);
+                    return;
+                }
+                const material = new THREE__namespace.MeshPhongMaterial({
+                    color: options.color,
+                    transparent: true,
+                    opacity: options.opacity,
+                    side: THREE__namespace.DoubleSide,
+                });
+                const liquidMesh = new THREE__namespace.Mesh(mergedGeometry, material);
+                this.scene.add(liquidMesh);
+                // 设置 clippingPlane
+                const clipPlane = new THREE__namespace.Plane(new THREE__namespace.Vector3(0, -1, 0), 0);
+                const mat = liquidMesh.material;
+                mat.clippingPlanes = [clipPlane];
+                this.renderer.localClippingEnabled = true;
+                this.items.push({
+                    model,
+                    liquidMesh,
+                    clipPlane,
+                    originalMaterials,
+                    options,
+                    animationId: null // ✨ 初始化动画 ID
+                });
+            }
+            catch (error) {
+                console.error('LiquidFillerGroup: 初始化模型失败', model, error);
+            }
+        });
+        // ✨ 使用 renderer.domElement 替代 window，使用 AbortController signal
+        const signal = this.abortController.signal;
+        this.renderer.domElement.addEventListener('pointerdown', this.handlePointerDown, { signal });
+        this.renderer.domElement.addEventListener('pointerup', this.handlePointerUp, { signal });
+    }
+    /**
+   * 设置液位
+   * @param models 单个模型或模型数组
+   * @param percent 液位百分比 0~1
+   */
+    fillTo(models, percent) {
+        // ✨ 边界检查
+        if (percent < 0 || percent > 1) {
+            console.warn('LiquidFillerGroup: percent 必须在 0~1 之间', percent);
+            percent = Math.max(0, Math.min(1, percent));
+        }
+        const modelArray = Array.isArray(models) ? models : [models];
+        modelArray.forEach(model => {
+            const item = this.items.find(i => i.model === model);
+            if (!item) {
+                console.warn('LiquidFillerGroup: 未找到模型', model);
+                return;
+            }
+            if (!item.liquidMesh) {
+                console.warn('LiquidFillerGroup: liquidMesh 已被释放', model);
+                return;
+            }
+            // ✨ 取消之前的动画
+            if (item.animationId !== null) {
+                cancelAnimationFrame(item.animationId);
+                item.animationId = null;
+            }
+            try {
+                const box = new THREE__namespace.Box3().setFromObject(item.liquidMesh);
+                const min = box.min.y;
+                const max = box.max.y;
+                const targetHeight = min + (max - min) * percent;
+                const animate = () => {
+                    if (!item.liquidMesh) {
+                        item.animationId = null;
+                        return;
+                    }
+                    const diff = targetHeight - item.clipPlane.constant;
+                    if (Math.abs(diff) > 0.01) {
+                        item.clipPlane.constant += diff * item.options.speed;
+                        item.animationId = requestAnimationFrame(animate);
+                    }
+                    else {
+                        item.clipPlane.constant = targetHeight;
+                        item.animationId = null;
+                    }
+                };
+                animate();
+            }
+            catch (error) {
+                console.error('LiquidFillerGroup: fillTo 执行失败', model, error);
+            }
+        });
+    }
+    /** 设置多个模型液位，percentList 与 items 顺序对应 */
+    fillToAll(percentList) {
+        if (percentList.length !== this.items.length) {
+            console.warn(`LiquidFillerGroup: percentList 长度 (${percentList.length}) 与 items 长度 (${this.items.length}) 不匹配`);
+        }
+        percentList.forEach((p, idx) => {
+            if (idx < this.items.length) {
+                this.fillTo(this.items[idx].model, p);
+            }
+        });
+    }
+    /** 恢复单个模型原始材质并移除液体 */
+    restore(model) {
+        const item = this.items.find(i => i.model === model);
+        if (!item)
+            return;
+        // ✨ 取消动画
+        if (item.animationId !== null) {
+            cancelAnimationFrame(item.animationId);
+            item.animationId = null;
+        }
+        // 恢复原始材质
+        item.model.traverse(obj => {
+            if (obj.isMesh) {
+                const mesh = obj;
+                const original = item.originalMaterials.get(mesh);
+                if (original)
+                    mesh.material = original;
+            }
+        });
+        // 释放液体 Mesh
+        if (item.liquidMesh) {
+            this.scene.remove(item.liquidMesh);
+            item.liquidMesh.geometry.dispose();
+            if (Array.isArray(item.liquidMesh.material)) {
+                item.liquidMesh.material.forEach(m => m.dispose());
+            }
+            else {
+                item.liquidMesh.material.dispose();
+            }
+            item.liquidMesh = null;
+        }
+    }
+    /** 恢复所有模型 */
+    restoreAll() {
+        this.items.forEach(item => this.restore(item.model));
+    }
+    /** 销毁方法，释放事件和资源 */
+    dispose() {
+        // ✨ 先恢复所有模型
+        this.restoreAll();
+        // ✨ 使用 AbortController 一次性解绑所有事件
+        if (this.abortController) {
+            this.abortController.abort();
+            this.abortController = null;
+        }
+        // ✨ 清空 items
+        this.items.length = 0;
+    }
+}
+
+exports.ArrowGuide = ArrowGuide;
+exports.LiquidFillerGroup = LiquidFillerGroup;
+exports.createModelClickHandler = createModelClickHandler;
+//# sourceMappingURL=index.js.map