@realsee/dnalogel 2.0.0-alpha.35-beta2 → 2.0.0-alpha.37

package/libs/PanoSpatialTagPlugin/Plugin.d.ts

@@ -15,6 +15,8 @@ export interface PanoSpatialTagPluginParameterType {
     minRad?: number;
     nearTolerance?: number;
     upsideHeight?: number;
+    minDistance?: number;
+    maxDistance?: number;
 }
 export interface PanoSpatialTagPluginExportType {
     load: (data: PanoSpatialTagPluginData) => void;

package/libs/PanoSpatialTagPlugin/Plugin.js

@@ -8,13 +8,11 @@ import render from '../shared-utils/tinyEJSrender';
 const MESH_SIZE = 0.001;
 const RAY_TOLERANT_DISTANCE = 0.01;
 const BLUR_IMAGE_URL = 'https://vrlab-image4.ljcdn.com/release/web/PanoSpatialTagPlugin__blur.png';
-const MIN_DISTANCE = 1.2;
-const MAX_DISTANCE = 3.5;
 /**
  * 空间游走标签插件
  */
 export const PanoSpatialTagPlugin = (five, params) => {
-    var _a, _b, _c, _d, _e, _f;
+    var _a, _b, _c, _d, _e, _f, _g, _h;
     let wrapper = params === null || params === void 0 ? void 0 : params.container;
     let centerY = 1.4;
     const wait = (_a = params === null || params === void 0 ? void 0 : params.wait) !== null && _a !== void 0 ? _a : 200;
@@ -22,6 +20,8 @@ export const PanoSpatialTagPlugin = (five, params) => {
     const minRad = (_c = params === null || params === void 0 ? void 0 : params.minRad) !== null && _c !== void 0 ? _c : Math.PI / 4;
     const nearTolerance = (_d = params === null || params === void 0 ? void 0 : params.nearTolerance) !== null && _d !== void 0 ? _d : 100;
     const upsideHeight = (_e = params === null || params === void 0 ? void 0 : params.upsideHeight) !== null && _e !== void 0 ? _e : 1.6;
+    const minDistance = (_f = params === null || params === void 0 ? void 0 : params.minDistance) !== null && _f !== void 0 ? _f : 1.2;
+    const maxDistance = (_g = params === null || params === void 0 ? void 0 : params.maxDistance) !== null && _g !== void 0 ? _g : 3.5;
     // const foldPercent = params?.foldPercent ?? 20
     const css3DRender = CSS3DRenderPlugin(five);
     const container = document.createElement('div');
@@ -76,7 +76,7 @@ export const PanoSpatialTagPlugin = (five, params) => {
         frustum.setFromProjectionMatrix(projScreenMatrix);
         state.tags.forEach(tag => {
             const distance = camera.position.clone().setY(centerY).distanceTo(tag.position);
-            if (distance < MIN_DISTANCE || distance > MAX_DISTANCE)
+            if (distance < minDistance || distance > maxDistance)
                 return tag.destroying = true;
             if (!frustum.containsPoint(tag.position))
                 return tag.destroying = true;
@@ -88,16 +88,16 @@ export const PanoSpatialTagPlugin = (five, params) => {
         state.tags.forEach(tag => {
             if (tag.destroying) {
                 tag.app.$set({
-                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / MAX_DISTANCE,
-                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / MAX_DISTANCE),
+                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / maxDistance,
+                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / maxDistance),
                     destroying: tag.destroying,
                 });
             }
             else {
                 tag.app.$set({
-                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / MAX_DISTANCE),
-                    lineHeightZoom: 0.4 + (camera.position.distanceTo(tag.position) - MIN_DISTANCE) / MAX_DISTANCE * 0.6,
-                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / MAX_DISTANCE,
+                    lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(tag.position) / maxDistance),
+                    lineHeightZoom: 0.4 + (camera.position.distanceTo(tag.position) - minDistance) / maxDistance * 0.6,
+                    contentZoom: 0.1 + camera.position.distanceTo(tag.position) / maxDistance,
                 });
             }
         });
@@ -171,7 +171,7 @@ export const PanoSpatialTagPlugin = (five, params) => {
             if (state.tags.find(tag => point.id === tag.id && !tag.destroying))
                 return result;
             const distance = camera.position.clone().setY(centerY).distanceTo(point.position);
-            if (distance < MIN_DISTANCE || distance > MAX_DISTANCE)
+            if (distance < minDistance || distance > maxDistance)
                 return result;
             if (!frustum.containsPoint(point.position))
                 return result;
@@ -256,9 +256,9 @@ export const PanoSpatialTagPlugin = (five, params) => {
                     props: {
                         id,
                         content: state.render(state.template, replacement),
-                        lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(position) / MAX_DISTANCE),
-                        lineHeightZoom: 0.4 + (camera.position.distanceTo(position) - MIN_DISTANCE) / MAX_DISTANCE * 0.6,
-                        contentZoom: 0.1 + camera.position.distanceTo(position) / MAX_DISTANCE,
+                        lineWidthZoom: 0.38 * (0.01 + camera.position.distanceTo(position) / maxDistance),
+                        lineHeightZoom: 0.4 + (camera.position.distanceTo(position) - minDistance) / maxDistance * 0.6,
+                        contentZoom: 0.1 + camera.position.distanceTo(position) / maxDistance,
                         upsideDown: position.y > upsideHeight,
                         folded: state.folded,
                         events: state.events,
@@ -369,6 +369,22 @@ export const PanoSpatialTagPlugin = (five, params) => {
                 tag.app.$set({ folded: true });
         });
     };
+    const onResize = () => {
+        five.once('renderFrame', updateOrigins);
+    };
+    const onModelLoaded = () => {
+        if (!wrapper)
+            wrapper = five.getElement().parentElement;
+        if (wrapper)
+            wrapper.appendChild(container);
+        state.forbidden = false;
+        centerY = five.model.bounding.getCenter(new THREE.Vector3()).y;
+        updateTags();
+        five.on('panoWillArrive', onPanoWillArrive);
+        five.on('panoArrived', onPanoArrived);
+        five.on('modeChange', onModeChange);
+        five.on('cameraUpdate', onCameraUpdate);
+    };
     const dispose = () => {
         blurImage = null;
         css3DRender.disposeAll();
@@ -379,41 +395,20 @@ export const PanoSpatialTagPlugin = (five, params) => {
         });
         state.origins = [];
         state.tags = [];
+        five.off('modelLoaded', onModelLoaded);
+        five.off('renderFrame', updateOrigins);
         five.off('panoWillArrive', onPanoWillArrive);
         five.off('panoArrived', onPanoArrived);
         five.off('modeChange', onModeChange);
         five.off('cameraUpdate', onCameraUpdate);
-        window.removeEventListener('resize', updateOrigins, false);
+        five.off('dispose', dispose);
+        window.removeEventListener('resize', onResize, false);
     };
-    window.addEventListener('resize', updateOrigins, false);
-    if ((_f = five === null || five === void 0 ? void 0 : five.model) === null || _f === void 0 ? void 0 : _f.loaded) {
-        if (!wrapper)
-            wrapper = five.getElement().parentElement;
-        if (wrapper)
-            wrapper.appendChild(container);
-        state.forbidden = false;
-        centerY = five.model.bounding.getCenter(new THREE.Vector3()).y;
-        updateTags();
-        five.on('panoWillArrive', onPanoWillArrive);
-        five.on('panoArrived', onPanoArrived);
-        five.on('modeChange', onModeChange);
-        five.on('cameraUpdate', onCameraUpdate);
-    }
-    else {
-        five.once('modelLoaded', () => {
-            if (!wrapper)
-                wrapper = five.getElement().parentElement;
-            if (wrapper)
-                wrapper.appendChild(container);
-            centerY = five.model.bounding.getCenter(new THREE.Vector3()).y;
-            state.forbidden = false;
-            updateTags();
-            five.on('panoWillArrive', onPanoWillArrive);
-            five.on('panoArrived', onPanoArrived);
-            five.on('modeChange', onModeChange);
-            five.on('cameraUpdate', onCameraUpdate);
-        });
-    }
+    window.addEventListener('resize', onResize, false);
+    if ((_h = five === null || five === void 0 ? void 0 : five.model) === null || _h === void 0 ? void 0 : _h.loaded)
+        onModelLoaded();
+    else
+        five.once('modelLoaded', onModelLoaded);
     five.on('dispose', dispose);
     return {
         load,

package/libs/base/BasePlugin.d.ts

@@ -0,0 +1,100 @@
+import { Five, Subscribe } from '@realsee/five';
+/**
+ * 基本属性字段
+ */
+interface State {
+    /**
+     * 插件是否启用
+     */
+    enabled: boolean;
+    /**
+     * 插件UI是否展示
+     */
+    visible?: boolean;
+    /**
+     * 插件的配置项
+     */
+    config?: unknown;
+}
+interface BaseOptions {
+    /** 是否是用户行为 */
+    userAction?: boolean;
+}
+/**
+ * 插件基本事件
+ */
+declare type EventMap<PluginState> = {
+    /**
+     * 插件被销毁
+     */
+    dispose: () => void;
+    /**
+     * 插件状态变化
+     * @param params.state      最新的State
+     * @param params.prevState  上一个State
+     * @param params.userAction 是否是用户触发
+     */
+    stateChange: (params: {
+        state: PluginState;
+        prevState?: PluginState;
+        userAction: boolean;
+    }) => void;
+};
+/**
+ * plugin 的基本控制器
+ */
+declare abstract class Controller<PluginState extends State, PluginEventMap extends EventMap<PluginState>> {
+    five: Five;
+    /**
+     * 插件事件钩子
+     */
+    hooks: Subscribe<PluginEventMap>;
+    /**
+     * 当前状态
+     * @description
+     * ```text
+     * 可以通过 plugin.state 和 plugin.setState 来获取和设置。
+     * 通过 state 设置后，plugin 会通过合适的动画运动来达到设置的效果。
+     * 来迎合一些通过数据驱动的场景。
+     * ```
+     */
+    abstract state: PluginState;
+    constructor(five: Five);
+    /**
+     * 获取当前的插件状态，如果当初插件内存在需要通过动画变更的 state 值，则通过此方法可以得到中间状态
+     */
+    getCurrentState(): PluginState;
+    /**
+     * 插件自身DOM添加到父容器
+     * @param wrapper
+     */
+    appendTo?(wrapper: Element): void;
+    /**
+     * 展示UI
+     */
+    show?(options?: BaseOptions): Promise<void>;
+    /**
+     * 隐藏UI
+     */
+    hide?(options?: BaseOptions): Promise<void>;
+    /**
+     * 启用插件，让插件能够响应交互
+     */
+    abstract enable(options?: BaseOptions): void;
+    /**
+     * 禁用插件，让插件停止响应交互
+     */
+    abstract disable(options?: BaseOptions): void;
+    /**
+     * 插件进行销毁
+     */
+    abstract dispose(): void;
+    /**
+     * 设置state
+     * @param state 插件的目标状态
+     * @param options 配置项
+     */
+    abstract setState(state: Partial<PluginState>, options?: BaseOptions): void;
+}
+export type { State, EventMap, BaseOptions };
+export { Controller };

package/libs/base/BasePlugin.js

@@ -0,0 +1,31 @@
+import { Subscribe } from '@realsee/five';
+/**
+ * plugin 的基本控制器
+ */
+class Controller {
+    constructor(five) {
+        Object.defineProperty(this, "five", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: void 0
+        });
+        /**
+         * 插件事件钩子
+         */
+        Object.defineProperty(this, "hooks", {
+            enumerable: true,
+            configurable: true,
+            writable: true,
+            value: new Subscribe()
+        });
+        this.five = five;
+    }
+    /**
+     * 获取当前的插件状态，如果当初插件内存在需要通过动画变更的 state 值，则通过此方法可以得到中间状态
+     */
+    getCurrentState() {
+        return this.state;
+    }
+}
+export { Controller };

package/libs/base/BasePluginWithData.d.ts

@@ -0,0 +1,34 @@
+import * as BasePlugin from './BasePlugin';
+declare type State = BasePlugin.State;
+interface EventMap<PluginState, PluginData> extends BasePlugin.EventMap<PluginState> {
+    /** 数据变更 */
+    dataChange: (data: PluginData, prevData?: PluginData) => void;
+    /** 数据加载完成 */
+    dataLoaded: (data: PluginData) => void;
+}
+/**
+ * 插件的基础数据
+ */
+interface ServerData {
+    /**
+     * 数据版本
+     */
+    version: number;
+    /**
+     * 数据
+     */
+    data?: unknown;
+}
+declare abstract class Controller<PluginState extends State, PluginEventMap extends EventMap<PluginState, PluginData>, PluginServerData extends ServerData, PluginData> extends BasePlugin.Controller<PluginState, PluginEventMap> {
+    protected abstract data?: PluginData;
+    /**
+     * 加载插件依赖数据
+     * @param serverData 插件数据
+     * @param state 插件 State
+     */
+    abstract load(serverData: PluginServerData, state?: PluginState, userAction?: boolean): Promise<void>;
+    /** 把原始数据转化为插件数据 */
+    protected abstract formatData?(serverData: PluginServerData): Promise<PluginData>;
+}
+export type { State, EventMap, ServerData };
+export { Controller };

package/libs/base/BasePluginWithData.js

@@ -0,0 +1,4 @@
+import * as BasePlugin from './BasePlugin';
+class Controller extends BasePlugin.Controller {
+}
+export { Controller };

package/libs/floorplan/Components/Compass.js

@@ -20,10 +20,10 @@ import {
 import { COMPASS_IMAGE } from '../Assets/compass';
 
 function add_css(target) {
-	append_styles(target, "svelte-5l80pv", ".floorplan-plugin__compass.svelte-5l80pv{position:absolute;left:50%;top:-46px;width:231px;height:41px;will-change:opacity;transform-origin:center 184px}.floorplan-plugin__compass-image.svelte-5l80pv{width:100%;height:100%;position:absolute;left:0;top:0;opacity:0.1;background-repeat:no-repeat;background-size:100% 100%}.floorplan-plugin__compass-text.svelte-5l80pv{position:absolute;left:50%;top:15px;transform:translateX(-50%);opacity:0.2;font-weight:bold;font-size:10px;color:#fff}");
+	append_styles(target, "svelte-p7yk9v", ".floorplan-plugin__compass.svelte-p7yk9v{position:absolute;left:50%;top:-46px;width:231px;height:41px;will-change:opacity;transform-origin:center 184px}.floorplan-plugin__compass-image.svelte-p7yk9v{width:100%;height:100%;position:absolute;left:0;top:0;opacity:0.1;background-repeat:no-repeat;background-size:100% 100%}.floorplan-plugin__compass-text.svelte-p7yk9v{position:absolute;left:50%;top:15px;transform:translateX(-50%);opacity:0.2;font-weight:bold;font-size:10px;color:#fff}");
 }
 
-// (14:0) {#if canShowCompass}
+// (14:0) {#if canCompassShow}
 function create_if_block(ctx) {
 	let div1;
 	let div0;
@@ -38,11 +38,11 @@ function create_if_block(ctx) {
 			t0 = space();
 			span = element("span");
 			t1 = text(/*northDesc*/ ctx[0]);
-			attr(div0, "class", "floorplan-plugin__compass-image svelte-5l80pv");
+			attr(div0, "class", "floorplan-plugin__compass-image svelte-p7yk9v");
 			set_style(div0, "background-image", `url(${COMPASS_IMAGE})`);
-			attr(span, "class", "floorplan-plugin__compass-text svelte-5l80pv");
-			attr(div1, "class", "floorplan-plugin__compass svelte-5l80pv");
-			set_style(div1, "transform", /*compassTransformStyle*/ ctx[1], false);
+			attr(span, "class", "floorplan-plugin__compass-text svelte-p7yk9v");
+			attr(div1, "class", "floorplan-plugin__compass svelte-p7yk9v");
+			set_style(div1, "transform", /*compassTransformStyle*/ ctx[2], false);
 		},
 		m(target, anchor) {
 			insert(target, div1, anchor);
@@ -62,7 +62,7 @@ function create_if_block(ctx) {
 
 function create_fragment(ctx) {
 	let if_block_anchor;
-	let if_block = /*canShowCompass*/ ctx[2] && create_if_block(ctx);
+	let if_block = /*canCompassShow*/ ctx[1] && create_if_block(ctx);
 
 	return {
 		c() {
@@ -74,7 +74,7 @@ function create_fragment(ctx) {
 			insert(target, if_block_anchor, anchor);
 		},
 		p(ctx, [dirty]) {
-			if (/*canShowCompass*/ ctx[2]) if_block.p(ctx, dirty);
+			if (/*canCompassShow*/ ctx[1]) if_block.p(ctx, dirty);
 		},
 		i: noop,
 		o: noop,
@@ -98,16 +98,16 @@ function instance($$self, $$props, $$invalidate) {
 	? void 0
 	: _a.northRad;
 
-	const rotate = typeof northRad !== 'number' ? 0 : rad2Deg(northRad);
+	const canCompassShow = typeof northRad === 'number';
+	const rotate = !northRad ? 0 : rad2Deg(northRad);
 	const compassTransformStyle = `translateX(-50%) translateZ(10px) rotate(${-rotate + 90}deg)`;
-	const canShowCompass = typeof northRad === 'number';
 
 	$$self.$$set = $$props => {
 		if ('floorplanData' in $$props) $$invalidate(3, floorplanData = $$props.floorplanData);
 		if ('northDesc' in $$props) $$invalidate(0, northDesc = $$props.northDesc);
 	};
 
-	return [northDesc, compassTransformStyle, canShowCompass, floorplanData];
+	return [northDesc, canCompassShow, compassTransformStyle, floorplanData];
 }
 
 class Component extends SvelteComponent {

package/libs/floorplan/Components/CurrentFloor.js

@@ -22,6 +22,7 @@ import {
 	transition_out
 } from "svelte/internal";
 
+import { writable } from 'svelte/store';
 import BaseImage from './BaseImage';
 import RoomLabels from './RoomLabels/RoomLabels';
 import RuleLabels from './RuleLabels/RuleLabels';
@@ -32,7 +33,7 @@ function add_css(target) {
 	append_styles(target, "svelte-1oamigj", ".floorplan-plugin__floor.svelte-1oamigj{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;pointer-events:none}.floorplan-plugin__floor--is-current.svelte-1oamigj{opacity:1;pointer-events:auto}");
 }
 
-// (17:2) {#if hoverEnable}
+// (20:2) {#if hoverEnable}
 function create_if_block_2(ctx) {
 	let roomhighlight;
 	let current;
@@ -40,7 +41,8 @@ function create_if_block_2(ctx) {
 	const roomhighlight_spread_levels = [
 		{
 			floorIndex: /*floorIndex*/ ctx[1],
-			floorplanData: /*floorplanData*/ ctx[5]
+			floorplanData: /*floorplanData*/ ctx[5],
+			hoveredRoom: /*hoveredRoom*/ ctx[8]
 		}
 	];
 
@@ -61,11 +63,12 @@ function create_if_block_2(ctx) {
 			current = true;
 		},
 		p(ctx, dirty) {
-			const roomhighlight_changes = (dirty & /*floorIndex, floorplanData*/ 34)
+			const roomhighlight_changes = (dirty & /*floorIndex, floorplanData, hoveredRoom*/ 290)
 			? get_spread_update(roomhighlight_spread_levels, [
 					{
 						floorIndex: /*floorIndex*/ ctx[1],
-						floorplanData: /*floorplanData*/ ctx[5]
+						floorplanData: /*floorplanData*/ ctx[5],
+						hoveredRoom: /*hoveredRoom*/ ctx[8]
 					}
 				])
 			: {};
@@ -87,7 +90,7 @@ function create_if_block_2(ctx) {
 	};
 }
 
-// (21:2) {#if roomLabelsEnable}
+// (24:2) {#if roomLabelsEnable}
 function create_if_block_1(ctx) {
 	let roomlabels;
 	let current;
@@ -96,7 +99,9 @@ function create_if_block_1(ctx) {
 		{
 			floorplanData: /*floorplanData*/ ctx[5],
 			floorIndex: /*floorIndex*/ ctx[1],
-			getLabelElement: /*getLabelElement*/ ctx[6]
+			getLabelElement: /*getLabelElement*/ ctx[6],
+			hoveredRoom: /*hoveredRoom*/ ctx[8],
+			adaptiveRoomLabelVisibleEnable: /*adaptiveRoomLabelVisibleEnable*/ ctx[7]
 		}
 	];
 
@@ -117,12 +122,14 @@ function create_if_block_1(ctx) {
 			current = true;
 		},
 		p(ctx, dirty) {
-			const roomlabels_changes = (dirty & /*floorplanData, floorIndex, getLabelElement*/ 98)
+			const roomlabels_changes = (dirty & /*floorplanData, floorIndex, getLabelElement, hoveredRoom, adaptiveRoomLabelVisibleEnable*/ 482)
 			? get_spread_update(roomlabels_spread_levels, [
 					{
 						floorplanData: /*floorplanData*/ ctx[5],
 						floorIndex: /*floorIndex*/ ctx[1],
-						getLabelElement: /*getLabelElement*/ ctx[6]
+						getLabelElement: /*getLabelElement*/ ctx[6],
+						hoveredRoom: /*hoveredRoom*/ ctx[8],
+						adaptiveRoomLabelVisibleEnable: /*adaptiveRoomLabelVisibleEnable*/ ctx[7]
 					}
 				])
 			: {};
@@ -144,7 +151,7 @@ function create_if_block_1(ctx) {
 	};
 }
 
-// (24:2) {#if ruleLabelsEnable}
+// (27:2) {#if ruleLabelsEnable}
 function create_if_block(ctx) {
 	let rulelabels;
 	let current;
@@ -407,6 +414,8 @@ function instance($$self, $$props, $$invalidate) {
 	let { ruleLabelsEnable } = $$props;
 	let { floorplanData } = $$props;
 	let { getLabelElement } = $$props;
+	let { adaptiveRoomLabelVisibleEnable } = $$props;
+	const hoveredRoom = writable(undefined);
 
 	$$self.$$set = $$props => {
 		if ('isCurrent' in $$props) $$invalidate(0, isCurrent = $$props.isCurrent);
@@ -416,6 +425,7 @@ function instance($$self, $$props, $$invalidate) {
 		if ('ruleLabelsEnable' in $$props) $$invalidate(4, ruleLabelsEnable = $$props.ruleLabelsEnable);
 		if ('floorplanData' in $$props) $$invalidate(5, floorplanData = $$props.floorplanData);
 		if ('getLabelElement' in $$props) $$invalidate(6, getLabelElement = $$props.getLabelElement);
+		if ('adaptiveRoomLabelVisibleEnable' in $$props) $$invalidate(7, adaptiveRoomLabelVisibleEnable = $$props.adaptiveRoomLabelVisibleEnable);
 	};
 
 	return [
@@ -425,7 +435,9 @@ function instance($$self, $$props, $$invalidate) {
 		roomLabelsEnable,
 		ruleLabelsEnable,
 		floorplanData,
-		getLabelElement
+		getLabelElement,
+		adaptiveRoomLabelVisibleEnable,
+		hoveredRoom
 	];
 }
 
@@ -446,7 +458,8 @@ class Component extends SvelteComponent {
 				roomLabelsEnable: 3,
 				ruleLabelsEnable: 4,
 				floorplanData: 5,
-				getLabelElement: 6
+				getLabelElement: 6,
+				adaptiveRoomLabelVisibleEnable: 7
 			},
 			add_css
 		);

package/libs/floorplan/Components/Main.js

@@ -37,11 +37,11 @@ function add_css(target) {
 
 function get_each_context(ctx, list, i) {
 	const child_ctx = ctx.slice();
-	child_ctx[13] = list[i];
+	child_ctx[14] = list[i];
 	return child_ctx;
 }
 
-// (21:0) {#if visible}
+// (22:0) {#if visible}
 function create_if_block(ctx) {
 	let div;
 	let t0;
@@ -108,7 +108,7 @@ function create_if_block(ctx) {
 		p(new_ctx, dirty) {
 			ctx = new_ctx;
 
-			if (dirty & /*hoverEnable, floorplanData, getLabelElement, roomLabelsEnable, ruleLabelsEnable, floorIndex*/ 5040) {
+			if (dirty & /*hoverEnable, floorplanData, getLabelElement, roomLabelsEnable, ruleLabelsEnable, adaptiveRoomLabelVisibleEnable, floorIndex*/ 13232) {
 				each_value = /*floorplanData*/ ctx[9].floorDatas;
 				let i;
 
@@ -214,7 +214,7 @@ function create_if_block(ctx) {
 	};
 }
 
-// (23:4) {#each floorplanData.floorDatas as floorData}
+// (24:4) {#each floorplanData.floorDatas as floorData}
 function create_each_block(ctx) {
 	let currentfloor;
 	let current;
@@ -225,13 +225,14 @@ function create_each_block(ctx) {
 			floorplanData: /*floorplanData*/ ctx[9],
 			getLabelElement: /*getLabelElement*/ ctx[12],
 			roomLabelsEnable: /*roomLabelsEnable*/ ctx[7],
-			ruleLabelsEnable: /*ruleLabelsEnable*/ ctx[8]
+			ruleLabelsEnable: /*ruleLabelsEnable*/ ctx[8],
+			adaptiveRoomLabelVisibleEnable: /*adaptiveRoomLabelVisibleEnable*/ ctx[13]
 		},
 		{
-			floorIndex: /*floorData*/ ctx[13].floorIndex
+			floorIndex: /*floorData*/ ctx[14].floorIndex
 		},
 		{
-			isCurrent: /*floorData*/ ctx[13].floorIndex === /*floorIndex*/ ctx[4]
+			isCurrent: /*floorData*/ ctx[14].floorIndex === /*floorIndex*/ ctx[4]
 		}
 	];
 
@@ -252,20 +253,21 @@ function create_each_block(ctx) {
 			current = true;
 		},
 		p(ctx, dirty) {
-			const currentfloor_changes = (dirty & /*hoverEnable, floorplanData, getLabelElement, roomLabelsEnable, ruleLabelsEnable, floorIndex*/ 5040)
+			const currentfloor_changes = (dirty & /*hoverEnable, floorplanData, getLabelElement, roomLabelsEnable, ruleLabelsEnable, adaptiveRoomLabelVisibleEnable, floorIndex*/ 13232)
 			? get_spread_update(currentfloor_spread_levels, [
-					dirty & /*hoverEnable, floorplanData, getLabelElement, roomLabelsEnable, ruleLabelsEnable*/ 5024 && {
+					dirty & /*hoverEnable, floorplanData, getLabelElement, roomLabelsEnable, ruleLabelsEnable, adaptiveRoomLabelVisibleEnable*/ 13216 && {
 						hoverEnable: /*hoverEnable*/ ctx[5],
 						floorplanData: /*floorplanData*/ ctx[9],
 						getLabelElement: /*getLabelElement*/ ctx[12],
 						roomLabelsEnable: /*roomLabelsEnable*/ ctx[7],
-						ruleLabelsEnable: /*ruleLabelsEnable*/ ctx[8]
+						ruleLabelsEnable: /*ruleLabelsEnable*/ ctx[8],
+						adaptiveRoomLabelVisibleEnable: /*adaptiveRoomLabelVisibleEnable*/ ctx[13]
 					},
 					dirty & /*floorplanData*/ 512 && {
-						floorIndex: /*floorData*/ ctx[13].floorIndex
+						floorIndex: /*floorData*/ ctx[14].floorIndex
 					},
 					dirty & /*floorplanData, floorIndex*/ 528 && {
-						isCurrent: /*floorData*/ ctx[13].floorIndex === /*floorIndex*/ ctx[4]
+						isCurrent: /*floorData*/ ctx[14].floorIndex === /*floorIndex*/ ctx[4]
 					}
 				])
 			: {};
@@ -287,7 +289,7 @@ function create_each_block(ctx) {
 	};
 }
 
-// (37:4) {#if compassEnable}
+// (39:4) {#if compassEnable}
 function create_if_block_1(ctx) {
 	let compass;
 	let current;
@@ -397,6 +399,7 @@ function instance($$self, $$props, $$invalidate) {
 	let { lastPanoramaLongitude } = $$props;
 	let { cameraImageUrl } = $$props;
 	let { getLabelElement } = $$props;
+	let { adaptiveRoomLabelVisibleEnable } = $$props;
 
 	$$self.$$set = $$props => {
 		if ('duration' in $$props) $$invalidate(0, duration = $$props.duration);
@@ -412,6 +415,7 @@ function instance($$self, $$props, $$invalidate) {
 		if ('lastPanoramaLongitude' in $$props) $$invalidate(10, lastPanoramaLongitude = $$props.lastPanoramaLongitude);
 		if ('cameraImageUrl' in $$props) $$invalidate(11, cameraImageUrl = $$props.cameraImageUrl);
 		if ('getLabelElement' in $$props) $$invalidate(12, getLabelElement = $$props.getLabelElement);
+		if ('adaptiveRoomLabelVisibleEnable' in $$props) $$invalidate(13, adaptiveRoomLabelVisibleEnable = $$props.adaptiveRoomLabelVisibleEnable);
 	};
 
 	return [
@@ -427,7 +431,8 @@ function instance($$self, $$props, $$invalidate) {
 		floorplanData,
 		lastPanoramaLongitude,
 		cameraImageUrl,
-		getLabelElement
+		getLabelElement,
+		adaptiveRoomLabelVisibleEnable
 	];
 }
 
@@ -454,7 +459,8 @@ class Component extends SvelteComponent {
 				floorplanData: 9,
 				lastPanoramaLongitude: 10,
 				cameraImageUrl: 11,
-				getLabelElement: 12
+				getLabelElement: 12,
+				adaptiveRoomLabelVisibleEnable: 13
 			},
 			add_css
 		);