material 1.0.2 → 1.0.3
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/package.json +1 -1
- package/src/menu.js +45 -3
package/package.json
CHANGED
package/src/menu.js
CHANGED
|
@@ -37,6 +37,7 @@ class Menu extends Control {
|
|
|
37
37
|
setup () {
|
|
38
38
|
this.menus = []
|
|
39
39
|
this.closeTimeout = null
|
|
40
|
+
this.closeDelay = 300
|
|
40
41
|
|
|
41
42
|
document.addEventListener('click', this.handleDocumentClick)
|
|
42
43
|
}
|
|
@@ -64,8 +65,26 @@ class Menu extends Control {
|
|
|
64
65
|
item = new Element(obj)
|
|
65
66
|
|
|
66
67
|
item.addEventListener('mouseenter', () => {
|
|
67
|
-
if (
|
|
68
|
-
|
|
68
|
+
if (obj.items && Array.isArray(obj.items)) {
|
|
69
|
+
// Clear any pending close timeout when entering submenu trigger
|
|
70
|
+
if (this.closeTimeout) {
|
|
71
|
+
clearTimeout(this.closeTimeout)
|
|
72
|
+
this.closeTimeout = null
|
|
73
|
+
}
|
|
74
|
+
} else {
|
|
75
|
+
// For non-submenu items, schedule submenu close with delay
|
|
76
|
+
if (this.menu) {
|
|
77
|
+
if (this.closeTimeout) {
|
|
78
|
+
clearTimeout(this.closeTimeout)
|
|
79
|
+
}
|
|
80
|
+
this.closeTimeout = setTimeout(() => {
|
|
81
|
+
if (this.menu) {
|
|
82
|
+
this.menu.destroy()
|
|
83
|
+
this.menu = null
|
|
84
|
+
}
|
|
85
|
+
this.closeTimeout = null
|
|
86
|
+
}, this.closeDelay)
|
|
87
|
+
}
|
|
69
88
|
}
|
|
70
89
|
})
|
|
71
90
|
|
|
@@ -73,6 +92,18 @@ class Menu extends Control {
|
|
|
73
92
|
item.classList.add('sub')
|
|
74
93
|
|
|
75
94
|
item.addEventListener('mouseenter', () => {
|
|
95
|
+
// Clear any pending close timeout
|
|
96
|
+
if (this.closeTimeout) {
|
|
97
|
+
clearTimeout(this.closeTimeout)
|
|
98
|
+
this.closeTimeout = null
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
// Destroy existing submenu before creating new one
|
|
102
|
+
if (this.menu) {
|
|
103
|
+
this.menu.destroy()
|
|
104
|
+
this.menu = null
|
|
105
|
+
}
|
|
106
|
+
|
|
76
107
|
this.menu = new Menu({
|
|
77
108
|
class: 'floating',
|
|
78
109
|
target: item,
|
|
@@ -87,6 +118,14 @@ class Menu extends Control {
|
|
|
87
118
|
offsetY: 8
|
|
88
119
|
}).show()
|
|
89
120
|
|
|
121
|
+
// When mouse enters the submenu, cancel any close timeout
|
|
122
|
+
this.menu.element.addEventListener('mouseenter', () => {
|
|
123
|
+
if (this.closeTimeout) {
|
|
124
|
+
clearTimeout(this.closeTimeout)
|
|
125
|
+
this.closeTimeout = null
|
|
126
|
+
}
|
|
127
|
+
})
|
|
128
|
+
|
|
90
129
|
this.menu.on('select', (value, name) => {
|
|
91
130
|
this.emit('select', `${obj.name}:${value}`, name)
|
|
92
131
|
}).on('destroy', () => {
|
|
@@ -122,7 +161,10 @@ class Menu extends Control {
|
|
|
122
161
|
}
|
|
123
162
|
|
|
124
163
|
close () {
|
|
125
|
-
|
|
164
|
+
if (this.closeTimeout) {
|
|
165
|
+
clearTimeout(this.closeTimeout)
|
|
166
|
+
this.closeTimeout = null
|
|
167
|
+
}
|
|
126
168
|
this.menus.forEach(menu => {
|
|
127
169
|
menu.destroy()
|
|
128
170
|
})
|