@aquera/nile-elements 1.4.8-beta-1.0 → 1.4.8-beta-1.2
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/README.md +4 -0
- package/demo/index.html +133 -33
- package/dist/index.cjs.js +1 -1
- package/dist/index.esm.js +1 -1
- package/dist/index.js +98 -71
- package/dist/nile-file-preview/nile-file-preview.css.cjs.js +1 -1
- package/dist/nile-file-preview/nile-file-preview.css.cjs.js.map +1 -1
- package/dist/nile-file-preview/nile-file-preview.css.esm.js +7 -3
- package/dist/nile-file-preview/nile-file-preview.template.cjs.js +1 -1
- package/dist/nile-file-preview/nile-file-preview.template.cjs.js.map +1 -1
- package/dist/nile-file-preview/nile-file-preview.template.esm.js +73 -64
- package/dist/nile-lite-tooltip/nile-lite-tooltip.cjs.js +1 -1
- package/dist/nile-lite-tooltip/nile-lite-tooltip.cjs.js.map +1 -1
- package/dist/nile-lite-tooltip/nile-lite-tooltip.esm.js +1 -1
- package/dist/nile-option/nile-option.cjs.js +1 -1
- package/dist/nile-option/nile-option.cjs.js.map +1 -1
- package/dist/nile-option/nile-option.css.cjs.js +1 -1
- package/dist/nile-option/nile-option.css.cjs.js.map +1 -1
- package/dist/nile-option/nile-option.css.esm.js +10 -0
- package/dist/nile-option/nile-option.esm.js +10 -7
- package/dist/nile-side-bar-action/index.cjs.js +1 -1
- package/dist/nile-side-bar-action/index.esm.js +1 -1
- package/dist/nile-side-bar-action/nile-side-bar-action.cjs.js +1 -1
- package/dist/nile-side-bar-action/nile-side-bar-action.cjs.js.map +1 -1
- package/dist/nile-side-bar-action/nile-side-bar-action.esm.js +4 -3
- package/dist/nile-side-bar-action/portal-manager.cjs.js +2 -0
- package/dist/nile-side-bar-action/portal-manager.cjs.js.map +1 -0
- package/dist/nile-side-bar-action/portal-manager.esm.js +1 -0
- package/dist/nile-side-bar-action/portal-utils.cjs.js +2 -0
- package/dist/nile-side-bar-action/portal-utils.cjs.js.map +1 -0
- package/dist/nile-side-bar-action/portal-utils.esm.js +1 -0
- package/dist/src/nile-file-preview/nile-file-preview.css.js +7 -3
- package/dist/src/nile-file-preview/nile-file-preview.css.js.map +1 -1
- package/dist/src/nile-file-preview/nile-file-preview.template.js +46 -37
- package/dist/src/nile-file-preview/nile-file-preview.template.js.map +1 -1
- package/dist/src/nile-lite-tooltip/nile-lite-tooltip.d.ts +2 -0
- package/dist/src/nile-lite-tooltip/nile-lite-tooltip.js +15 -0
- package/dist/src/nile-lite-tooltip/nile-lite-tooltip.js.map +1 -1
- package/dist/src/nile-option/nile-option.css.js +10 -0
- package/dist/src/nile-option/nile-option.css.js.map +1 -1
- package/dist/src/nile-option/nile-option.d.ts +1 -0
- package/dist/src/nile-option/nile-option.js +13 -5
- package/dist/src/nile-option/nile-option.js.map +1 -1
- package/dist/src/nile-side-bar-action/nile-side-bar-action.d.ts +8 -1
- package/dist/src/nile-side-bar-action/nile-side-bar-action.js +66 -12
- package/dist/src/nile-side-bar-action/nile-side-bar-action.js.map +1 -1
- package/dist/src/nile-side-bar-action/portal-manager.d.ts +43 -0
- package/dist/src/nile-side-bar-action/portal-manager.js +374 -0
- package/dist/src/nile-side-bar-action/portal-manager.js.map +1 -0
- package/dist/src/nile-side-bar-action/portal-utils.d.ts +32 -0
- package/dist/src/nile-side-bar-action/portal-utils.js +212 -0
- package/dist/src/nile-side-bar-action/portal-utils.js.map +1 -0
- package/dist/src/version.js +1 -1
- package/dist/src/version.js.map +1 -1
- package/dist/tsconfig.tsbuildinfo +1 -1
- package/package.json +1 -1
- package/src/nile-file-preview/nile-file-preview.css.ts +7 -3
- package/src/nile-file-preview/nile-file-preview.template.ts +46 -37
- package/src/nile-lite-tooltip/nile-lite-tooltip.ts +15 -0
- package/src/nile-option/nile-option.css.ts +10 -0
- package/src/nile-option/nile-option.ts +11 -5
- package/src/nile-side-bar-action/nile-side-bar-action.ts +74 -15
- package/src/nile-side-bar-action/portal-manager.ts +489 -0
- package/src/nile-side-bar-action/portal-utils.ts +270 -0
- package/vscode-html-custom-data.json +22 -3
|
@@ -0,0 +1,374 @@
|
|
|
1
|
+
import { autoUpdate, computePosition, flip, offset, shift, size, platform } from '@floating-ui/dom';
|
|
2
|
+
import { PortalUtils, PortalContentUtils, PortalEventUtils } from './portal-utils';
|
|
3
|
+
export class DropdownPortalManager {
|
|
4
|
+
constructor(component) {
|
|
5
|
+
this.portalContainer = null;
|
|
6
|
+
this.measuredPanelHeight = null;
|
|
7
|
+
this.clonedPanel = null;
|
|
8
|
+
this.cleanupAutoUpdate = null;
|
|
9
|
+
this.currentPlacement = 'bottom-start';
|
|
10
|
+
this.currentMiddlewareData = null;
|
|
11
|
+
this.boundHandleWindowResize = null;
|
|
12
|
+
this.component = component;
|
|
13
|
+
}
|
|
14
|
+
createPortalAppendContainer() {
|
|
15
|
+
const container = document.createElement('div');
|
|
16
|
+
container.style.position = 'absolute';
|
|
17
|
+
container.style.zIndex = '9999';
|
|
18
|
+
container.style.pointerEvents = 'none';
|
|
19
|
+
container.style.width = 'auto';
|
|
20
|
+
container.style.maxWidth = 'none';
|
|
21
|
+
container.style.minWidth = 'auto';
|
|
22
|
+
container.className = 'nile-dropdown-portal-append';
|
|
23
|
+
return container;
|
|
24
|
+
}
|
|
25
|
+
positionPortalAppend() {
|
|
26
|
+
if (!this.portalContainer || !this.component.open)
|
|
27
|
+
return;
|
|
28
|
+
this.measurePanelHeight();
|
|
29
|
+
this.computeFloatingUIPosition();
|
|
30
|
+
}
|
|
31
|
+
measurePanelHeight() {
|
|
32
|
+
if (this.measuredPanelHeight || !this.portalContainer)
|
|
33
|
+
return;
|
|
34
|
+
this.portalContainer.style.position = 'absolute';
|
|
35
|
+
this.portalContainer.style.visibility = 'hidden';
|
|
36
|
+
this.portalContainer.style.top = '0px';
|
|
37
|
+
this.portalContainer.style.left = '0px';
|
|
38
|
+
this.portalContainer.offsetHeight;
|
|
39
|
+
this.measuredPanelHeight = this.portalContainer.offsetHeight;
|
|
40
|
+
this.portalContainer.style.visibility = '';
|
|
41
|
+
}
|
|
42
|
+
async computeFloatingUIPosition() {
|
|
43
|
+
if (!this.portalContainer)
|
|
44
|
+
return;
|
|
45
|
+
const referenceElement = this.component.shadowRoot?.querySelector('[slot="anchor"]')?.assignedElements({ flatten: true })[0] ||
|
|
46
|
+
this.component.querySelector('[slot="trigger"]')?.assignedElements({ flatten: true })[0] ||
|
|
47
|
+
this.component;
|
|
48
|
+
const floatingElement = this.portalContainer;
|
|
49
|
+
try {
|
|
50
|
+
const { x, y, placement, middlewareData } = await this.calculateFloatingUIPosition(referenceElement, floatingElement);
|
|
51
|
+
this.applyFloatingUIPosition(floatingElement, referenceElement, x, y, placement, middlewareData);
|
|
52
|
+
}
|
|
53
|
+
catch (error) {
|
|
54
|
+
console.warn('Floating UI positioning failed, falling back to simple positioning:', error);
|
|
55
|
+
this.fallbackPositioning();
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
async calculateFloatingUIPosition(referenceElement, floatingElement) {
|
|
59
|
+
const boundary = PortalUtils.findBoundaryElements(referenceElement);
|
|
60
|
+
const initialPlacement = this.getInitialPlacement();
|
|
61
|
+
const middleware = this.createFloatingUIMiddleware(boundary);
|
|
62
|
+
return await computePosition(referenceElement, floatingElement, {
|
|
63
|
+
placement: initialPlacement,
|
|
64
|
+
strategy: 'fixed',
|
|
65
|
+
middleware,
|
|
66
|
+
platform: this.createCustomPlatform()
|
|
67
|
+
});
|
|
68
|
+
}
|
|
69
|
+
getInitialPlacement() {
|
|
70
|
+
return this.component.placement || 'bottom-start';
|
|
71
|
+
}
|
|
72
|
+
createFloatingUIMiddleware(boundary) {
|
|
73
|
+
const middleware = [
|
|
74
|
+
offset(this.component.distance || 0),
|
|
75
|
+
];
|
|
76
|
+
// Add size middleware if sync is specified
|
|
77
|
+
if (this.component.sync) {
|
|
78
|
+
middleware.push(size({
|
|
79
|
+
apply: this.handleSizeMiddleware.bind(this),
|
|
80
|
+
padding: 10,
|
|
81
|
+
boundary: boundary
|
|
82
|
+
}));
|
|
83
|
+
}
|
|
84
|
+
// Add flip middleware
|
|
85
|
+
middleware.push(flip({
|
|
86
|
+
fallbackPlacements: this.getFallbackPlacements(),
|
|
87
|
+
fallbackStrategy: 'bestFit',
|
|
88
|
+
padding: 10,
|
|
89
|
+
boundary: boundary
|
|
90
|
+
}));
|
|
91
|
+
// Add shift middleware
|
|
92
|
+
middleware.push(shift({
|
|
93
|
+
padding: 10,
|
|
94
|
+
crossAxis: true,
|
|
95
|
+
boundary: boundary
|
|
96
|
+
}));
|
|
97
|
+
return middleware;
|
|
98
|
+
}
|
|
99
|
+
handleSizeMiddleware({ availableWidth, availableHeight, elements, rects }) {
|
|
100
|
+
const maxHeight = PortalUtils.calculateOptimalHeight(rects.reference, window.innerHeight, this.currentPlacement);
|
|
101
|
+
if (this.component.sync === 'width' || this.component.sync === 'both') {
|
|
102
|
+
elements.floating.style.width = `${rects.reference.width}px`;
|
|
103
|
+
}
|
|
104
|
+
if (this.component.sync === 'height' || this.component.sync === 'both') {
|
|
105
|
+
elements.floating.style.height = `${rects.reference.height}px`;
|
|
106
|
+
}
|
|
107
|
+
elements.floating.style.maxHeight = `${maxHeight}px`;
|
|
108
|
+
elements.floating.style.setProperty('--auto-size-available-width', `${availableWidth}px`);
|
|
109
|
+
elements.floating.style.setProperty('--auto-size-available-height', `${maxHeight}px`);
|
|
110
|
+
}
|
|
111
|
+
getFallbackPlacements() {
|
|
112
|
+
const basePlacement = this.component.placement || 'bottom-start';
|
|
113
|
+
const placements = [];
|
|
114
|
+
if (basePlacement.startsWith('top')) {
|
|
115
|
+
placements.push('bottom-start', 'bottom', 'bottom-end', 'top', 'top-end', 'right-start', 'left-start');
|
|
116
|
+
}
|
|
117
|
+
else if (basePlacement.startsWith('bottom')) {
|
|
118
|
+
placements.push('top-start', 'top', 'top-end', 'bottom', 'bottom-end', 'right-start', 'left-start');
|
|
119
|
+
}
|
|
120
|
+
else if (basePlacement.startsWith('left')) {
|
|
121
|
+
placements.push('right-start', 'right', 'right-end', 'left', 'left-end', 'top-start', 'bottom-start');
|
|
122
|
+
}
|
|
123
|
+
else if (basePlacement.startsWith('right')) {
|
|
124
|
+
placements.push('left-start', 'left', 'left-end', 'right', 'right-end', 'top-start', 'bottom-start');
|
|
125
|
+
}
|
|
126
|
+
return placements;
|
|
127
|
+
}
|
|
128
|
+
createCustomPlatform() {
|
|
129
|
+
return platform;
|
|
130
|
+
}
|
|
131
|
+
applyFloatingUIPosition(floatingElement, referenceElement, x, y, placement, middlewareData) {
|
|
132
|
+
const referenceRect = referenceElement.getBoundingClientRect();
|
|
133
|
+
Object.assign(floatingElement.style, {
|
|
134
|
+
left: `${x}px`,
|
|
135
|
+
top: `${y}px`,
|
|
136
|
+
position: 'fixed',
|
|
137
|
+
pointerEvents: 'auto',
|
|
138
|
+
width: 'auto',
|
|
139
|
+
minWidth: 'auto'
|
|
140
|
+
});
|
|
141
|
+
// Apply sync width if needed
|
|
142
|
+
if (this.component.sync === 'width' || this.component.sync === 'both') {
|
|
143
|
+
floatingElement.style.width = `${referenceRect.width}px`;
|
|
144
|
+
}
|
|
145
|
+
this.currentPlacement = placement;
|
|
146
|
+
this.currentMiddlewareData = middlewareData;
|
|
147
|
+
PortalUtils.applyCollisionData(floatingElement, middlewareData, placement);
|
|
148
|
+
const placementClass = placement.split('-')[0];
|
|
149
|
+
floatingElement.className = `nile-dropdown-portal-append dropdown--open dropdown__panel--${placementClass}`;
|
|
150
|
+
}
|
|
151
|
+
fallbackPositioning() {
|
|
152
|
+
if (!this.portalContainer)
|
|
153
|
+
return;
|
|
154
|
+
const referenceElement = this.component.shadowRoot?.querySelector('[slot="anchor"]')?.assignedElements({ flatten: true })[0] ||
|
|
155
|
+
this.component.querySelector('[slot="trigger"]')?.assignedElements({ flatten: true })[0] ||
|
|
156
|
+
this.component;
|
|
157
|
+
const rect = referenceElement.getBoundingClientRect();
|
|
158
|
+
const viewportHeight = window.innerHeight;
|
|
159
|
+
const viewportWidth = window.innerWidth;
|
|
160
|
+
const spaceBelow = viewportHeight - rect.bottom;
|
|
161
|
+
const spaceAbove = rect.top;
|
|
162
|
+
const spaceRight = viewportWidth - rect.right;
|
|
163
|
+
const spaceLeft = rect.left;
|
|
164
|
+
let topPosition;
|
|
165
|
+
let leftPosition = rect.left;
|
|
166
|
+
let placementClass;
|
|
167
|
+
let maxHeight;
|
|
168
|
+
const placement = this.component.placement || 'bottom-start';
|
|
169
|
+
if (placement.startsWith('bottom')) {
|
|
170
|
+
maxHeight = Math.max(spaceBelow - 20, 100);
|
|
171
|
+
topPosition = rect.bottom + (this.component.distance || 0);
|
|
172
|
+
placementClass = 'bottom';
|
|
173
|
+
}
|
|
174
|
+
else if (placement.startsWith('top')) {
|
|
175
|
+
maxHeight = Math.max(spaceAbove - 20, 100);
|
|
176
|
+
topPosition = Math.max(rect.top - maxHeight - (this.component.distance || 0), 10);
|
|
177
|
+
placementClass = 'top';
|
|
178
|
+
}
|
|
179
|
+
else if (placement.startsWith('right')) {
|
|
180
|
+
maxHeight = Math.max(Math.min(spaceRight, spaceBelow, spaceAbove) - 20, 100);
|
|
181
|
+
topPosition = rect.top;
|
|
182
|
+
leftPosition = rect.right + (this.component.distance || 0);
|
|
183
|
+
placementClass = 'right';
|
|
184
|
+
}
|
|
185
|
+
else {
|
|
186
|
+
maxHeight = Math.max(Math.min(spaceLeft, spaceBelow, spaceAbove) - 20, 100);
|
|
187
|
+
topPosition = rect.top;
|
|
188
|
+
leftPosition = Math.max(rect.left - 200 - (this.component.distance || 0), 10);
|
|
189
|
+
placementClass = 'left';
|
|
190
|
+
}
|
|
191
|
+
this.portalContainer.style.left = `${leftPosition}px`;
|
|
192
|
+
this.portalContainer.style.top = `${topPosition}px`;
|
|
193
|
+
this.portalContainer.style.maxHeight = `${maxHeight}px`;
|
|
194
|
+
this.portalContainer.style.pointerEvents = 'auto';
|
|
195
|
+
this.portalContainer.style.width = 'auto';
|
|
196
|
+
this.portalContainer.style.minWidth = 'auto';
|
|
197
|
+
if (this.component.sync === 'width' || this.component.sync === 'both') {
|
|
198
|
+
this.portalContainer.style.width = `${rect.width}px`;
|
|
199
|
+
}
|
|
200
|
+
this.portalContainer.className = `nile-dropdown-portal-append dropdown__panel--${placementClass}`;
|
|
201
|
+
this.calculateAndSetAutoSizeProperties(rect, topPosition, placementClass);
|
|
202
|
+
}
|
|
203
|
+
calculateAndSetAutoSizeProperties(rect, topPosition, placementClass) {
|
|
204
|
+
if (!this.portalContainer)
|
|
205
|
+
return;
|
|
206
|
+
const viewportHeight = window.innerHeight;
|
|
207
|
+
const viewportWidth = window.innerWidth;
|
|
208
|
+
let availableHeight;
|
|
209
|
+
let availableWidth = viewportWidth - rect.left - 10;
|
|
210
|
+
if (placementClass === 'top') {
|
|
211
|
+
availableHeight = rect.top - 10;
|
|
212
|
+
}
|
|
213
|
+
else if (placementClass === 'bottom') {
|
|
214
|
+
availableHeight = viewportHeight - rect.bottom - 10;
|
|
215
|
+
}
|
|
216
|
+
else if (placementClass === 'left') {
|
|
217
|
+
availableHeight = Math.min(viewportHeight - rect.top, rect.bottom);
|
|
218
|
+
availableWidth = rect.left - 10;
|
|
219
|
+
}
|
|
220
|
+
else {
|
|
221
|
+
availableHeight = Math.min(viewportHeight - rect.top, rect.bottom);
|
|
222
|
+
availableWidth = viewportWidth - rect.right - 10;
|
|
223
|
+
}
|
|
224
|
+
this.portalContainer.style.setProperty('--auto-size-available-height', `${Math.max(availableHeight, 100)}px`);
|
|
225
|
+
this.portalContainer.style.setProperty('--auto-size-available-width', `${Math.max(availableWidth, 200)}px`);
|
|
226
|
+
}
|
|
227
|
+
updatePortalAppendPosition() {
|
|
228
|
+
if (this.component.portal && this.portalContainer) {
|
|
229
|
+
this.positionPortalAppend();
|
|
230
|
+
}
|
|
231
|
+
}
|
|
232
|
+
handleWindowResize() {
|
|
233
|
+
if (this.component.portal && this.portalContainer) {
|
|
234
|
+
this.positionPortalAppend();
|
|
235
|
+
}
|
|
236
|
+
}
|
|
237
|
+
setupAutoUpdatePositioning() {
|
|
238
|
+
if (!this.portalContainer || !this.component)
|
|
239
|
+
return;
|
|
240
|
+
this.cleanupAutoUpdatePositioning();
|
|
241
|
+
const referenceElement = this.component.shadowRoot?.querySelector('[slot="anchor"]')?.assignedElements({ flatten: true })[0] ||
|
|
242
|
+
this.component.querySelector('[slot="trigger"]')?.assignedElements({ flatten: true })[0] ||
|
|
243
|
+
this.component;
|
|
244
|
+
this.cleanupAutoUpdate = autoUpdate(referenceElement, this.portalContainer, () => {
|
|
245
|
+
this.computeFloatingUIPosition();
|
|
246
|
+
}, {
|
|
247
|
+
ancestorScroll: true,
|
|
248
|
+
ancestorResize: true,
|
|
249
|
+
elementResize: true,
|
|
250
|
+
layoutShift: true,
|
|
251
|
+
animationFrame: true
|
|
252
|
+
});
|
|
253
|
+
}
|
|
254
|
+
cleanupAutoUpdatePositioning() {
|
|
255
|
+
if (this.cleanupAutoUpdate) {
|
|
256
|
+
this.cleanupAutoUpdate();
|
|
257
|
+
this.cleanupAutoUpdate = null;
|
|
258
|
+
}
|
|
259
|
+
}
|
|
260
|
+
injectStylesToDocument() {
|
|
261
|
+
if (!this.portalContainer)
|
|
262
|
+
return;
|
|
263
|
+
const styleId = PortalUtils.generateStyleId();
|
|
264
|
+
if (document.getElementById(styleId))
|
|
265
|
+
return;
|
|
266
|
+
const componentStyles = this.component.constructor.styles;
|
|
267
|
+
if (!componentStyles)
|
|
268
|
+
return;
|
|
269
|
+
const styleElement = document.createElement('style');
|
|
270
|
+
styleElement.id = styleId;
|
|
271
|
+
styleElement.textContent = PortalUtils.extractStylesAsCSS(componentStyles);
|
|
272
|
+
document.head.appendChild(styleElement);
|
|
273
|
+
this.portalContainer.__injectedStyleId = styleId;
|
|
274
|
+
}
|
|
275
|
+
adoptStylesToPortalAppend() {
|
|
276
|
+
if (!this.portalContainer)
|
|
277
|
+
return;
|
|
278
|
+
this.injectStylesToDocument();
|
|
279
|
+
}
|
|
280
|
+
setupPortalAppend() {
|
|
281
|
+
if (!this.component.portal)
|
|
282
|
+
return;
|
|
283
|
+
this.component.updateComplete.then(() => {
|
|
284
|
+
setTimeout(() => {
|
|
285
|
+
if (this.component.open) {
|
|
286
|
+
this.clonedPanel = this.createPortalPanel();
|
|
287
|
+
this.portalContainer = this.createPortalAppendContainer();
|
|
288
|
+
this.portalContainer.appendChild(this.clonedPanel);
|
|
289
|
+
document.body.appendChild(this.portalContainer);
|
|
290
|
+
this.adoptStylesToPortalAppend();
|
|
291
|
+
this.clonedPanel.style.display = '';
|
|
292
|
+
this.positionPortalAppend();
|
|
293
|
+
this.setupPortalEventListeners();
|
|
294
|
+
this.setupAutoUpdatePositioning();
|
|
295
|
+
this.boundHandleWindowResize = this.handleWindowResize.bind(this);
|
|
296
|
+
window.addEventListener('resize', this.boundHandleWindowResize);
|
|
297
|
+
}
|
|
298
|
+
}, 10);
|
|
299
|
+
});
|
|
300
|
+
}
|
|
301
|
+
createPortalPanel() {
|
|
302
|
+
return PortalContentUtils.createPortalPanel(this.component);
|
|
303
|
+
}
|
|
304
|
+
setupPortalEventListeners() {
|
|
305
|
+
PortalEventUtils.setupPortalEventListeners(this.clonedPanel, this.component);
|
|
306
|
+
}
|
|
307
|
+
cleanupPortalAppend() {
|
|
308
|
+
this.cleanupAutoUpdatePositioning();
|
|
309
|
+
if (this.portalContainer && this.portalContainer.parentNode) {
|
|
310
|
+
const injectedStyleId = this.portalContainer.__injectedStyleId;
|
|
311
|
+
if (injectedStyleId) {
|
|
312
|
+
const styleElement = document.getElementById(injectedStyleId);
|
|
313
|
+
if (styleElement) {
|
|
314
|
+
styleElement.remove();
|
|
315
|
+
}
|
|
316
|
+
}
|
|
317
|
+
this.portalContainer.parentNode.removeChild(this.portalContainer);
|
|
318
|
+
}
|
|
319
|
+
if (this.boundHandleWindowResize) {
|
|
320
|
+
window.removeEventListener('resize', this.boundHandleWindowResize);
|
|
321
|
+
this.boundHandleWindowResize = null;
|
|
322
|
+
}
|
|
323
|
+
this.portalContainer = null;
|
|
324
|
+
this.clonedPanel = null;
|
|
325
|
+
this.measuredPanelHeight = null;
|
|
326
|
+
this.currentPlacement = 'bottom-start';
|
|
327
|
+
this.currentMiddlewareData = null;
|
|
328
|
+
}
|
|
329
|
+
get portalContainerElement() {
|
|
330
|
+
return this.portalContainer;
|
|
331
|
+
}
|
|
332
|
+
resetMeasuredHeight() {
|
|
333
|
+
this.measuredPanelHeight = null;
|
|
334
|
+
}
|
|
335
|
+
forceReposition() {
|
|
336
|
+
if (this.portalContainer) {
|
|
337
|
+
this.computeFloatingUIPosition();
|
|
338
|
+
}
|
|
339
|
+
}
|
|
340
|
+
getCurrentPlacement() {
|
|
341
|
+
return this.currentPlacement;
|
|
342
|
+
}
|
|
343
|
+
getCurrentMiddlewareData() {
|
|
344
|
+
return this.currentMiddlewareData;
|
|
345
|
+
}
|
|
346
|
+
isUsingFloatingUI() {
|
|
347
|
+
return this.cleanupAutoUpdate !== null;
|
|
348
|
+
}
|
|
349
|
+
isPositioningOptimal() {
|
|
350
|
+
if (!this.portalContainer || !this.currentMiddlewareData)
|
|
351
|
+
return true;
|
|
352
|
+
const referenceElement = this.component.shadowRoot?.querySelector('[slot="anchor"]')?.assignedElements({ flatten: true })[0] ||
|
|
353
|
+
this.component.querySelector('[slot="trigger"]')?.assignedElements({ flatten: true })[0] ||
|
|
354
|
+
this.component;
|
|
355
|
+
const rect = referenceElement.getBoundingClientRect();
|
|
356
|
+
const viewportHeight = window.innerHeight;
|
|
357
|
+
const spaceBelow = viewportHeight - rect.bottom;
|
|
358
|
+
const spaceAbove = rect.top;
|
|
359
|
+
const isAbove = this.currentPlacement.startsWith('top');
|
|
360
|
+
const isBelow = this.currentPlacement.startsWith('bottom');
|
|
361
|
+
if (isAbove && spaceBelow > spaceAbove)
|
|
362
|
+
return false;
|
|
363
|
+
if (isBelow && spaceAbove > spaceBelow)
|
|
364
|
+
return false;
|
|
365
|
+
return true;
|
|
366
|
+
}
|
|
367
|
+
updatePortalPanel() {
|
|
368
|
+
if (this.portalContainer && this.clonedPanel) {
|
|
369
|
+
PortalContentUtils.updatePortalPanel(this.clonedPanel, this.component);
|
|
370
|
+
this.forceReposition();
|
|
371
|
+
}
|
|
372
|
+
}
|
|
373
|
+
}
|
|
374
|
+
//# sourceMappingURL=portal-manager.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"portal-manager.js","sourceRoot":"","sources":["../../../src/nile-side-bar-action/portal-manager.ts"],"names":[],"mappings":"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","sourcesContent":["import { \n autoUpdate, \n computePosition, \n flip, \n offset, \n shift, \n size,\n platform,\n type Placement,\n type MiddlewareData,\n type ComputePositionConfig\n } from '@floating-ui/dom';\n import { PortalUtils, PortalContentUtils, PortalEventUtils } from './portal-utils';\n \n export class DropdownPortalManager {\n private portalContainer: HTMLElement | null = null;\n private measuredPanelHeight: number | null = null;\n private component: any;\n private clonedPanel: HTMLElement | null = null;\n private cleanupAutoUpdate: (() => void) | null = null;\n private currentPlacement: Placement = 'bottom-start';\n private currentMiddlewareData: MiddlewareData | null = null;\n private boundHandleWindowResize: (() => void) | null = null;\n \n constructor(component: any) {\n this.component = component;\n }\n \n private createPortalAppendContainer(): HTMLElement {\n const container = document.createElement('div');\n container.style.position = 'absolute';\n container.style.zIndex = '9999';\n container.style.pointerEvents = 'none';\n container.style.width = 'auto';\n container.style.maxWidth = 'none';\n container.style.minWidth = 'auto';\n container.className = 'nile-dropdown-portal-append';\n return container;\n }\n \n positionPortalAppend(): void {\n if (!this.portalContainer || !this.component.open) return;\n \n this.measurePanelHeight();\n this.computeFloatingUIPosition();\n }\n \n private measurePanelHeight(): void {\n if (this.measuredPanelHeight || !this.portalContainer) return;\n \n this.portalContainer.style.position = 'absolute';\n this.portalContainer.style.visibility = 'hidden';\n this.portalContainer.style.top = '0px';\n this.portalContainer.style.left = '0px';\n \n this.portalContainer.offsetHeight;\n \n this.measuredPanelHeight = this.portalContainer.offsetHeight;\n \n this.portalContainer.style.visibility = '';\n }\n \n private async computeFloatingUIPosition(): Promise<void> {\n if (!this.portalContainer) return;\n \n const referenceElement = this.component.shadowRoot?.querySelector('[slot=\"anchor\"]')?.assignedElements({ flatten: true })[0] as HTMLElement || \n this.component.querySelector('[slot=\"trigger\"]')?.assignedElements({ flatten: true })[0] as HTMLElement ||\n this.component;\n const floatingElement = this.portalContainer;\n \n try {\n const { x, y, placement, middlewareData } = await this.calculateFloatingUIPosition(\n referenceElement,\n floatingElement\n );\n \n this.applyFloatingUIPosition(floatingElement, referenceElement, x, y, placement, middlewareData);\n \n } catch (error) {\n console.warn('Floating UI positioning failed, falling back to simple positioning:', error);\n this.fallbackPositioning();\n }\n }\n \n private async calculateFloatingUIPosition(\n referenceElement: HTMLElement,\n floatingElement: HTMLElement\n ): Promise<{ x: number; y: number; placement: Placement; middlewareData: MiddlewareData }> {\n const boundary = PortalUtils.findBoundaryElements(referenceElement);\n const initialPlacement = this.getInitialPlacement();\n const middleware = this.createFloatingUIMiddleware(boundary);\n \n return await computePosition(referenceElement, floatingElement, {\n placement: initialPlacement,\n strategy: 'fixed',\n middleware,\n platform: this.createCustomPlatform()\n });\n }\n \n private getInitialPlacement(): Placement {\n return this.component.placement || 'bottom-start';\n }\n \n private createFloatingUIMiddleware(boundary: Element[] | undefined): ComputePositionConfig['middleware'] {\n const middleware: ComputePositionConfig['middleware'] = [\n offset(this.component.distance || 0),\n ];\n \n // Add size middleware if sync is specified\n if (this.component.sync) {\n middleware.push(\n size({\n apply: this.handleSizeMiddleware.bind(this),\n padding: 10,\n boundary: boundary\n })\n );\n }\n \n // Add flip middleware\n middleware.push(\n flip({\n fallbackPlacements: this.getFallbackPlacements(),\n fallbackStrategy: 'bestFit',\n padding: 10,\n boundary: boundary\n })\n );\n \n // Add shift middleware\n middleware.push(\n shift({\n padding: 10,\n crossAxis: true,\n boundary: boundary\n })\n );\n \n return middleware;\n }\n \n private handleSizeMiddleware({ availableWidth, availableHeight, elements, rects }: {\n availableWidth: number;\n availableHeight: number;\n elements: { floating: HTMLElement };\n rects: { reference: { x: number; y: number; width: number; height: number } };\n }): void {\n const maxHeight = PortalUtils.calculateOptimalHeight(\n rects.reference,\n window.innerHeight,\n this.currentPlacement\n );\n \n if (this.component.sync === 'width' || this.component.sync === 'both') {\n elements.floating.style.width = `${rects.reference.width}px`;\n }\n if (this.component.sync === 'height' || this.component.sync === 'both') {\n elements.floating.style.height = `${rects.reference.height}px`;\n }\n \n elements.floating.style.maxHeight = `${maxHeight}px`;\n elements.floating.style.setProperty('--auto-size-available-width', `${availableWidth}px`);\n elements.floating.style.setProperty('--auto-size-available-height', `${maxHeight}px`);\n }\n \n private getFallbackPlacements(): Placement[] {\n const basePlacement = this.component.placement || 'bottom-start';\n const placements: Placement[] = [];\n \n if (basePlacement.startsWith('top')) {\n placements.push('bottom-start', 'bottom', 'bottom-end', 'top', 'top-end', 'right-start', 'left-start');\n } else if (basePlacement.startsWith('bottom')) {\n placements.push('top-start', 'top', 'top-end', 'bottom', 'bottom-end', 'right-start', 'left-start');\n } else if (basePlacement.startsWith('left')) {\n placements.push('right-start', 'right', 'right-end', 'left', 'left-end', 'top-start', 'bottom-start');\n } else if (basePlacement.startsWith('right')) {\n placements.push('left-start', 'left', 'left-end', 'right', 'right-end', 'top-start', 'bottom-start');\n }\n \n return placements;\n }\n \n private createCustomPlatform() {\n return platform;\n }\n \n private applyFloatingUIPosition(\n floatingElement: HTMLElement,\n referenceElement: HTMLElement,\n x: number,\n y: number,\n placement: Placement,\n middlewareData: MiddlewareData\n ): void {\n const referenceRect = referenceElement.getBoundingClientRect();\n \n Object.assign(floatingElement.style, {\n left: `${x}px`,\n top: `${y}px`,\n position: 'fixed',\n pointerEvents: 'auto',\n width: 'auto',\n minWidth: 'auto'\n });\n \n // Apply sync width if needed\n if (this.component.sync === 'width' || this.component.sync === 'both') {\n floatingElement.style.width = `${referenceRect.width}px`;\n }\n \n this.currentPlacement = placement;\n this.currentMiddlewareData = middlewareData;\n \n PortalUtils.applyCollisionData(floatingElement, middlewareData, placement);\n \n const placementClass = placement.split('-')[0];\n floatingElement.className = `nile-dropdown-portal-append dropdown--open dropdown__panel--${placementClass}`;\n }\n \n private fallbackPositioning(): void {\n if (!this.portalContainer) return;\n \n const referenceElement = this.component.shadowRoot?.querySelector('[slot=\"anchor\"]')?.assignedElements({ flatten: true })[0] as HTMLElement || \n this.component.querySelector('[slot=\"trigger\"]')?.assignedElements({ flatten: true })[0] as HTMLElement ||\n this.component;\n const rect = referenceElement.getBoundingClientRect();\n const viewportHeight = window.innerHeight;\n const viewportWidth = window.innerWidth;\n \n const spaceBelow = viewportHeight - rect.bottom;\n const spaceAbove = rect.top;\n const spaceRight = viewportWidth - rect.right;\n const spaceLeft = rect.left;\n \n let topPosition: number;\n let leftPosition: number = rect.left;\n let placementClass: string;\n let maxHeight: number;\n \n const placement = this.component.placement || 'bottom-start';\n \n if (placement.startsWith('bottom')) {\n maxHeight = Math.max(spaceBelow - 20, 100);\n topPosition = rect.bottom + (this.component.distance || 0);\n placementClass = 'bottom';\n } else if (placement.startsWith('top')) {\n maxHeight = Math.max(spaceAbove - 20, 100);\n topPosition = Math.max(rect.top - maxHeight - (this.component.distance || 0), 10);\n placementClass = 'top';\n } else if (placement.startsWith('right')) {\n maxHeight = Math.max(Math.min(spaceRight, spaceBelow, spaceAbove) - 20, 100);\n topPosition = rect.top;\n leftPosition = rect.right + (this.component.distance || 0);\n placementClass = 'right';\n } else {\n maxHeight = Math.max(Math.min(spaceLeft, spaceBelow, spaceAbove) - 20, 100);\n topPosition = rect.top;\n leftPosition = Math.max(rect.left - 200 - (this.component.distance || 0), 10);\n placementClass = 'left';\n }\n \n this.portalContainer.style.left = `${leftPosition}px`;\n this.portalContainer.style.top = `${topPosition}px`;\n this.portalContainer.style.maxHeight = `${maxHeight}px`;\n this.portalContainer.style.pointerEvents = 'auto';\n this.portalContainer.style.width = 'auto';\n this.portalContainer.style.minWidth = 'auto';\n \n if (this.component.sync === 'width' || this.component.sync === 'both') {\n this.portalContainer.style.width = `${rect.width}px`;\n }\n \n this.portalContainer.className = `nile-dropdown-portal-append dropdown__panel--${placementClass}`;\n \n this.calculateAndSetAutoSizeProperties(rect, topPosition, placementClass);\n }\n \n private calculateAndSetAutoSizeProperties(rect: DOMRect, topPosition: number, placementClass: string): void {\n if (!this.portalContainer) return;\n \n const viewportHeight = window.innerHeight;\n const viewportWidth = window.innerWidth;\n \n let availableHeight: number;\n let availableWidth: number = viewportWidth - rect.left - 10;\n \n if (placementClass === 'top') {\n availableHeight = rect.top - 10;\n } else if (placementClass === 'bottom') {\n availableHeight = viewportHeight - rect.bottom - 10;\n } else if (placementClass === 'left') {\n availableHeight = Math.min(viewportHeight - rect.top, rect.bottom);\n availableWidth = rect.left - 10;\n } else {\n availableHeight = Math.min(viewportHeight - rect.top, rect.bottom);\n availableWidth = viewportWidth - rect.right - 10;\n }\n \n this.portalContainer.style.setProperty('--auto-size-available-height', `${Math.max(availableHeight, 100)}px`);\n this.portalContainer.style.setProperty('--auto-size-available-width', `${Math.max(availableWidth, 200)}px`);\n }\n \n updatePortalAppendPosition(): void {\n if (this.component.portal && this.portalContainer) {\n this.positionPortalAppend();\n }\n }\n \n handleWindowResize(): void {\n if (this.component.portal && this.portalContainer) {\n this.positionPortalAppend();\n }\n }\n \n private setupAutoUpdatePositioning(): void {\n if (!this.portalContainer || !this.component) return;\n \n this.cleanupAutoUpdatePositioning();\n \n const referenceElement = this.component.shadowRoot?.querySelector('[slot=\"anchor\"]')?.assignedElements({ flatten: true })[0] as HTMLElement || \n this.component.querySelector('[slot=\"trigger\"]')?.assignedElements({ flatten: true })[0] as HTMLElement ||\n this.component;\n \n this.cleanupAutoUpdate = autoUpdate(\n referenceElement,\n this.portalContainer,\n () => {\n this.computeFloatingUIPosition();\n },\n {\n ancestorScroll: true,\n ancestorResize: true,\n elementResize: true,\n layoutShift: true,\n animationFrame: true\n }\n );\n }\n \n private cleanupAutoUpdatePositioning(): void {\n if (this.cleanupAutoUpdate) {\n this.cleanupAutoUpdate();\n this.cleanupAutoUpdate = null;\n }\n }\n \n private injectStylesToDocument(): void {\n if (!this.portalContainer) return;\n \n const styleId = PortalUtils.generateStyleId();\n \n if (document.getElementById(styleId)) return;\n \n const componentStyles = (this.component.constructor as any).styles;\n if (!componentStyles) return;\n \n const styleElement = document.createElement('style');\n styleElement.id = styleId;\n styleElement.textContent = PortalUtils.extractStylesAsCSS(componentStyles);\n \n document.head.appendChild(styleElement);\n \n (this.portalContainer as any).__injectedStyleId = styleId;\n }\n \n private adoptStylesToPortalAppend(): void {\n if (!this.portalContainer) return;\n this.injectStylesToDocument();\n }\n \n setupPortalAppend(): void {\n if (!this.component.portal) return;\n \n this.component.updateComplete.then(() => {\n setTimeout(() => {\n if (this.component.open) {\n this.clonedPanel = this.createPortalPanel();\n \n this.portalContainer = this.createPortalAppendContainer();\n this.portalContainer.appendChild(this.clonedPanel);\n document.body.appendChild(this.portalContainer);\n \n this.adoptStylesToPortalAppend();\n \n this.clonedPanel.style.display = '';\n this.positionPortalAppend();\n \n this.setupPortalEventListeners();\n \n this.setupAutoUpdatePositioning();\n \n this.boundHandleWindowResize = this.handleWindowResize.bind(this);\n window.addEventListener('resize', this.boundHandleWindowResize);\n }\n }, 10);\n });\n }\n \n private createPortalPanel(): HTMLElement {\n return PortalContentUtils.createPortalPanel(this.component);\n }\n \n private setupPortalEventListeners(): void {\n PortalEventUtils.setupPortalEventListeners(this.clonedPanel!, this.component);\n }\n \n cleanupPortalAppend(): void {\n this.cleanupAutoUpdatePositioning();\n \n if (this.portalContainer && this.portalContainer.parentNode) {\n const injectedStyleId = (this.portalContainer as any).__injectedStyleId;\n if (injectedStyleId) {\n const styleElement = document.getElementById(injectedStyleId);\n if (styleElement) {\n styleElement.remove();\n }\n }\n \n this.portalContainer.parentNode.removeChild(this.portalContainer);\n }\n \n if (this.boundHandleWindowResize) {\n window.removeEventListener('resize', this.boundHandleWindowResize);\n this.boundHandleWindowResize = null;\n }\n \n this.portalContainer = null;\n this.clonedPanel = null;\n this.measuredPanelHeight = null;\n this.currentPlacement = 'bottom-start';\n this.currentMiddlewareData = null;\n }\n \n get portalContainerElement(): HTMLElement | null {\n return this.portalContainer;\n }\n \n resetMeasuredHeight(): void {\n this.measuredPanelHeight = null;\n }\n \n forceReposition(): void {\n if (this.portalContainer) {\n this.computeFloatingUIPosition();\n }\n }\n \n getCurrentPlacement(): Placement {\n return this.currentPlacement;\n }\n \n getCurrentMiddlewareData(): MiddlewareData | null {\n return this.currentMiddlewareData;\n }\n \n isUsingFloatingUI(): boolean {\n return this.cleanupAutoUpdate !== null;\n }\n \n isPositioningOptimal(): boolean {\n if (!this.portalContainer || !this.currentMiddlewareData) return true;\n \n const referenceElement = this.component.shadowRoot?.querySelector('[slot=\"anchor\"]')?.assignedElements({ flatten: true })[0] as HTMLElement || \n this.component.querySelector('[slot=\"trigger\"]')?.assignedElements({ flatten: true })[0] as HTMLElement ||\n this.component;\n const rect = referenceElement.getBoundingClientRect();\n const viewportHeight = window.innerHeight;\n const spaceBelow = viewportHeight - rect.bottom;\n const spaceAbove = rect.top;\n \n const isAbove = this.currentPlacement.startsWith('top');\n const isBelow = this.currentPlacement.startsWith('bottom');\n \n if (isAbove && spaceBelow > spaceAbove) return false;\n if (isBelow && spaceAbove > spaceBelow) return false;\n \n return true;\n }\n \n updatePortalPanel(): void {\n if (this.portalContainer && this.clonedPanel) {\n PortalContentUtils.updatePortalPanel(this.clonedPanel, this.component);\n this.forceReposition();\n }\n }\n }\n \n "]}
|
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { type Placement, type MiddlewareData } from '@floating-ui/dom';
|
|
2
|
+
export declare class PortalUtils {
|
|
3
|
+
static calculateAvailableSpace(referenceElement: HTMLElement): {
|
|
4
|
+
spaceAbove: number;
|
|
5
|
+
spaceBelow: number;
|
|
6
|
+
spaceLeft: number;
|
|
7
|
+
spaceRight: number;
|
|
8
|
+
viewportHeight: number;
|
|
9
|
+
viewportWidth: number;
|
|
10
|
+
};
|
|
11
|
+
static getOptimalPlacement(referenceElement: HTMLElement): Placement;
|
|
12
|
+
static findBoundaryElements(component: HTMLElement): Element[] | undefined;
|
|
13
|
+
static calculateOptimalHeight(referenceRect: {
|
|
14
|
+
x: number;
|
|
15
|
+
y: number;
|
|
16
|
+
width: number;
|
|
17
|
+
height: number;
|
|
18
|
+
}, viewportHeight: number, placement: Placement): number;
|
|
19
|
+
static extractStylesAsCSS(styles: any): string;
|
|
20
|
+
static generateStyleId(): string;
|
|
21
|
+
static isPositioningOptimal(placement: Placement, referenceElement: HTMLElement): boolean;
|
|
22
|
+
static applyCollisionData(element: HTMLElement, middlewareData: MiddlewareData, placement: Placement): void;
|
|
23
|
+
}
|
|
24
|
+
export declare class PortalContentUtils {
|
|
25
|
+
static createPortalPanel(component: any): HTMLElement;
|
|
26
|
+
static updatePortalPanel(clonedPanel: HTMLElement, component: any): void;
|
|
27
|
+
}
|
|
28
|
+
export declare class PortalEventUtils {
|
|
29
|
+
static setupPortalEventListeners(clonedPanel: HTMLElement, component: any): void;
|
|
30
|
+
static setupMenuSelectListeners(clonedPanel: HTMLElement, component: any): void;
|
|
31
|
+
static setupKeyDownListeners(clonedPanel: HTMLElement, component: any): void;
|
|
32
|
+
}
|