Simplify dragged element

This commit is contained in:
2025-12-17 22:42:25 +01:00
parent b92bbeb0c2
commit 209249806b
2 changed files with 13 additions and 12 deletions

View File

@@ -1,6 +1,6 @@
{
"name": "@tp/tp-tree-nav",
"version": "1.2.0",
"version": "1.2.1",
"description": "",
"main": "tp-tree-nav.js",
"scripts": {

View File

@@ -135,6 +135,8 @@ export class TpTreeNav extends Position(LitElement) {
opacity: 0.5;
position: absolute;
z-index: 1000;
top: -1000px;
left: -1000px;
}
`
];
@@ -528,21 +530,16 @@ export class TpTreeNav extends Position(LitElement) {
const row = e.currentTarget;
const rect = row.getBoundingClientRect();
const clone = row.cloneNode(true);
const clone = document.createElement('div');
clone.classList.add('drag-clone');
clone.setAttribute('part', 'drag-clone');
clone.style.width = `${rect.width}px`;
clone.style.height = `${rect.height}px`;
clone.style.top = '-1000px';
clone.style.left = '-1000px';
clone.textContent = row.textContent;
this.shadowRoot.appendChild(clone);
const offsetX = e.clientX - rect.left;
const offsetY = e.clientY - rect.top;
e.dataTransfer.setDragImage(clone, offsetX, offsetY);
e.dataTransfer.setDragImage(clone, 0, 0);
setTimeout(() => {
clone.remove();
@@ -716,9 +713,13 @@ export class TpTreeNav extends Position(LitElement) {
if (nextDepth < currentDepth) {
// We are at a step down. Calculate target depth from mouse X.
const indent = 16; // Hardcoded for now, matching CSS default
const padding = 8; // Matching CSS padding
const rowRect = e.currentTarget.getBoundingClientRect();
const row = e.currentTarget;
const style = getComputedStyle(row);
const indentVal = style.getPropertyValue('--tp-tree-indent').trim();
const indent = indentVal ? parseInt(indentVal, 10) : 16;
const padding = parseFloat(style.paddingLeft) || 8;
const rowRect = row.getBoundingClientRect();
const mouseX = e.clientX - rowRect.left;
// Calculate desired depth based on mouse position