@ne1410s/menu 0.1.2 → 0.1.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/index.d.ts +2 -2
- package/dist/menu/menu.d.ts +18 -18
- package/dist/models.d.ts +5 -5
- package/dist/ne14_menu.cjs.min.js +162 -162
- package/dist/ne14_menu.esm.min.js +162 -162
- package/dist/ne14_menu.umd.min.js +392 -392
- package/package.json +8 -8
|
@@ -29,413 +29,413 @@
|
|
|
29
29
|
return to.concat(ar || Array.prototype.slice.call(from));
|
|
30
30
|
}
|
|
31
31
|
|
|
32
|
-
var ChainedQuery = /** @class */ (function () {
|
|
33
|
-
function ChainedQuery(mapper) {
|
|
34
|
-
var sources = [];
|
|
35
|
-
for (var _i = 1; _i < arguments.length; _i++) {
|
|
36
|
-
sources[_i - 1] = arguments[_i];
|
|
37
|
-
}
|
|
38
|
-
var _this = this;
|
|
39
|
-
this.mapper = mapper;
|
|
40
|
-
this._items = [];
|
|
41
|
-
this.get = function (index) { return _this._items[index]; };
|
|
42
|
-
this.add.apply(this, sources);
|
|
43
|
-
}
|
|
44
|
-
Object.defineProperty(ChainedQuery.prototype, "targets", {
|
|
45
|
-
get: function () {
|
|
46
|
-
return this._items.filter(function (it) { return it instanceof EventTarget; }).map(function (it) { return it; });
|
|
47
|
-
},
|
|
48
|
-
enumerable: false,
|
|
49
|
-
configurable: true
|
|
50
|
-
});
|
|
51
|
-
Object.defineProperty(ChainedQuery.prototype, "elements", {
|
|
52
|
-
get: function () {
|
|
53
|
-
return this._items.filter(function (it) { return it instanceof Element; }).map(function (it) { return it; });
|
|
54
|
-
},
|
|
55
|
-
enumerable: false,
|
|
56
|
-
configurable: true
|
|
57
|
-
});
|
|
58
|
-
Object.defineProperty(ChainedQuery.prototype, "nodes", {
|
|
59
|
-
get: function () {
|
|
60
|
-
return this._items.filter(function (it) { return it instanceof Node; }).map(function (it) { return it; });
|
|
61
|
-
},
|
|
62
|
-
enumerable: false,
|
|
63
|
-
configurable: true
|
|
64
|
-
});
|
|
65
|
-
Object.defineProperty(ChainedQuery.prototype, "containers", {
|
|
66
|
-
get: function () {
|
|
67
|
-
return this._items.map(function (it) { return it; }).filter(function (p) { return typeof p.append === 'function'; });
|
|
68
|
-
},
|
|
69
|
-
enumerable: false,
|
|
70
|
-
configurable: true
|
|
71
|
-
});
|
|
72
|
-
Object.defineProperty(ChainedQuery.prototype, "length", {
|
|
73
|
-
get: function () {
|
|
74
|
-
return this._items.length;
|
|
75
|
-
},
|
|
76
|
-
enumerable: false,
|
|
77
|
-
configurable: true
|
|
78
|
-
});
|
|
79
|
-
ChainedQuery.prototype.add = function () {
|
|
80
|
-
var _a;
|
|
81
|
-
var sources = [];
|
|
82
|
-
for (var _i = 0; _i < arguments.length; _i++) {
|
|
83
|
-
sources[_i] = arguments[_i];
|
|
84
|
-
}
|
|
85
|
-
(_a = this._items).push.apply(_a, this.mapper.Map(sources));
|
|
86
|
-
return this;
|
|
87
|
-
};
|
|
88
|
-
// TODO: This must not fall over if trying to perform an action
|
|
89
|
-
// on an inappropriate type. eg setting an attribute on window, or
|
|
90
|
-
// trying to query a non-parent node..
|
|
91
|
-
ChainedQuery.prototype.each = function (func) {
|
|
92
|
-
this._items.forEach(function (item, i) { return func(item, i); });
|
|
93
|
-
return this;
|
|
94
|
-
};
|
|
95
|
-
ChainedQuery.prototype.prop = function (name, value) {
|
|
96
|
-
return this.each(function (item) {
|
|
97
|
-
if (name in item) {
|
|
98
|
-
item[name] = value;
|
|
99
|
-
}
|
|
100
|
-
});
|
|
101
|
-
};
|
|
102
|
-
//#region Targets
|
|
103
|
-
ChainedQuery.prototype.fire = function (eventName, detail) {
|
|
104
|
-
var evt = new CustomEvent(eventName, { detail: detail });
|
|
105
|
-
this.targets.forEach(function (t) { return t.dispatchEvent(evt); });
|
|
106
|
-
return this;
|
|
107
|
-
};
|
|
108
|
-
ChainedQuery.prototype.on = function (eventNames, func) {
|
|
109
|
-
var evts = eventNames.split(ChainedQuery.WHITESPACE_RGX);
|
|
110
|
-
this.targets.forEach(function (t) {
|
|
111
|
-
evts.forEach(function (name) { return t.addEventListener(name, func); });
|
|
112
|
-
});
|
|
113
|
-
return this;
|
|
114
|
-
};
|
|
115
|
-
//#endregion
|
|
116
|
-
//#region Elements
|
|
117
|
-
ChainedQuery.prototype.attr = function (name, value, ns) {
|
|
118
|
-
this.elements.forEach(function (elem) {
|
|
119
|
-
if (value != null)
|
|
120
|
-
elem.setAttributeNS(ns, name, value);
|
|
121
|
-
else
|
|
122
|
-
elem.removeAttributeNS(ns, name);
|
|
123
|
-
});
|
|
124
|
-
return this;
|
|
125
|
-
};
|
|
126
|
-
ChainedQuery.prototype.toggle = function (className, doSet) {
|
|
127
|
-
this.elements.forEach(function (elem) {
|
|
128
|
-
var force = typeof doSet === 'function' ? doSet(elem) : !!doSet;
|
|
129
|
-
elem.classList.toggle(className, force);
|
|
130
|
-
});
|
|
131
|
-
return this;
|
|
132
|
-
};
|
|
133
|
-
//#endregion
|
|
134
|
-
//#region Nodes
|
|
135
|
-
ChainedQuery.prototype.empty = function () {
|
|
136
|
-
this.nodes.forEach(function (n) {
|
|
137
|
-
while (n.firstChild) {
|
|
138
|
-
n.removeChild(n.firstChild);
|
|
139
|
-
}
|
|
140
|
-
});
|
|
141
|
-
return this;
|
|
142
|
-
};
|
|
143
|
-
ChainedQuery.prototype.remove = function () {
|
|
144
|
-
return new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, this.mapper], this._items.filter(function (it) {
|
|
145
|
-
var handle = it instanceof Node;
|
|
146
|
-
if (handle)
|
|
147
|
-
it.parentNode.removeChild(it);
|
|
148
|
-
return !handle;
|
|
149
|
-
}), false)))();
|
|
150
|
-
};
|
|
151
|
-
//#endregion
|
|
152
|
-
//#region Containers
|
|
153
|
-
ChainedQuery.prototype.append = function () {
|
|
154
|
-
var sources = [];
|
|
155
|
-
for (var _i = 0; _i < arguments.length; _i++) {
|
|
156
|
-
sources[_i] = arguments[_i];
|
|
157
|
-
}
|
|
158
|
-
this.appendIn.apply(this, sources);
|
|
159
|
-
return this;
|
|
160
|
-
};
|
|
161
|
-
ChainedQuery.prototype.appendIn = function () {
|
|
162
|
-
var _this = this;
|
|
163
|
-
var sources = [];
|
|
164
|
-
for (var _i = 0; _i < arguments.length; _i++) {
|
|
165
|
-
sources[_i] = arguments[_i];
|
|
166
|
-
}
|
|
167
|
-
return new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, this.mapper], this.containers.reduce(function (acc, parent) {
|
|
168
|
-
var nodes = new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, _this.mapper], sources, false)))().nodes;
|
|
169
|
-
parent.append.apply(parent, nodes);
|
|
170
|
-
acc.push.apply(acc, nodes);
|
|
171
|
-
return acc;
|
|
172
|
-
}, []), false)))();
|
|
173
|
-
};
|
|
174
|
-
ChainedQuery.prototype.find = function (selector) {
|
|
175
|
-
return new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, this.mapper], this.containers.reduce(function (acc, parent) {
|
|
176
|
-
acc.push.apply(acc, Array.from(parent.querySelectorAll(selector)));
|
|
177
|
-
return acc;
|
|
178
|
-
}, []), false)))();
|
|
179
|
-
};
|
|
180
|
-
ChainedQuery.prototype.first = function (selector) {
|
|
181
|
-
return new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, this.mapper], this.containers.map(function (parent) { return parent.querySelector(selector); }).filter(function (found) { return !!found; }), false)))();
|
|
182
|
-
};
|
|
183
|
-
ChainedQuery.WHITESPACE_RGX = /\s+/;
|
|
184
|
-
return ChainedQuery;
|
|
32
|
+
var ChainedQuery = /** @class */ (function () {
|
|
33
|
+
function ChainedQuery(mapper) {
|
|
34
|
+
var sources = [];
|
|
35
|
+
for (var _i = 1; _i < arguments.length; _i++) {
|
|
36
|
+
sources[_i - 1] = arguments[_i];
|
|
37
|
+
}
|
|
38
|
+
var _this = this;
|
|
39
|
+
this.mapper = mapper;
|
|
40
|
+
this._items = [];
|
|
41
|
+
this.get = function (index) { return _this._items[index]; };
|
|
42
|
+
this.add.apply(this, sources);
|
|
43
|
+
}
|
|
44
|
+
Object.defineProperty(ChainedQuery.prototype, "targets", {
|
|
45
|
+
get: function () {
|
|
46
|
+
return this._items.filter(function (it) { return it instanceof EventTarget; }).map(function (it) { return it; });
|
|
47
|
+
},
|
|
48
|
+
enumerable: false,
|
|
49
|
+
configurable: true
|
|
50
|
+
});
|
|
51
|
+
Object.defineProperty(ChainedQuery.prototype, "elements", {
|
|
52
|
+
get: function () {
|
|
53
|
+
return this._items.filter(function (it) { return it instanceof Element; }).map(function (it) { return it; });
|
|
54
|
+
},
|
|
55
|
+
enumerable: false,
|
|
56
|
+
configurable: true
|
|
57
|
+
});
|
|
58
|
+
Object.defineProperty(ChainedQuery.prototype, "nodes", {
|
|
59
|
+
get: function () {
|
|
60
|
+
return this._items.filter(function (it) { return it instanceof Node; }).map(function (it) { return it; });
|
|
61
|
+
},
|
|
62
|
+
enumerable: false,
|
|
63
|
+
configurable: true
|
|
64
|
+
});
|
|
65
|
+
Object.defineProperty(ChainedQuery.prototype, "containers", {
|
|
66
|
+
get: function () {
|
|
67
|
+
return this._items.map(function (it) { return it; }).filter(function (p) { return typeof p.append === 'function'; });
|
|
68
|
+
},
|
|
69
|
+
enumerable: false,
|
|
70
|
+
configurable: true
|
|
71
|
+
});
|
|
72
|
+
Object.defineProperty(ChainedQuery.prototype, "length", {
|
|
73
|
+
get: function () {
|
|
74
|
+
return this._items.length;
|
|
75
|
+
},
|
|
76
|
+
enumerable: false,
|
|
77
|
+
configurable: true
|
|
78
|
+
});
|
|
79
|
+
ChainedQuery.prototype.add = function () {
|
|
80
|
+
var _a;
|
|
81
|
+
var sources = [];
|
|
82
|
+
for (var _i = 0; _i < arguments.length; _i++) {
|
|
83
|
+
sources[_i] = arguments[_i];
|
|
84
|
+
}
|
|
85
|
+
(_a = this._items).push.apply(_a, this.mapper.Map(sources));
|
|
86
|
+
return this;
|
|
87
|
+
};
|
|
88
|
+
// TODO: This must not fall over if trying to perform an action
|
|
89
|
+
// on an inappropriate type. eg setting an attribute on window, or
|
|
90
|
+
// trying to query a non-parent node..
|
|
91
|
+
ChainedQuery.prototype.each = function (func) {
|
|
92
|
+
this._items.forEach(function (item, i) { return func(item, i); });
|
|
93
|
+
return this;
|
|
94
|
+
};
|
|
95
|
+
ChainedQuery.prototype.prop = function (name, value) {
|
|
96
|
+
return this.each(function (item) {
|
|
97
|
+
if (name in item) {
|
|
98
|
+
item[name] = value;
|
|
99
|
+
}
|
|
100
|
+
});
|
|
101
|
+
};
|
|
102
|
+
//#region Targets
|
|
103
|
+
ChainedQuery.prototype.fire = function (eventName, detail) {
|
|
104
|
+
var evt = new CustomEvent(eventName, { detail: detail });
|
|
105
|
+
this.targets.forEach(function (t) { return t.dispatchEvent(evt); });
|
|
106
|
+
return this;
|
|
107
|
+
};
|
|
108
|
+
ChainedQuery.prototype.on = function (eventNames, func) {
|
|
109
|
+
var evts = eventNames.split(ChainedQuery.WHITESPACE_RGX);
|
|
110
|
+
this.targets.forEach(function (t) {
|
|
111
|
+
evts.forEach(function (name) { return t.addEventListener(name, func); });
|
|
112
|
+
});
|
|
113
|
+
return this;
|
|
114
|
+
};
|
|
115
|
+
//#endregion
|
|
116
|
+
//#region Elements
|
|
117
|
+
ChainedQuery.prototype.attr = function (name, value, ns) {
|
|
118
|
+
this.elements.forEach(function (elem) {
|
|
119
|
+
if (value != null)
|
|
120
|
+
elem.setAttributeNS(ns, name, value);
|
|
121
|
+
else
|
|
122
|
+
elem.removeAttributeNS(ns, name);
|
|
123
|
+
});
|
|
124
|
+
return this;
|
|
125
|
+
};
|
|
126
|
+
ChainedQuery.prototype.toggle = function (className, doSet) {
|
|
127
|
+
this.elements.forEach(function (elem) {
|
|
128
|
+
var force = typeof doSet === 'function' ? doSet(elem) : !!doSet;
|
|
129
|
+
elem.classList.toggle(className, force);
|
|
130
|
+
});
|
|
131
|
+
return this;
|
|
132
|
+
};
|
|
133
|
+
//#endregion
|
|
134
|
+
//#region Nodes
|
|
135
|
+
ChainedQuery.prototype.empty = function () {
|
|
136
|
+
this.nodes.forEach(function (n) {
|
|
137
|
+
while (n.firstChild) {
|
|
138
|
+
n.removeChild(n.firstChild);
|
|
139
|
+
}
|
|
140
|
+
});
|
|
141
|
+
return this;
|
|
142
|
+
};
|
|
143
|
+
ChainedQuery.prototype.remove = function () {
|
|
144
|
+
return new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, this.mapper], this._items.filter(function (it) {
|
|
145
|
+
var handle = it instanceof Node;
|
|
146
|
+
if (handle)
|
|
147
|
+
it.parentNode.removeChild(it);
|
|
148
|
+
return !handle;
|
|
149
|
+
}), false)))();
|
|
150
|
+
};
|
|
151
|
+
//#endregion
|
|
152
|
+
//#region Containers
|
|
153
|
+
ChainedQuery.prototype.append = function () {
|
|
154
|
+
var sources = [];
|
|
155
|
+
for (var _i = 0; _i < arguments.length; _i++) {
|
|
156
|
+
sources[_i] = arguments[_i];
|
|
157
|
+
}
|
|
158
|
+
this.appendIn.apply(this, sources);
|
|
159
|
+
return this;
|
|
160
|
+
};
|
|
161
|
+
ChainedQuery.prototype.appendIn = function () {
|
|
162
|
+
var _this = this;
|
|
163
|
+
var sources = [];
|
|
164
|
+
for (var _i = 0; _i < arguments.length; _i++) {
|
|
165
|
+
sources[_i] = arguments[_i];
|
|
166
|
+
}
|
|
167
|
+
return new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, this.mapper], this.containers.reduce(function (acc, parent) {
|
|
168
|
+
var nodes = new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, _this.mapper], sources, false)))().nodes;
|
|
169
|
+
parent.append.apply(parent, nodes);
|
|
170
|
+
acc.push.apply(acc, nodes);
|
|
171
|
+
return acc;
|
|
172
|
+
}, []), false)))();
|
|
173
|
+
};
|
|
174
|
+
ChainedQuery.prototype.find = function (selector) {
|
|
175
|
+
return new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, this.mapper], this.containers.reduce(function (acc, parent) {
|
|
176
|
+
acc.push.apply(acc, Array.from(parent.querySelectorAll(selector)));
|
|
177
|
+
return acc;
|
|
178
|
+
}, []), false)))();
|
|
179
|
+
};
|
|
180
|
+
ChainedQuery.prototype.first = function (selector) {
|
|
181
|
+
return new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, this.mapper], this.containers.map(function (parent) { return parent.querySelector(selector); }).filter(function (found) { return !!found; }), false)))();
|
|
182
|
+
};
|
|
183
|
+
ChainedQuery.WHITESPACE_RGX = /\s+/;
|
|
184
|
+
return ChainedQuery;
|
|
185
185
|
}());
|
|
186
186
|
|
|
187
|
-
var SourceMapper = /** @class */ (function () {
|
|
188
|
-
function SourceMapper() {
|
|
189
|
-
}
|
|
190
|
-
SourceMapper.prototype.Map = function (sources) {
|
|
191
|
-
return sources.reduce(function (acc, item) {
|
|
192
|
-
if (typeof item === 'string') {
|
|
193
|
-
acc.push.apply(acc, (SourceMapper.NAIVE_HTML_RGX.test(item)
|
|
194
|
-
? SourceMapper.MapHTML(item)
|
|
195
|
-
: SourceMapper.MapSelector(item)));
|
|
196
|
-
}
|
|
197
|
-
else if (item.tag)
|
|
198
|
-
acc.push(SourceMapper.MapParam(item));
|
|
199
|
-
else if (item instanceof Node)
|
|
200
|
-
acc.push(item);
|
|
201
|
-
else if (item instanceof EventTarget)
|
|
202
|
-
acc.push(item);
|
|
203
|
-
else if (item instanceof ChainedQuery)
|
|
204
|
-
item.each(function (i) { return acc.push(i); });
|
|
205
|
-
else
|
|
206
|
-
console.warn('Unrecognised item:', item);
|
|
207
|
-
return acc;
|
|
208
|
-
}, []);
|
|
209
|
-
};
|
|
210
|
-
SourceMapper.MapHTML = function (html) {
|
|
211
|
-
var template = document.createElement('template');
|
|
212
|
-
template.innerHTML = html;
|
|
213
|
-
return Array.from(template.content.childNodes);
|
|
214
|
-
};
|
|
215
|
-
SourceMapper.MapSelector = function (selector) {
|
|
216
|
-
return Array.from(document.querySelectorAll(selector));
|
|
217
|
-
};
|
|
218
|
-
SourceMapper.MapParam = function (p) {
|
|
219
|
-
var n = document.createElement(p.tag);
|
|
220
|
-
if (p.text)
|
|
221
|
-
n.textContent = p.text;
|
|
222
|
-
for (var key in p.attr || {}) {
|
|
223
|
-
if (p.attr[key] != null) {
|
|
224
|
-
n.setAttribute(key, p.attr[key]);
|
|
225
|
-
}
|
|
226
|
-
}
|
|
227
|
-
for (var key in p.evts || {}) {
|
|
228
|
-
if (typeof p.evts[key] === 'function') {
|
|
229
|
-
n.addEventListener(key, p.evts[key]);
|
|
230
|
-
}
|
|
231
|
-
}
|
|
232
|
-
return n;
|
|
233
|
-
};
|
|
234
|
-
SourceMapper.NAIVE_HTML_RGX = /^\s*<.*>\s*$/m;
|
|
235
|
-
return SourceMapper;
|
|
187
|
+
var SourceMapper = /** @class */ (function () {
|
|
188
|
+
function SourceMapper() {
|
|
189
|
+
}
|
|
190
|
+
SourceMapper.prototype.Map = function (sources) {
|
|
191
|
+
return sources.reduce(function (acc, item) {
|
|
192
|
+
if (typeof item === 'string') {
|
|
193
|
+
acc.push.apply(acc, (SourceMapper.NAIVE_HTML_RGX.test(item)
|
|
194
|
+
? SourceMapper.MapHTML(item)
|
|
195
|
+
: SourceMapper.MapSelector(item)));
|
|
196
|
+
}
|
|
197
|
+
else if (item.tag)
|
|
198
|
+
acc.push(SourceMapper.MapParam(item));
|
|
199
|
+
else if (item instanceof Node)
|
|
200
|
+
acc.push(item);
|
|
201
|
+
else if (item instanceof EventTarget)
|
|
202
|
+
acc.push(item);
|
|
203
|
+
else if (item instanceof ChainedQuery)
|
|
204
|
+
item.each(function (i) { return acc.push(i); });
|
|
205
|
+
else
|
|
206
|
+
console.warn('Unrecognised item:', item);
|
|
207
|
+
return acc;
|
|
208
|
+
}, []);
|
|
209
|
+
};
|
|
210
|
+
SourceMapper.MapHTML = function (html) {
|
|
211
|
+
var template = document.createElement('template');
|
|
212
|
+
template.innerHTML = html;
|
|
213
|
+
return Array.from(template.content.childNodes);
|
|
214
|
+
};
|
|
215
|
+
SourceMapper.MapSelector = function (selector) {
|
|
216
|
+
return Array.from(document.querySelectorAll(selector));
|
|
217
|
+
};
|
|
218
|
+
SourceMapper.MapParam = function (p) {
|
|
219
|
+
var n = document.createElement(p.tag);
|
|
220
|
+
if (p.text)
|
|
221
|
+
n.textContent = p.text;
|
|
222
|
+
for (var key in p.attr || {}) {
|
|
223
|
+
if (p.attr[key] != null) {
|
|
224
|
+
n.setAttribute(key, p.attr[key]);
|
|
225
|
+
}
|
|
226
|
+
}
|
|
227
|
+
for (var key in p.evts || {}) {
|
|
228
|
+
if (typeof p.evts[key] === 'function') {
|
|
229
|
+
n.addEventListener(key, p.evts[key]);
|
|
230
|
+
}
|
|
231
|
+
}
|
|
232
|
+
return n;
|
|
233
|
+
};
|
|
234
|
+
SourceMapper.NAIVE_HTML_RGX = /^\s*<.*>\s*$/m;
|
|
235
|
+
return SourceMapper;
|
|
236
236
|
}());
|
|
237
|
-
var mapper = new SourceMapper();
|
|
238
|
-
function q() {
|
|
239
|
-
var input = [];
|
|
240
|
-
for (var _i = 0; _i < arguments.length; _i++) {
|
|
241
|
-
input[_i] = arguments[_i];
|
|
242
|
-
}
|
|
243
|
-
return new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, mapper], input, false)))();
|
|
237
|
+
var mapper = new SourceMapper();
|
|
238
|
+
function q() {
|
|
239
|
+
var input = [];
|
|
240
|
+
for (var _i = 0; _i < arguments.length; _i++) {
|
|
241
|
+
input[_i] = arguments[_i];
|
|
242
|
+
}
|
|
243
|
+
return new (ChainedQuery.bind.apply(ChainedQuery, __spreadArray([void 0, mapper], input, false)))();
|
|
244
244
|
}
|
|
245
245
|
|
|
246
|
-
class CustomElementBase extends HTMLElement {
|
|
247
|
-
constructor(css, html, mode = 'closed') {
|
|
248
|
-
super();
|
|
249
|
-
this.root = this.attachShadow({ mode });
|
|
250
|
-
this.root.innerHTML = html;
|
|
251
|
-
const style = document.createElement('style');
|
|
252
|
-
style.textContent = css;
|
|
253
|
-
this.root.appendChild(style);
|
|
254
|
-
}
|
|
246
|
+
class CustomElementBase extends HTMLElement {
|
|
247
|
+
constructor(css, html, mode = 'closed') {
|
|
248
|
+
super();
|
|
249
|
+
this.root = this.attachShadow({ mode });
|
|
250
|
+
this.root.innerHTML = html;
|
|
251
|
+
const style = document.createElement('style');
|
|
252
|
+
style.textContent = css;
|
|
253
|
+
this.root.appendChild(style);
|
|
254
|
+
}
|
|
255
255
|
}
|
|
256
256
|
|
|
257
|
-
function decode(b64) {
|
|
258
|
-
const bIndex = (b64 + '').indexOf('base64,');
|
|
259
|
-
return bIndex === -1 ? b64 : window.atob(b64.substring(bIndex + 7));
|
|
260
|
-
}
|
|
261
|
-
function reduceCss(cssIn) {
|
|
262
|
-
return cssIn
|
|
263
|
-
.replace(/\s+/g, ' ')
|
|
264
|
-
.replace(/([,{}:;])\s/g, '$1')
|
|
265
|
-
.replace(/\s([{])/g, '$1');
|
|
266
|
-
}
|
|
267
|
-
function reduceHtml(htmlIn) {
|
|
268
|
-
return htmlIn.replace(/\s+/g, ' ').replace(/(^|>)\s+(<|$)/g, '$1$2');
|
|
257
|
+
function decode(b64) {
|
|
258
|
+
const bIndex = (b64 + '').indexOf('base64,');
|
|
259
|
+
return bIndex === -1 ? b64 : window.atob(b64.substring(bIndex + 7));
|
|
260
|
+
}
|
|
261
|
+
function reduceCss(cssIn) {
|
|
262
|
+
return cssIn
|
|
263
|
+
.replace(/\s+/g, ' ')
|
|
264
|
+
.replace(/([,{}:;])\s/g, '$1')
|
|
265
|
+
.replace(/\s([{])/g, '$1');
|
|
266
|
+
}
|
|
267
|
+
function reduceHtml(htmlIn) {
|
|
268
|
+
return htmlIn.replace(/\s+/g, ' ').replace(/(^|>)\s+(<|$)/g, '$1$2');
|
|
269
269
|
}
|
|
270
270
|
|
|
271
271
|
var markupUrl = "data:text/html;base64,PHNsb3Q+PC9zbG90Pg0KPHVsIGNsYXNzPSJ0b3AiPjwvdWw+DQo=";
|
|
272
272
|
|
|
273
273
|
var stylesUrl = "data:text/css;base64,dWwsDQpsaSB7DQogIHBhZGRpbmc6IDA7DQogIG1hcmdpbjogMDsNCiAgZm9udDogaW5oZXJpdDsNCn0NCnNsb3QsDQpsaS5zcGxpdCAuaWNvbiB7DQogIGRpc3BsYXk6IG5vbmU7DQp9DQoudG9wOm5vdCgub3BlbiksDQp1bDpub3QoLnRvcCkgew0KICB2aXNpYmlsaXR5OiBoaWRkZW47DQp9DQoNCnVsIHsNCiAgYm9yZGVyOiB2YXIoLS1ib3JkZXIsIDFweCBzb2xpZCAjYmJiKTsNCiAgYmFja2dyb3VuZDogdmFyKC0tYmcsICNmZmYpOw0KICBib3gtc2hhZG93OiB2YXIoLS1ib3gtc2hhZG93LCAycHggMnB4IDNweCAjODg4KTsNCiAgdHJhbnNpdGlvbjogYmFja2dyb3VuZCAwLjZzOw0KICB6LWluZGV4OiA5OTk5OTk5Ow0KfQ0KDQoudG9wIHsNCiAgcG9zaXRpb246IGZpeGVkOw0KICBmb250LXNpemU6IHZhcigtLWZvbnQtc2l6ZSwgMC42NXJlbSk7DQogIHVzZXItc2VsZWN0OiBub25lOw0KfQ0KDQouaWNvbi5sZWZ0IHsNCiAgbGVmdDogMWVtOw0KICB0cmFuc2Zvcm06IHRyYW5zbGF0ZSgtNTAlLCAtNTAlKTsNCn0NCi5pY29uLnJpZ2h0IHsNCiAgcmlnaHQ6IDFlbTsNCiAgdHJhbnNmb3JtOiB0cmFuc2xhdGUoNTAlLCAtNTAlKTsNCn0NCi5pY29uIHsNCiAgbWF4LXdpZHRoOiAxZW07DQogIG1heC1oZWlnaHQ6IDFlbTsNCiAgcG9zaXRpb246IGFic29sdXRlOw0KICB0b3A6IDUwJTsNCiAgbGluZS1oZWlnaHQ6IDA7DQp9DQoNCmxpID4gcDpub3QoOmVtcHR5KSB7DQogIG1hcmdpbjogMCAxZW07DQogIHdoaXRlLXNwYWNlOiBub3dyYXA7DQp9DQpsaS5kaXNhYmxlZCB7DQogIGNvbG9yOiB2YXIoLS1kaXNhYmxlZC1mZywgI2JiYik7DQp9DQpsaS5zcGxpdCB7DQogIGJvcmRlci10b3A6IHZhcigtLXNwbGl0LWJvcmRlciwgdmFyKC0tYm9yZGVyLCAxcHggc29saWQgI2JiYikpOw0KICBwYWRkaW5nOiAwOw0KICBtYXJnaW46IDAuM2VtOw0KfQ0KbGkuc3BsaXQ6Zmlyc3QtY2hpbGQsDQpsaS5zcGxpdDpsYXN0LWNoaWxkLA0KbGkuc3BsaXQgKyBsaS5zcGxpdCB7DQogIGRpc3BsYXk6IG5vbmU7DQp9DQpsaS5ob3Zlcjpub3QoLmRpc2FiZWQpOm5vdCguc3BsaXQpIHsNCiAgYmFja2dyb3VuZDogdmFyKC0taG92ZXItaXRlbS1iZywgI2JiYik7DQp9DQoudG9wLm9wZW4gbGkuaG92ZXIgPiB1bCB7DQogIHZpc2liaWxpdHk6IHZpc2libGU7DQp9DQpsaSB7DQogIG1hcmdpbjogMC4yZW0gMDsNCiAgcGFkZGluZzogMC41ZW0gMWVtOw0KICBkaXNwbGF5OiBmbGV4Ow0KICBqdXN0aWZ5LWNvbnRlbnQ6IHNwYWNlLWJldHdlZW47DQogIHRleHQtYWxpZ246IGxlZnQ7DQogIHBvc2l0aW9uOiByZWxhdGl2ZTsNCiAgY3Vyc29yOiBkZWZhdWx0Ow0KICBjb2xvcjogdmFyKC0tZmcsICMwMDApOw0KfQ0KDQpsaS5ncm91cDo6YWZ0ZXIgew0KICBjb250ZW50OiAnXDI1YjYnOw0KICBwb3NpdGlvbjogYWJzb2x1dGU7DQogIGZvbnQtc2l6ZTogMC42NWVtOw0KICByaWdodDogMDsNCiAgdG9wOiA1MCU7DQogIHRyYW5zZm9ybTogdHJhbnNsYXRlKC01MCUsIC01MCUpOw0KfQ0KDQp1bDpub3QoLnRvcCkgew0KICBwb3NpdGlvbjogYWJzb2x1dGU7DQogIGxlZnQ6IDEwMCU7DQogIHRvcDogLTAuMjVlbTsNCn0NCg0KdWwubmVzdGxlIHsNCiAgbGVmdDogMC41ZW07DQogIHRvcDogMTAwJTsNCn0NCg==";
|
|
274
274
|
|
|
275
|
-
class NeMenu extends CustomElementBase {
|
|
276
|
-
constructor() {
|
|
277
|
-
super(NeMenu.Css, NeMenu.Html);
|
|
278
|
-
this.top = this.root.querySelector('ul');
|
|
279
|
-
}
|
|
280
|
-
connectedCallback() {
|
|
281
|
-
if (!this._connected) {
|
|
282
|
-
setTimeout(() => this.reload());
|
|
283
|
-
q(this.parentNode).on('contextmenu', (e) => this.onParentContext(e));
|
|
284
|
-
q(this, this.parentNode).on('contextmenu wheel', (e) => {
|
|
285
|
-
e.preventDefault();
|
|
286
|
-
e.stopPropagation();
|
|
287
|
-
});
|
|
288
|
-
q(this).on('mousedown', (e) => e.stopPropagation());
|
|
289
|
-
q(window).on('mousedown resize wheel', () => this.close());
|
|
290
|
-
this._connected = true;
|
|
291
|
-
}
|
|
292
|
-
}
|
|
293
|
-
/** Opens the menu. */
|
|
294
|
-
open() {
|
|
295
|
-
// close all menus
|
|
296
|
-
const doc = this.parentElement.getRootNode();
|
|
297
|
-
doc.querySelectorAll('ne14-menu').forEach((m) => m.close());
|
|
298
|
-
// style this one as open
|
|
299
|
-
this.top.classList.add('open');
|
|
300
|
-
q(this).fire('menuopen');
|
|
301
|
-
}
|
|
302
|
-
/** Closes the menu. */
|
|
303
|
-
close() {
|
|
304
|
-
if (this.top.classList.contains('open')) {
|
|
305
|
-
this.top.classList.remove('open');
|
|
306
|
-
q(this).fire('menuclose');
|
|
307
|
-
}
|
|
308
|
-
}
|
|
309
|
-
/** Reloads active contents based on client dom. */
|
|
310
|
-
reload() {
|
|
311
|
-
q(this.top)
|
|
312
|
-
.empty()
|
|
313
|
-
.append(...this.walk(this, false));
|
|
314
|
-
}
|
|
315
|
-
onParentContext(event) {
|
|
316
|
-
if (this.isConnected) {
|
|
317
|
-
// update position (y)
|
|
318
|
-
const y = event.clientY;
|
|
319
|
-
const height = this.top.offsetHeight;
|
|
320
|
-
const posY = y + height + 2 > window.innerHeight ? y - height : y;
|
|
321
|
-
this.top.style.top = `${Math.max(0, posY)}px`;
|
|
322
|
-
// update position (x)
|
|
323
|
-
const x = event.clientX;
|
|
324
|
-
const width = this.top.offsetWidth;
|
|
325
|
-
const posX = x + width + 2 > window.innerWidth ? x - width : x;
|
|
326
|
-
this.top.style.left = `${Math.max(0, posX)}px`;
|
|
327
|
-
// open
|
|
328
|
-
this.open();
|
|
329
|
-
}
|
|
330
|
-
}
|
|
331
|
-
walk(ul, parentDisabled, ref = '') {
|
|
332
|
-
let levelItemNo = 0;
|
|
333
|
-
return Array.from(ul.children)
|
|
334
|
-
.filter((c) => c instanceof HTMLLIElement &&
|
|
335
|
-
!c.classList.contains('hidden') &&
|
|
336
|
-
(c.textContent || c.classList.contains('split')))
|
|
337
|
-
.reduce((acc, li) => {
|
|
338
|
-
var _a, _b, _c;
|
|
339
|
-
const children = Array.from(li.children).map((el) => el);
|
|
340
|
-
const a = children.find((n) => n instanceof HTMLAnchorElement);
|
|
341
|
-
const ul = children.find((n) => n instanceof HTMLUListElement);
|
|
342
|
-
const isSplit = li.classList.contains('split');
|
|
343
|
-
const isGrouper = !isSplit && ul && ul.querySelector('li');
|
|
344
|
-
const isDisabled = !isSplit && (parentDisabled || li.classList.contains('disabled'));
|
|
345
|
-
const aChildren = Array.from((a === null || a === void 0 ? void 0 : a.children) || []).map((el) => el);
|
|
346
|
-
const imgs = children
|
|
347
|
-
.concat(aChildren)
|
|
348
|
-
.filter((n) => n instanceof HTMLImageElement)
|
|
349
|
-
.map((n) => n);
|
|
350
|
-
if (!isSplit)
|
|
351
|
-
levelItemNo++;
|
|
352
|
-
const classes = [];
|
|
353
|
-
if (isSplit)
|
|
354
|
-
classes.push('split');
|
|
355
|
-
else {
|
|
356
|
-
if (isDisabled)
|
|
357
|
-
classes.push('disabled');
|
|
358
|
-
if (isGrouper)
|
|
359
|
-
classes.push('group');
|
|
360
|
-
if ((a === null || a === void 0 ? void 0 : a.target) === '_blank')
|
|
361
|
-
classes.push('click-out');
|
|
362
|
-
else if (a)
|
|
363
|
-
classes.push('click-in');
|
|
364
|
-
}
|
|
365
|
-
const bestTextNode = [...children, li].find((c) => c.innerText);
|
|
366
|
-
const bestText = isSplit ? null : (_a = bestTextNode === null || bestTextNode === void 0 ? void 0 : bestTextNode.innerText) !== null && _a !== void 0 ? _a : `Item ${levelItemNo}`;
|
|
367
|
-
const shortcut = isSplit || isGrouper ? null : li.getAttribute('aria-keyshortcuts');
|
|
368
|
-
const liRef = `${ref}${levelItemNo}`;
|
|
369
|
-
const eventDetail = { ref: liRef, title: bestText, origin: a || li };
|
|
370
|
-
const handleClick = () => {
|
|
371
|
-
if (!isDisabled && !isGrouper && !isSplit) {
|
|
372
|
-
eventDetail.origin.click();
|
|
373
|
-
q(this).fire('itemselect', eventDetail);
|
|
374
|
-
this.close();
|
|
375
|
-
}
|
|
376
|
-
};
|
|
377
|
-
const handleMouseEnter = (e) => {
|
|
378
|
-
if (!isDisabled && !isSplit) {
|
|
379
|
-
const domLi = e.target;
|
|
380
|
-
if (isGrouper) {
|
|
381
|
-
const domUl = Array.from(domLi.children).find((n) => n instanceof HTMLUListElement);
|
|
382
|
-
const liRect = domLi.getBoundingClientRect();
|
|
383
|
-
domUl.classList.toggle('nestle', liRect.right + domUl.clientWidth + 2 > window.innerWidth);
|
|
384
|
-
}
|
|
385
|
-
domLi.classList.add('hover');
|
|
386
|
-
q(this).fire('itemhover', eventDetail);
|
|
387
|
-
}
|
|
388
|
-
};
|
|
389
|
-
const handleMouseLeave = (e) => {
|
|
390
|
-
if (!isDisabled && !isSplit) {
|
|
391
|
-
e.target.classList.remove('hover');
|
|
392
|
-
q(this).fire('itemunhover', eventDetail);
|
|
393
|
-
}
|
|
394
|
-
};
|
|
395
|
-
const $domItem = q({ tag: 'li' })
|
|
396
|
-
.attr('class', classes.length ? classes.join(' ') : null)
|
|
397
|
-
.attr('aria-keyshortcuts', shortcut)
|
|
398
|
-
.on('click contextmenu', handleClick)
|
|
399
|
-
.on('mouseenter', handleMouseEnter)
|
|
400
|
-
.on('mouseleave', handleMouseLeave);
|
|
401
|
-
const charLeft = li.dataset.charLeft;
|
|
402
|
-
const charRight = li.dataset.charRight;
|
|
403
|
-
const imgLeft = imgs.find((i) => !i.classList.contains('right'));
|
|
404
|
-
const imgRight = imgs.find((i) => i.classList.contains('right'));
|
|
405
|
-
if (!isSplit && !isGrouper && bestText) {
|
|
406
|
-
if (NeMenu.CHAR_REF_REGEX.test(charLeft))
|
|
407
|
-
$domItem.append(`<span class='icon left'>&#x${charLeft};</span>`);
|
|
408
|
-
else if (charLeft)
|
|
409
|
-
console.warn(`ne14-menu: Bad hex code '${charLeft}' to left of '${bestText}'.`);
|
|
410
|
-
else if (imgLeft)
|
|
411
|
-
$domItem.append(`<img class='icon left' src='${imgLeft.src}'/>`);
|
|
412
|
-
if (NeMenu.CHAR_REF_REGEX.test(charRight))
|
|
413
|
-
$domItem.append(`<span class='icon right'>&#x${charRight};</span>`);
|
|
414
|
-
else if (charRight)
|
|
415
|
-
console.warn(`ne14-menu: Bad hex code '${charRight}' to right of '${bestText}'.`);
|
|
416
|
-
else if (imgRight)
|
|
417
|
-
$domItem.append(`<img class='icon right' src='${imgRight.src}'/>`);
|
|
418
|
-
}
|
|
419
|
-
if (bestText)
|
|
420
|
-
$domItem.append({ tag: 'p', text: bestText });
|
|
421
|
-
if (shortcut)
|
|
422
|
-
$domItem.append({ tag: 'p', text: shortcut });
|
|
423
|
-
if (isGrouper)
|
|
424
|
-
$domItem.appendIn({ tag: 'ul' }).append(...this.walk(ul, isDisabled, `${liRef}-`));
|
|
425
|
-
// Do not push two consecutive splits
|
|
426
|
-
if (!isSplit || !((_c = (_b = acc[acc.length - 1]) === null || _b === void 0 ? void 0 : _b.classList) === null || _c === void 0 ? void 0 : _c.contains('split'))) {
|
|
427
|
-
acc.push($domItem.elements[0]);
|
|
428
|
-
}
|
|
429
|
-
return acc;
|
|
430
|
-
}, []);
|
|
431
|
-
}
|
|
432
|
-
}
|
|
433
|
-
NeMenu.Css = reduceCss(decode(stylesUrl));
|
|
434
|
-
NeMenu.Html = reduceHtml(decode(markupUrl));
|
|
275
|
+
class NeMenu extends CustomElementBase {
|
|
276
|
+
constructor() {
|
|
277
|
+
super(NeMenu.Css, NeMenu.Html);
|
|
278
|
+
this.top = this.root.querySelector('ul');
|
|
279
|
+
}
|
|
280
|
+
connectedCallback() {
|
|
281
|
+
if (!this._connected) {
|
|
282
|
+
setTimeout(() => this.reload());
|
|
283
|
+
q(this.parentNode).on('contextmenu', (e) => this.onParentContext(e));
|
|
284
|
+
q(this, this.parentNode).on('contextmenu wheel', (e) => {
|
|
285
|
+
e.preventDefault();
|
|
286
|
+
e.stopPropagation();
|
|
287
|
+
});
|
|
288
|
+
q(this).on('mousedown', (e) => e.stopPropagation());
|
|
289
|
+
q(window).on('mousedown resize wheel', () => this.close());
|
|
290
|
+
this._connected = true;
|
|
291
|
+
}
|
|
292
|
+
}
|
|
293
|
+
/** Opens the menu. */
|
|
294
|
+
open() {
|
|
295
|
+
// close all menus
|
|
296
|
+
const doc = this.parentElement.getRootNode();
|
|
297
|
+
doc.querySelectorAll('ne14-menu').forEach((m) => m.close());
|
|
298
|
+
// style this one as open
|
|
299
|
+
this.top.classList.add('open');
|
|
300
|
+
q(this).fire('menuopen');
|
|
301
|
+
}
|
|
302
|
+
/** Closes the menu. */
|
|
303
|
+
close() {
|
|
304
|
+
if (this.top.classList.contains('open')) {
|
|
305
|
+
this.top.classList.remove('open');
|
|
306
|
+
q(this).fire('menuclose');
|
|
307
|
+
}
|
|
308
|
+
}
|
|
309
|
+
/** Reloads active contents based on client dom. */
|
|
310
|
+
reload() {
|
|
311
|
+
q(this.top)
|
|
312
|
+
.empty()
|
|
313
|
+
.append(...this.walk(this, false));
|
|
314
|
+
}
|
|
315
|
+
onParentContext(event) {
|
|
316
|
+
if (this.isConnected) {
|
|
317
|
+
// update position (y)
|
|
318
|
+
const y = event.clientY;
|
|
319
|
+
const height = this.top.offsetHeight;
|
|
320
|
+
const posY = y + height + 2 > window.innerHeight ? y - height : y;
|
|
321
|
+
this.top.style.top = `${Math.max(0, posY)}px`;
|
|
322
|
+
// update position (x)
|
|
323
|
+
const x = event.clientX;
|
|
324
|
+
const width = this.top.offsetWidth;
|
|
325
|
+
const posX = x + width + 2 > window.innerWidth ? x - width : x;
|
|
326
|
+
this.top.style.left = `${Math.max(0, posX)}px`;
|
|
327
|
+
// open
|
|
328
|
+
this.open();
|
|
329
|
+
}
|
|
330
|
+
}
|
|
331
|
+
walk(ul, parentDisabled, ref = '') {
|
|
332
|
+
let levelItemNo = 0;
|
|
333
|
+
return Array.from(ul.children)
|
|
334
|
+
.filter((c) => c instanceof HTMLLIElement &&
|
|
335
|
+
!c.classList.contains('hidden') &&
|
|
336
|
+
(c.textContent || c.classList.contains('split')))
|
|
337
|
+
.reduce((acc, li) => {
|
|
338
|
+
var _a, _b, _c;
|
|
339
|
+
const children = Array.from(li.children).map((el) => el);
|
|
340
|
+
const a = children.find((n) => n instanceof HTMLAnchorElement);
|
|
341
|
+
const ul = children.find((n) => n instanceof HTMLUListElement);
|
|
342
|
+
const isSplit = li.classList.contains('split');
|
|
343
|
+
const isGrouper = !isSplit && ul && ul.querySelector('li');
|
|
344
|
+
const isDisabled = !isSplit && (parentDisabled || li.classList.contains('disabled'));
|
|
345
|
+
const aChildren = Array.from((a === null || a === void 0 ? void 0 : a.children) || []).map((el) => el);
|
|
346
|
+
const imgs = children
|
|
347
|
+
.concat(aChildren)
|
|
348
|
+
.filter((n) => n instanceof HTMLImageElement)
|
|
349
|
+
.map((n) => n);
|
|
350
|
+
if (!isSplit)
|
|
351
|
+
levelItemNo++;
|
|
352
|
+
const classes = [];
|
|
353
|
+
if (isSplit)
|
|
354
|
+
classes.push('split');
|
|
355
|
+
else {
|
|
356
|
+
if (isDisabled)
|
|
357
|
+
classes.push('disabled');
|
|
358
|
+
if (isGrouper)
|
|
359
|
+
classes.push('group');
|
|
360
|
+
if ((a === null || a === void 0 ? void 0 : a.target) === '_blank')
|
|
361
|
+
classes.push('click-out');
|
|
362
|
+
else if (a)
|
|
363
|
+
classes.push('click-in');
|
|
364
|
+
}
|
|
365
|
+
const bestTextNode = [...children, li].find((c) => c.innerText);
|
|
366
|
+
const bestText = isSplit ? null : (_a = bestTextNode === null || bestTextNode === void 0 ? void 0 : bestTextNode.innerText) !== null && _a !== void 0 ? _a : `Item ${levelItemNo}`;
|
|
367
|
+
const shortcut = isSplit || isGrouper ? null : li.getAttribute('aria-keyshortcuts');
|
|
368
|
+
const liRef = `${ref}${levelItemNo}`;
|
|
369
|
+
const eventDetail = { ref: liRef, title: bestText, origin: a || li };
|
|
370
|
+
const handleClick = () => {
|
|
371
|
+
if (!isDisabled && !isGrouper && !isSplit) {
|
|
372
|
+
eventDetail.origin.click();
|
|
373
|
+
q(this).fire('itemselect', eventDetail);
|
|
374
|
+
this.close();
|
|
375
|
+
}
|
|
376
|
+
};
|
|
377
|
+
const handleMouseEnter = (e) => {
|
|
378
|
+
if (!isDisabled && !isSplit) {
|
|
379
|
+
const domLi = e.target;
|
|
380
|
+
if (isGrouper) {
|
|
381
|
+
const domUl = Array.from(domLi.children).find((n) => n instanceof HTMLUListElement);
|
|
382
|
+
const liRect = domLi.getBoundingClientRect();
|
|
383
|
+
domUl.classList.toggle('nestle', liRect.right + domUl.clientWidth + 2 > window.innerWidth);
|
|
384
|
+
}
|
|
385
|
+
domLi.classList.add('hover');
|
|
386
|
+
q(this).fire('itemhover', eventDetail);
|
|
387
|
+
}
|
|
388
|
+
};
|
|
389
|
+
const handleMouseLeave = (e) => {
|
|
390
|
+
if (!isDisabled && !isSplit) {
|
|
391
|
+
e.target.classList.remove('hover');
|
|
392
|
+
q(this).fire('itemunhover', eventDetail);
|
|
393
|
+
}
|
|
394
|
+
};
|
|
395
|
+
const $domItem = q({ tag: 'li' })
|
|
396
|
+
.attr('class', classes.length ? classes.join(' ') : null)
|
|
397
|
+
.attr('aria-keyshortcuts', shortcut)
|
|
398
|
+
.on('click contextmenu', handleClick)
|
|
399
|
+
.on('mouseenter', handleMouseEnter)
|
|
400
|
+
.on('mouseleave', handleMouseLeave);
|
|
401
|
+
const charLeft = li.dataset.charLeft;
|
|
402
|
+
const charRight = li.dataset.charRight;
|
|
403
|
+
const imgLeft = imgs.find((i) => !i.classList.contains('right'));
|
|
404
|
+
const imgRight = imgs.find((i) => i.classList.contains('right'));
|
|
405
|
+
if (!isSplit && !isGrouper && bestText) {
|
|
406
|
+
if (NeMenu.CHAR_REF_REGEX.test(charLeft))
|
|
407
|
+
$domItem.append(`<span class='icon left'>&#x${charLeft};</span>`);
|
|
408
|
+
else if (charLeft)
|
|
409
|
+
console.warn(`ne14-menu: Bad hex code '${charLeft}' to left of '${bestText}'.`);
|
|
410
|
+
else if (imgLeft)
|
|
411
|
+
$domItem.append(`<img class='icon left' src='${imgLeft.src}'/>`);
|
|
412
|
+
if (NeMenu.CHAR_REF_REGEX.test(charRight))
|
|
413
|
+
$domItem.append(`<span class='icon right'>&#x${charRight};</span>`);
|
|
414
|
+
else if (charRight)
|
|
415
|
+
console.warn(`ne14-menu: Bad hex code '${charRight}' to right of '${bestText}'.`);
|
|
416
|
+
else if (imgRight)
|
|
417
|
+
$domItem.append(`<img class='icon right' src='${imgRight.src}'/>`);
|
|
418
|
+
}
|
|
419
|
+
if (bestText)
|
|
420
|
+
$domItem.append({ tag: 'p', text: bestText });
|
|
421
|
+
if (shortcut)
|
|
422
|
+
$domItem.append({ tag: 'p', text: shortcut });
|
|
423
|
+
if (isGrouper)
|
|
424
|
+
$domItem.appendIn({ tag: 'ul' }).append(...this.walk(ul, isDisabled, `${liRef}-`));
|
|
425
|
+
// Do not push two consecutive splits
|
|
426
|
+
if (!isSplit || !((_c = (_b = acc[acc.length - 1]) === null || _b === void 0 ? void 0 : _b.classList) === null || _c === void 0 ? void 0 : _c.contains('split'))) {
|
|
427
|
+
acc.push($domItem.elements[0]);
|
|
428
|
+
}
|
|
429
|
+
return acc;
|
|
430
|
+
}, []);
|
|
431
|
+
}
|
|
432
|
+
}
|
|
433
|
+
NeMenu.Css = reduceCss(decode(stylesUrl));
|
|
434
|
+
NeMenu.Html = reduceHtml(decode(markupUrl));
|
|
435
435
|
NeMenu.CHAR_REF_REGEX = /^[0-9a-f]{4,5}$/i;
|
|
436
436
|
|
|
437
|
-
if ('customElements' in window) {
|
|
438
|
-
window.customElements.define('ne14-menu', NeMenu);
|
|
437
|
+
if ('customElements' in window) {
|
|
438
|
+
window.customElements.define('ne14-menu', NeMenu);
|
|
439
439
|
}
|
|
440
440
|
|
|
441
441
|
exports.ContextMenu = NeMenu;
|