@signal9/era-ui 1.4.3 → 1.4.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/ui/pane/pane-root.svelte +43 -25
- package/package.json +1 -1
|
@@ -65,6 +65,14 @@
|
|
|
65
65
|
|
|
66
66
|
let resizing = $state(false);
|
|
67
67
|
|
|
68
|
+
// neodrag's `controls` plugin caches the handle's allow-zone at setup and
|
|
69
|
+
// only refreshes it mid-drag. After a resize the widened handle bar would
|
|
70
|
+
// keep the old (narrow) zone, so its new area wouldn't initiate a drag until
|
|
71
|
+
// the next one. Bumping this on resize-end re-creates the draggable
|
|
72
|
+
// attachment below, re-running controls' setup so the zone matches the
|
|
73
|
+
// current width — the whole bar stays a handle at any size.
|
|
74
|
+
let dragGeneration = $state(0);
|
|
75
|
+
|
|
68
76
|
// Corner-grip resize. The grip sits outside the handle allow-zone and is
|
|
69
77
|
// marked data-pane-control, so a drag can never start from it. Pointer
|
|
70
78
|
// capture keeps the gesture alive even if the cursor outruns the corner.
|
|
@@ -92,10 +100,44 @@
|
|
|
92
100
|
grip.releasePointerCapture(ev.pointerId);
|
|
93
101
|
grip.removeEventListener('pointermove', onMove);
|
|
94
102
|
grip.removeEventListener('pointerup', onUp);
|
|
103
|
+
// Recompute the handle drag-zone at the new size (see dragGeneration).
|
|
104
|
+
dragGeneration += 1;
|
|
95
105
|
};
|
|
96
106
|
grip.addEventListener('pointermove', onMove);
|
|
97
107
|
grip.addEventListener('pointerup', onUp);
|
|
98
108
|
}
|
|
109
|
+
|
|
110
|
+
// Reading dragGeneration ties this attachment's identity to it, so a resize
|
|
111
|
+
// re-creates the draggable and re-runs controls' setup (fresh handle zone).
|
|
112
|
+
// Position/disabled stay reactive without re-init via their Compartments.
|
|
113
|
+
const paneDraggable = $derived.by(() => {
|
|
114
|
+
void dragGeneration;
|
|
115
|
+
return draggable(() => [
|
|
116
|
+
// The handle bar initiates a drag; interactive controls inside it
|
|
117
|
+
// (close button, tab triggers) are carved back out so they click, not drag.
|
|
118
|
+
controls({
|
|
119
|
+
allow: ControlFrom.selector('[data-pane-handle]'),
|
|
120
|
+
block: ControlFrom.selector('[data-pane-control]')
|
|
121
|
+
}),
|
|
122
|
+
// Exposes data-neodrag-state="idle | dragging" (and a drag count) on
|
|
123
|
+
// the root — the hover-highlight and layer-promotion hooks hang off it.
|
|
124
|
+
stateMarker(),
|
|
125
|
+
events({
|
|
126
|
+
onDragStart,
|
|
127
|
+
onDrag: (data) => {
|
|
128
|
+
sync(data);
|
|
129
|
+
onDrag?.(data);
|
|
130
|
+
},
|
|
131
|
+
onDragEnd: (data) => {
|
|
132
|
+
sync(data);
|
|
133
|
+
onDragEnd?.(data);
|
|
134
|
+
}
|
|
135
|
+
}),
|
|
136
|
+
positionComp,
|
|
137
|
+
disabledComp,
|
|
138
|
+
...(typeof plugins === 'function' ? plugins() : plugins)
|
|
139
|
+
]);
|
|
140
|
+
});
|
|
99
141
|
</script>
|
|
100
142
|
|
|
101
143
|
<div
|
|
@@ -111,31 +153,7 @@
|
|
|
111
153
|
)}
|
|
112
154
|
style={size ? `width:${size.width}px;height:${size.height}px` : undefined}
|
|
113
155
|
{...restProps}
|
|
114
|
-
{@attach
|
|
115
|
-
// The handle bar initiates a drag; interactive controls inside it
|
|
116
|
-
// (close button, tab triggers) are carved back out so they click, not drag.
|
|
117
|
-
controls({
|
|
118
|
-
allow: ControlFrom.selector('[data-pane-handle]'),
|
|
119
|
-
block: ControlFrom.selector('[data-pane-control]')
|
|
120
|
-
}),
|
|
121
|
-
// Exposes data-neodrag-state="idle | dragging" (and a drag count) on
|
|
122
|
-
// the root — the hover-highlight and layer-promotion hooks hang off it.
|
|
123
|
-
stateMarker(),
|
|
124
|
-
events({
|
|
125
|
-
onDragStart,
|
|
126
|
-
onDrag: (data) => {
|
|
127
|
-
sync(data);
|
|
128
|
-
onDrag?.(data);
|
|
129
|
-
},
|
|
130
|
-
onDragEnd: (data) => {
|
|
131
|
-
sync(data);
|
|
132
|
-
onDragEnd?.(data);
|
|
133
|
-
}
|
|
134
|
-
}),
|
|
135
|
-
positionComp,
|
|
136
|
-
disabledComp,
|
|
137
|
-
...(typeof plugins === 'function' ? plugins() : plugins)
|
|
138
|
-
])}
|
|
156
|
+
{@attach paneDraggable}
|
|
139
157
|
>
|
|
140
158
|
{@render children?.()}
|
|
141
159
|
{#if resizable}
|