@signal9/era-ui 1.8.5 → 1.8.7

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.
Files changed (2) hide show
  1. package/dist/ui/pane/pane-root.svelte +21 -24
  2. package/package.json +1 -1
package/dist/ui/pane/pane-root.svelte CHANGED
@@ -84,63 +84,60 @@
84
84
  // TEMP: show the grab zones while developing. Flip to false to hide them.
85
85
  const SHOW_RESIZE_ZONES = true;
86
86
 
87
- // Resize handles — 4 edges + 4 corners, each a hit zone that STRADDLES the
88
- // pane's edge, centered on it (translate ±50%), so it bleeds outward by
89
- // exactly as much as it reaches in — an even h-md grab band (T = --era-h-md).
90
- // Edges are inset from the ends by T/2, i.e. exactly where the corner squares
91
- // end, so a blue edge runs right up to each red corner with no gap. `dir` is
92
- // any of n/s/e/w; a 2-letter dir is a corner. Handles live in a layer aligned
93
- // to the pane's border box (markup) and are data-pane-control so they never
94
- // start a pane drag.
87
+ // Resize handles — a tidy OUTER MOAT: every hit zone sits fully OUTSIDE the
88
+ // pane (translate ±100%), so nothing reaches into the interior/frame and the
89
+ // whole content (drag bar included) is left completely clear. Edges are thin
90
+ // h-md/4 strips down each side; corners are h-md/2 squares filling the four
91
+ // diagonal gaps between them. `dir` is any of n/s/e/w; a 2-letter dir is a
92
+ // corner. Handles live in a layer aligned to the pane's border box (markup)
93
+ // and are data-pane-control so they never start a pane drag.
95
94
  type ResizeDir = 'n' | 's' | 'e' | 'w' | 'ne' | 'nw' | 'se' | 'sw';
96
95
  const RESIZE_HANDLES: { dir: ResizeDir; cursor: string; place: string }[] = [
97
- // corners: a T×T square centered on each corner
96
+ // corners: a square just OUTSIDE each corner (diagonal gap filler)
98
97
  {
99
98
  dir: 'nw',
100
99
  cursor: 'cursor-nwse-resize',
101
- place: 'top:0;left:0;translate:-50% -50%;width:var(--era-h-md);height:var(--era-h-md)'
100
+ place:
101
+ 'top:0;left:0;translate:-100% -100%;width:calc(var(--era-h-md)/2);height:calc(var(--era-h-md)/2)'
102
102
  },
103
103
  {
104
104
  dir: 'ne',
105
105
  cursor: 'cursor-nesw-resize',
106
- place: 'top:0;right:0;translate:50% -50%;width:var(--era-h-md);height:var(--era-h-md)'
106
+ place:
107
+ 'top:0;right:0;translate:100% -100%;width:calc(var(--era-h-md)/2);height:calc(var(--era-h-md)/2)'
107
108
  },
108
109
  {
109
110
  dir: 'sw',
110
111
  cursor: 'cursor-nesw-resize',
111
- place: 'bottom:0;left:0;translate:-50% 50%;width:var(--era-h-md);height:var(--era-h-md)'
112
+ place:
113
+ 'bottom:0;left:0;translate:-100% 100%;width:calc(var(--era-h-md)/2);height:calc(var(--era-h-md)/2)'
112
114
  },
113
115
  {
114
116
  dir: 'se',
115
117
  cursor: 'cursor-nwse-resize',
116
- place: 'bottom:0;right:0;translate:50% 50%;width:var(--era-h-md);height:var(--era-h-md)'
118
+ place:
119
+ 'bottom:0;right:0;translate:100% 100%;width:calc(var(--era-h-md)/2);height:calc(var(--era-h-md)/2)'
117
120
  },
118
- // edges: a T-thick strip inset T/2 from each end so it meets the corners
121
+ // edges: a thin strip just OUTSIDE each side, corner to corner
119
122
  {
120
- // Top edge sits ENTIRELY outside (translate -100% → bottom flush at the
121
- // top edge, extending upward) so it never overlaps the drag bar below.
122
123
  dir: 'n',
123
124
  cursor: 'cursor-ns-resize',
124
- place:
125
- 'top:0;left:calc(var(--era-h-md)/2);right:calc(var(--era-h-md)/2);translate:0 -100%;height:calc(var(--era-h-md)/2)'
125
+ place: 'top:0;left:0;right:0;translate:0 -100%;height:calc(var(--era-h-md)/4)'
126
126
  },
127
127
  {
128
128
  dir: 's',
129
129
  cursor: 'cursor-ns-resize',
130
- place:
131
- 'bottom:0;left:calc(var(--era-h-md)/2);right:calc(var(--era-h-md)/2);translate:0 50%;height:calc(var(--era-h-md)/2)'
130
+ place: 'bottom:0;left:0;right:0;translate:0 100%;height:calc(var(--era-h-md)/4)'
132
131
  },
133
132
  {
134
133
  dir: 'w',
135
134
  cursor: 'cursor-ew-resize',
136
- place:
137
- 'left:0;top:calc(var(--era-h-md)/2);bottom:calc(var(--era-h-md)/2);translate:-50% 0;width:calc(var(--era-h-md)/2)'
135
+ place: 'left:0;top:0;bottom:0;translate:-100% 0;width:calc(var(--era-h-md)/4)'
138
136
  },
139
137
  {
140
138
  dir: 'e',
141
139
  cursor: 'cursor-ew-resize',
142
- place:
143
- 'right:0;top:calc(var(--era-h-md)/2);bottom:calc(var(--era-h-md)/2);translate:50% 0;width:calc(var(--era-h-md)/2)'
140
+ place: 'right:0;top:0;bottom:0;translate:100% 0;width:calc(var(--era-h-md)/4)'
144
141
  }
145
142
  ];
146
143
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@signal9/era-ui",
3
- "version": "1.8.5",
3
+ "version": "1.8.7",
4
4
  "scripts": {
5
5
  "dev": "vite dev --host",
6
6
  "build": "vite build && npm run prepack",