diff --git a/development/issues/closed/184.html b/development/issues/closed/184.html
index 0549a17780339aa3bbfed99a10777eba5f27c620..5fffa84436de21fa43b4486936279f69b4d33638 100644
--- a/development/issues/closed/184.html
+++ b/development/issues/closed/184.html
@@ -15,7 +15,7 @@
<li><a href="/">Back to overview</a></li>
</ul>
<main>
- <monster-panel id="panel" style="border: 9px solid yellow;display: block">
+ <monster-panel id="panel" style="border: 9px solid yellow;display: block;">
<div style="background: red">
<monster-panel style="border: 10px solid blue" id="inner" data-monster-option-heightadjustment="5">
sdfsdfsdf<br>asfdasdfasd<br>
diff --git a/source/components/form/select.mjs b/source/components/form/select.mjs
index c6b72f84ca5d57e0746f328466bce27e209f6a91..f9264f199fd57bbb0d0791d30f862076f3f6bcf4 100644
--- a/source/components/form/select.mjs
+++ b/source/components/form/select.mjs
@@ -2614,63 +2614,63 @@ function initEventHandler() {
const types = self.getOption("toggleEventType", ["click"]);
- for (const [, type] of Object.entries(types)) {
- self[controlElementSymbol]
- .querySelector(`[${ATTRIBUTE_ROLE}="container"]`)
- .addEventListener(type, function (event) {
- const element = findTargetElementFromEvent(
- event,
- ATTRIBUTE_ROLE,
- "remove-badge",
- );
- if (element instanceof HTMLElement) {
- return;
- }
+ for (const [, type] of Object.entries(types)) {
+ self[controlElementSymbol]
+ .querySelector(`[${ATTRIBUTE_ROLE}="container"]`)
+ .addEventListener(type, function (event) {
+ const element = findTargetElementFromEvent(
+ event,
+ ATTRIBUTE_ROLE,
+ "remove-badge",
+ );
+ if (element instanceof HTMLElement) {
+ return;
+ }
- toggle.call(self);
- });
+ toggle.call(self);
+ });
- self[controlElementSymbol]
- .querySelector(`[${ATTRIBUTE_ROLE}="status-or-remove-badges"]`)
- .addEventListener(type, function (event) {
- if (self.getOption("disabled", undefined) === true) {
- return;
- }
+ self[controlElementSymbol]
+ .querySelector(`[${ATTRIBUTE_ROLE}="status-or-remove-badges"]`)
+ .addEventListener(type, function (event) {
+ if (self.getOption("disabled", undefined) === true) {
+ return;
+ }
- const path = event.composedPath();
- const element = path?.[0];
- if (element instanceof HTMLElement) {
- const control = element.closest(
- `[${ATTRIBUTE_ROLE}="status-or-remove-badges"]`,
- );
- if (control instanceof HTMLElement) {
- if (control.classList.contains("clear")) {
- clearSelection.call(self);
-
- fireCustomEvent(self, "monster-selection-cleared", {});
- } else {
- const element = findTargetElementFromEvent(
- event,
- ATTRIBUTE_ROLE,
- "remove-badge",
- );
- if (element instanceof HTMLElement) {
- return;
+ const path = event.composedPath();
+ const element = path?.[0];
+ if (element instanceof HTMLElement) {
+ const control = element.closest(
+ `[${ATTRIBUTE_ROLE}="status-or-remove-badges"]`,
+ );
+ if (control instanceof HTMLElement) {
+ if (control.classList.contains("clear")) {
+ clearSelection.call(self);
+
+ fireCustomEvent(self, "monster-selection-cleared", {});
+ } else {
+ const element = findTargetElementFromEvent(
+ event,
+ ATTRIBUTE_ROLE,
+ "remove-badge",
+ );
+ if (element instanceof HTMLElement) {
+ return;
+ }
+
+ toggle.call(self);
}
-
- toggle.call(self);
}
}
- }
- });
+ });
- // badge, selection
- self.addEventListener(type, self[clearOptionEventHandler]);
- }
+ // badge, selection
+ self.addEventListener(type, self[clearOptionEventHandler]);
+ }
- self.addEventListener("monster-change", self[changeEventHandler]);
- self.addEventListener("input", self[inputEventHandler]);
- self.addEventListener("keydown", self[keyEventHandler]);
+ self.addEventListener("monster-change", self[changeEventHandler]);
+ self.addEventListener("input", self[inputEventHandler]);
+ self.addEventListener("keydown", self[keyEventHandler]);
return self;
}
diff --git a/source/components/layout/panel.mjs b/source/components/layout/panel.mjs
index a20340a9d953ca27148793558199b80961ad3bc5..40fd7bf82cda21dd0539fdde32e38fd6981d5f5d 100644
--- a/source/components/layout/panel.mjs
+++ b/source/components/layout/panel.mjs
@@ -84,7 +84,7 @@ class Panel extends CustomElement {
/**
*
- * @return {Monster.Components.Host.Viewer}
+ * @return {Panel}
*/
[assembleMethodSymbol]() {
super[assembleMethodSymbol]();
diff --git a/source/components/layout/split-panel.mjs b/source/components/layout/split-panel.mjs
index e624fd18e858ce2dac901fcc844a8b5aac9ca895..cb22b8aeb0e1432cc099630395ef4530959d1ec4 100644
--- a/source/components/layout/split-panel.mjs
+++ b/source/components/layout/split-panel.mjs
@@ -23,6 +23,7 @@ import { Observer } from "../../types/observer.mjs";
import { SplitPanelStyleSheet } from "./stylesheet/split-panel.mjs";
import { instanceSymbol } from "../../constants.mjs";
import { internalSymbol } from "../../constants.mjs";
+import {getDocument} from "../../dom/util.mjs";
export { SplitPanel, TYPE_VERTICAL, TYPE_HORIZONTAL };
@@ -69,6 +70,8 @@ const TYPE_HORIZONTAL = "horizontal";
*
* @fragments /fragments/components/layout/split-panel/
*
+ * @issue https://localhost.alvine.dev:8440/development/issues/closed/184.html
+ *
* @example /examples/components/layout/split-panel-simple
*
* @since 3.54.0
@@ -294,6 +297,8 @@ function initEventHandler() {
});
}
+ let userSelectDefault = getDocument().body.style.userSelect;
+
this[draggerElementSymbol].addEventListener("mousedown", () => {
self[internalSymbol].getSubject().isDragging = true;
@@ -317,6 +322,8 @@ function initEventHandler() {
return;
}
+ getDocument().body.style.userSelect = "none";
+
if (self.getOption("splitType") === TYPE_HORIZONTAL) {
const containerOffsetTop = self[splitScreenElementSymbol].offsetTop;
const topPanel = self[startPanelElementSymbol];
@@ -370,6 +377,10 @@ function initEventHandler() {
const dragEventHandler = (e) => {
self[internalSymbol].getSubject().isDragging = false;
+
+
+ document.body.style.userSelect = userSelectDefault;
+
document.removeEventListener("mousemove", eventListener);
document.removeEventListener("mouseup", eventListener);
};