aleman 1.16.2 → 1.16.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/ChangeLog +17 -1
- package/menu/addons/click/click.js +4 -4
- package/menu/addons/item-click/item-click.js +4 -1
- package/menu/addons/j/j.js +1 -0
- package/menu/rules/build-menu/fixture/build-menu-fix.js +2 -2
- package/menu/rules/build-menu/fixture/icon-fix.js +2 -2
- package/menu/rules/build-menu/fixture/nested-fix.js +2 -2
- package/menu/rules/build-menu/index.js +2 -1
- package/nemo/README.md +28 -0
- package/nemo/addons/click/click.js +37 -0
- package/nemo/addons/click/fixture/click-fix.js +8 -0
- package/nemo/addons/click/fixture/click.js +8 -0
- package/nemo/addons/click/fixture/not-fn.js +8 -0
- package/nemo/addons/context-menu.js +50 -0
- package/nemo/addons/down/down.js +44 -0
- package/nemo/addons/down/fixture/down-fix.js +16 -0
- package/nemo/addons/down/fixture/down.js +16 -0
- package/nemo/addons/down/fixture/infinite-scroll-fix.js +16 -0
- package/nemo/addons/down/fixture/infinite-scroll.js +16 -0
- package/nemo/addons/enter/enter.js +30 -0
- package/nemo/addons/enter/fixture/enter-fix.js +8 -0
- package/nemo/addons/enter/fixture/enter.js +8 -0
- package/nemo/addons/escape/escape.js +11 -0
- package/nemo/addons/escape/fixture/escape-fix.js +8 -0
- package/nemo/addons/escape/fixture/escape.js +8 -0
- package/nemo/addons/gg/fixture/gg-fix.js +8 -0
- package/nemo/addons/gg/fixture/gg.js +8 -0
- package/nemo/addons/gg/fixture/hide.js +8 -0
- package/nemo/addons/gg/fixture/submenu-fix.js +17 -0
- package/nemo/addons/gg/fixture/submenu.js +18 -0
- package/nemo/addons/gg/gg.js +26 -0
- package/nemo/addons/index.js +25 -0
- package/nemo/addons/item-click/fixture/item-click-fix.js +8 -0
- package/nemo/addons/item-click/fixture/item-click.js +8 -0
- package/nemo/addons/item-click/fixture/no-click.js +8 -0
- package/nemo/addons/item-click/fixture/not-fn.js +8 -0
- package/nemo/addons/item-click/fixture/run-fix.js +8 -0
- package/nemo/addons/item-click/fixture/run.js +8 -0
- package/nemo/addons/item-click/item-click.js +43 -0
- package/nemo/addons/j/fixture/infinite-scroll-fix.js +8 -0
- package/nemo/addons/j/fixture/infinite-scroll.js +8 -0
- package/nemo/addons/j/fixture/j-fix.js +8 -0
- package/nemo/addons/j/fixture/j.js +8 -0
- package/nemo/addons/j/fixture/m.js +8 -0
- package/nemo/addons/j/fixture/submenu-fix.js +8 -0
- package/nemo/addons/j/fixture/submenu-infinite-scroll-fix.js +16 -0
- package/nemo/addons/j/fixture/submenu-infinite-scroll.js +16 -0
- package/nemo/addons/j/fixture/submenu.js +8 -0
- package/nemo/addons/j/j.js +10 -0
- package/nemo/addons/k/fixture/infinite-scroll-fix.js +8 -0
- package/nemo/addons/k/fixture/infinite-scroll.js +8 -0
- package/nemo/addons/k/fixture/k-fix.js +8 -0
- package/nemo/addons/k/fixture/k.js +8 -0
- package/nemo/addons/k/fixture/m.js +8 -0
- package/nemo/addons/k/fixture/submenu-fix.js +8 -0
- package/nemo/addons/k/fixture/submenu.js +8 -0
- package/nemo/addons/k/k.js +34 -0
- package/nemo/addons/left.js +11 -0
- package/nemo/addons/menu/get-menu-path.js +12 -0
- package/nemo/addons/mouse-leave/fixture/mouse-enter-fix.js +8 -0
- package/nemo/addons/mouse-leave/fixture/mouse-enter.js +8 -0
- package/nemo/addons/mouse-leave/fixture/unselect-all.js +8 -0
- package/nemo/addons/mouse-leave/index.js +10 -0
- package/nemo/addons/right.js +23 -0
- package/nemo/addons/run/index.js +17 -0
- package/nemo/addons/set-position/calculate.js +28 -0
- package/nemo/addons/set-position/set-position.js +35 -0
- package/nemo/addons/shift-g/fixture/hide.js +8 -0
- package/nemo/addons/shift-g/fixture/shift-g-fix.js +8 -0
- package/nemo/addons/shift-g/fixture/shift-g.js +8 -0
- package/nemo/addons/shift-g/shift-g.js +41 -0
- package/nemo/addons/submenu/index.js +12 -0
- package/nemo/addons/up.js +42 -0
- package/nemo/hydrate-menu.js +47 -0
- package/nemo/importmap.js +8 -0
- package/nemo/menu.css +65 -0
- package/nemo/nemo.js +117 -0
- package/nemo/rules/build-menu/fixture/build-menu-fix.js +16 -0
- package/nemo/rules/build-menu/fixture/build-menu.js +3 -0
- package/nemo/rules/build-menu/index.js +101 -0
- package/nemo/rules/hide-submenu/fixture/hide-submenu-fix.js +17 -0
- package/nemo/rules/hide-submenu/fixture/hide-submenu.js +18 -0
- package/nemo/rules/hide-submenu/fixture/no-menu.js +16 -0
- package/nemo/rules/hide-submenu/fixture/show-submenu.js +18 -0
- package/nemo/rules/hide-submenu/index.js +35 -0
- package/nemo/rules/index.js +21 -0
- package/nemo/rules/menu/fixture/hide-menu-fix.js +3 -0
- package/nemo/rules/menu/fixture/hide-menu.js +3 -0
- package/nemo/rules/menu/fixture/no-menu.js +3 -0
- package/nemo/rules/menu/fixture/show-menu-fix.js +1 -0
- package/nemo/rules/menu/fixture/show-menu.js +1 -0
- package/nemo/rules/menu/index.js +40 -0
- package/nemo/rules/select/fixture/no-current.js +8 -0
- package/nemo/rules/select/fixture/no-data-name.js +4 -0
- package/nemo/rules/select/fixture/no-index.js +8 -0
- package/nemo/rules/select/fixture/no-next.js +5 -0
- package/nemo/rules/select/fixture/no-parent.js +2 -0
- package/nemo/rules/select/fixture/select-fix.js +8 -0
- package/nemo/rules/select/fixture/select.js +8 -0
- package/nemo/rules/select/fixture/submenu-fix.js +17 -0
- package/nemo/rules/select/fixture/submenu.js +18 -0
- package/nemo/rules/select/fixture/wrong-data-name.js +4 -0
- package/nemo/rules/select/index.js +94 -0
- package/nemo/rules/set-position/fixture/no-style-fix.js +2 -0
- package/nemo/rules/set-position/fixture/no-style.js +2 -0
- package/nemo/rules/set-position/fixture/not-menu.js +2 -0
- package/nemo/rules/set-position/fixture/same-position.js +2 -0
- package/nemo/rules/set-position/fixture/set-position-fix.js +2 -0
- package/nemo/rules/set-position/fixture/set-position.js +2 -0
- package/nemo/rules/set-position/index.js +76 -0
- package/nemo/rules/submenu/fixture/last-selected-fix.js +53 -0
- package/nemo/rules/submenu/fixture/last-selected.js +54 -0
- package/nemo/rules/submenu/fixture/li.js +3 -0
- package/nemo/rules/submenu/fixture/no-submenu-selected.js +17 -0
- package/nemo/rules/submenu/fixture/no-submenu.js +54 -0
- package/nemo/rules/submenu/fixture/not-menu.js +17 -0
- package/nemo/rules/submenu/fixture/submenu-fix.js +53 -0
- package/nemo/rules/submenu/fixture/submenu.js +54 -0
- package/nemo/rules/submenu/index.js +76 -0
- package/nemo/rules/unselect-all/fixture/hide.js +8 -0
- package/nemo/rules/unselect-all/fixture/nested-fix.js +17 -0
- package/nemo/rules/unselect-all/fixture/nested.js +18 -0
- package/nemo/rules/unselect-all/fixture/no-data-name.js +4 -0
- package/nemo/rules/unselect-all/fixture/no-parent.js +2 -0
- package/nemo/rules/unselect-all/fixture/unselect-all-fix.js +8 -0
- package/nemo/rules/unselect-all/fixture/unselect-all.js +8 -0
- package/nemo/rules/unselect-all/index.js +51 -0
- package/nemo/rules/unselect-all-submenu-items/fixture/show-submenu-fix.js +33 -0
- package/nemo/rules/unselect-all-submenu-items/fixture/show-submenu.js +34 -0
- package/nemo/rules/unselect-all-submenu-items/fixture/unselect-all-submenu-items-fix.js +33 -0
- package/nemo/rules/unselect-all-submenu-items/fixture/unselect-all-submenu-items.js +33 -0
- package/nemo/rules/unselect-all-submenu-items/index.js +30 -0
- package/nemo/rules/unselect-wrongly-selected/fixture/hide.js +17 -0
- package/nemo/rules/unselect-wrongly-selected/fixture/unselect-wrongly-selected-fix.js +17 -0
- package/nemo/rules/unselect-wrongly-selected/fixture/unselect-wrongly-selected.js +17 -0
- package/nemo/rules/unselect-wrongly-selected/index.js +39 -0
- package/nemo/state/parse-state.js +91 -0
- package/nemo/state/print-state.js +14 -0
- package/nemo/state/state.js +123 -0
- package/package.json +4 -2
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit menu-item-selected">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import jessy from 'jessy';
|
|
2
|
+
import {getMenuPath as _getMenuPath} from '../menu/get-menu-path.js';
|
|
3
|
+
|
|
4
|
+
const isFn = (a) => typeof a === 'function';
|
|
5
|
+
|
|
6
|
+
export const createItemClick = (name) => ({
|
|
7
|
+
name,
|
|
8
|
+
events: ['click'],
|
|
9
|
+
listener,
|
|
10
|
+
filter,
|
|
11
|
+
});
|
|
12
|
+
|
|
13
|
+
const filter = ({event, options}) => {
|
|
14
|
+
const {
|
|
15
|
+
getMenuPath = _getMenuPath,
|
|
16
|
+
menu,
|
|
17
|
+
} = options;
|
|
18
|
+
|
|
19
|
+
const menuPath = getMenuPath(event);
|
|
20
|
+
const fn = jessy(menuPath, menu);
|
|
21
|
+
|
|
22
|
+
return isFn(fn);
|
|
23
|
+
};
|
|
24
|
+
|
|
25
|
+
const listener = ({event, state, options}) => {
|
|
26
|
+
const {
|
|
27
|
+
menu,
|
|
28
|
+
getMenuPath = _getMenuPath,
|
|
29
|
+
} = options;
|
|
30
|
+
|
|
31
|
+
const menuPath = getMenuPath(event);
|
|
32
|
+
const fn = jessy(menuPath, menu);
|
|
33
|
+
|
|
34
|
+
setTimeout(fn);
|
|
35
|
+
|
|
36
|
+
options.beforeHide?.(state);
|
|
37
|
+
|
|
38
|
+
return {
|
|
39
|
+
index: -1,
|
|
40
|
+
command: 'hide',
|
|
41
|
+
showSubmenu: false,
|
|
42
|
+
};
|
|
43
|
+
};
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view menu-item-selected">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit menu-item-selected">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit menu-item-selected">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu menu-hidden" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view menu-item-selected">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu menu-hidden" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit menu-item-selected">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit menu-item-selected">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px">
|
|
2
|
+
<li data-menu-path="Upload" data-name="menu-item" className="menu-item icon icon-view">
|
|
3
|
+
<label data-menu-path="Upload">Upload</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-menu-path="New" className="menu-item icon icon-edit menu-submenu menu-submenu-show">
|
|
6
|
+
<label data-menu-path="New">New</label>
|
|
7
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px;">
|
|
8
|
+
<li data-menu-path="New.File" data-menu-index="0" data-name="menu-item" className="menu-item icon icon-view">
|
|
9
|
+
<label data-menu-path="New.File">File</label>
|
|
10
|
+
</li>
|
|
11
|
+
<li data-menu-path="New.Directory" data-menu-index="1" data-name="menu-item" className="menu-item icon icon-edit menu-item-selected">
|
|
12
|
+
<label data-menu-path="New.Directory">Directory</label>
|
|
13
|
+
</li>
|
|
14
|
+
</ul>
|
|
15
|
+
</li>
|
|
16
|
+
</ul>;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px">
|
|
2
|
+
<li data-menu-path="Upload" data-name="menu-item" className="menu-item icon icon-view">
|
|
3
|
+
<label data-menu-path="Upload">Upload</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-menu-path="New" className="menu-item icon icon-edit menu-submenu menu-submenu-show menu-item-selected">
|
|
6
|
+
<label data-menu-path="New">New</label>
|
|
7
|
+
<ul data-name="menu" className="menu">
|
|
8
|
+
<li data-menu-path="New.File" data-menu-index="0" data-name="menu-item" className="menu-item icon icon-view">
|
|
9
|
+
<label data-menu-path="New.File">File</label>
|
|
10
|
+
</li>
|
|
11
|
+
<li data-menu-path="New.Directory" data-menu-index="1" data-name="menu-item" className="menu-item icon icon-edit menu-item-selected">
|
|
12
|
+
<label data-menu-path="New.Directory">Directory</label>
|
|
13
|
+
</li>
|
|
14
|
+
</ul>
|
|
15
|
+
</li>
|
|
16
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu menu-hidden">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view menu-item-selected">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit menu-item-selected">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view menu-item-selected">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view menu-item-selected">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu menu-hidden" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit menu-item-selected">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu menu-hidden" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit menu-item-selected">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit menu-item-selected">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view menu-item-selected">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,34 @@
|
|
|
1
|
+
import * as up from '../up.js';
|
|
2
|
+
|
|
3
|
+
export const {filter} = up;
|
|
4
|
+
export const commands = ['k'];
|
|
5
|
+
|
|
6
|
+
export function listener({count, state, options}) {
|
|
7
|
+
const {
|
|
8
|
+
insideSubmenu,
|
|
9
|
+
index,
|
|
10
|
+
submenuIndex,
|
|
11
|
+
} = state;
|
|
12
|
+
|
|
13
|
+
let newIndex = insideSubmenu ? index : index - count + 1;
|
|
14
|
+
let newSubmenuIndex = insideSubmenu ? submenuIndex - count + 1 : submenuIndex;
|
|
15
|
+
|
|
16
|
+
const {infiniteScroll} = options;
|
|
17
|
+
|
|
18
|
+
if (newIndex <= 0)
|
|
19
|
+
newIndex = infiniteScroll ? -1 : 0;
|
|
20
|
+
|
|
21
|
+
if (newSubmenuIndex < -1)
|
|
22
|
+
newSubmenuIndex = -1;
|
|
23
|
+
|
|
24
|
+
const newState = {
|
|
25
|
+
...state,
|
|
26
|
+
index: newIndex,
|
|
27
|
+
submenuIndex: newSubmenuIndex,
|
|
28
|
+
};
|
|
29
|
+
|
|
30
|
+
return up.listener({
|
|
31
|
+
state: newState,
|
|
32
|
+
options,
|
|
33
|
+
});
|
|
34
|
+
}
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
export function getMenuPath(event) {
|
|
2
|
+
let menuItemElement = document.elementFromPoint(event.clientX, event.clientY);
|
|
3
|
+
const {menuPath} = menuItemElement.dataset;
|
|
4
|
+
|
|
5
|
+
if (!menuPath)
|
|
6
|
+
menuItemElement = menuItemElement.querySelector('[data-menu-path]');
|
|
7
|
+
|
|
8
|
+
if (!menuPath)
|
|
9
|
+
return '';
|
|
10
|
+
|
|
11
|
+
return menuItemElement.dataset.menuPath;
|
|
12
|
+
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-index="0" className="menu-item icon icon-view">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" className="menu-item icon icon-edit">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-index="0" className="menu-item icon icon-view menu-item-selected">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" className="menu-item icon icon-edit">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-index="0" className="menu-item icon icon-view menu-item-selected">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" className="menu-item icon icon-edit">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import {getSubmenu} from './submenu/index.js';
|
|
2
|
+
|
|
3
|
+
export const keys = [
|
|
4
|
+
'ArrowRight',
|
|
5
|
+
'l',
|
|
6
|
+
];
|
|
7
|
+
export const preventDefault = true;
|
|
8
|
+
|
|
9
|
+
export const filter = ({state, options}) => {
|
|
10
|
+
const {index} = state;
|
|
11
|
+
const submenu = getSubmenu({
|
|
12
|
+
index,
|
|
13
|
+
options,
|
|
14
|
+
});
|
|
15
|
+
|
|
16
|
+
return Object.keys(submenu).length;
|
|
17
|
+
};
|
|
18
|
+
|
|
19
|
+
export const listener = () => ({
|
|
20
|
+
submenuIndex: 0,
|
|
21
|
+
insideSubmenu: true,
|
|
22
|
+
showSubmenu: true,
|
|
23
|
+
});
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
const isObject = (a) => a && typeof a === 'object';
|
|
2
|
+
const {values} = Object;
|
|
3
|
+
|
|
4
|
+
export const run = ({options, state}) => {
|
|
5
|
+
const {index, submenuIndex} = state;
|
|
6
|
+
const {menu} = options;
|
|
7
|
+
|
|
8
|
+
const fn = values(menu)[index];
|
|
9
|
+
|
|
10
|
+
if (isObject(fn) && submenuIndex === -1)
|
|
11
|
+
return [false];
|
|
12
|
+
|
|
13
|
+
if (isObject(fn))
|
|
14
|
+
return [true, setTimeout(values(fn)[submenuIndex])];
|
|
15
|
+
|
|
16
|
+
return [true, setTimeout(fn)];
|
|
17
|
+
};
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
export function calculate(event, sizes) {
|
|
2
|
+
let {clientX, clientY} = event;
|
|
3
|
+
const {
|
|
4
|
+
heightMenu,
|
|
5
|
+
widthMenu,
|
|
6
|
+
innerHeight,
|
|
7
|
+
innerWidth,
|
|
8
|
+
} = sizes;
|
|
9
|
+
|
|
10
|
+
if (innerWidth < widthMenu + clientX + clientX / 2) {
|
|
11
|
+
clientX -= widthMenu;
|
|
12
|
+
|
|
13
|
+
if (clientX < 0)
|
|
14
|
+
clientX = 0;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
if (innerHeight < heightMenu + clientY) {
|
|
18
|
+
clientY -= heightMenu;
|
|
19
|
+
|
|
20
|
+
if (clientY < 0)
|
|
21
|
+
clientY = 0;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
return {
|
|
25
|
+
x: clientX,
|
|
26
|
+
y: clientY - 14,
|
|
27
|
+
};
|
|
28
|
+
}
|
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
import {calculate} from './calculate.js';
|
|
2
|
+
|
|
3
|
+
export const setPosition = (name, event) => {
|
|
4
|
+
const element = document.querySelector(`[data-name="${name}"]`);
|
|
5
|
+
const heightMenu = getMenuHeight(element);
|
|
6
|
+
const widthMenu = getMenuWidth(element);
|
|
7
|
+
const {innerHeight, innerWidth} = window;
|
|
8
|
+
|
|
9
|
+
const {x, y} = calculate(event, {
|
|
10
|
+
heightMenu,
|
|
11
|
+
widthMenu,
|
|
12
|
+
innerWidth,
|
|
13
|
+
innerHeight,
|
|
14
|
+
});
|
|
15
|
+
|
|
16
|
+
element.style.left = `${x}px`;
|
|
17
|
+
element.style.top = `${y}px`;
|
|
18
|
+
|
|
19
|
+
return {
|
|
20
|
+
position: {
|
|
21
|
+
x,
|
|
22
|
+
y,
|
|
23
|
+
},
|
|
24
|
+
};
|
|
25
|
+
};
|
|
26
|
+
|
|
27
|
+
function getMenuHeight(element) {
|
|
28
|
+
const {height} = getComputedStyle(element);
|
|
29
|
+
return parseInt(height, 10);
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
function getMenuWidth(element) {
|
|
33
|
+
const {width} = getComputedStyle(element);
|
|
34
|
+
return parseInt(width, 10);
|
|
35
|
+
}
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu menu-hidden" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit menu-item-selected">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit menu-item-selected">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
<ul data-name="menu" className="menu menu-hidden" style="left: 0px; top: 20px;">
|
|
2
|
+
<li data-name="menu-item" data-menu-index="0" className="menu-item icon icon-view menu-item-selected">
|
|
3
|
+
<label data-menu-path="View">View</label>
|
|
4
|
+
</li>
|
|
5
|
+
<li data-name="menu-item" data-menu-index="1" className="menu-item icon icon-edit">
|
|
6
|
+
<label data-menu-path="Edit">Edit</label>
|
|
7
|
+
</li>
|
|
8
|
+
</ul>;
|
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
import {getSubmenu} from '../submenu/index.js';
|
|
2
|
+
|
|
3
|
+
export const keys = [
|
|
4
|
+
'G',
|
|
5
|
+
'$',
|
|
6
|
+
];
|
|
7
|
+
|
|
8
|
+
export const filter = ({state}) => state.command === 'show';
|
|
9
|
+
|
|
10
|
+
export const preventDefault = true;
|
|
11
|
+
|
|
12
|
+
export const listener = ({state, options}) => {
|
|
13
|
+
const {menu} = options;
|
|
14
|
+
let {
|
|
15
|
+
index,
|
|
16
|
+
insideSubmenu,
|
|
17
|
+
submenuIndex,
|
|
18
|
+
} = state;
|
|
19
|
+
|
|
20
|
+
const menuValues = Object.values(menu);
|
|
21
|
+
|
|
22
|
+
const submenu = getSubmenu({
|
|
23
|
+
index,
|
|
24
|
+
options,
|
|
25
|
+
});
|
|
26
|
+
|
|
27
|
+
const submenuCount = Object.keys(submenu).length;
|
|
28
|
+
|
|
29
|
+
if (insideSubmenu)
|
|
30
|
+
submenuIndex = submenuCount - 1;
|
|
31
|
+
else
|
|
32
|
+
index = menuValues.length - 1;
|
|
33
|
+
|
|
34
|
+
const showSubmenu = submenuCount > 0;
|
|
35
|
+
|
|
36
|
+
return {
|
|
37
|
+
index,
|
|
38
|
+
submenuIndex,
|
|
39
|
+
showSubmenu,
|
|
40
|
+
};
|
|
41
|
+
};
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
const isObject = (a) => a && typeof a === 'object';
|
|
2
|
+
|
|
3
|
+
export function getSubmenu({index, options}) {
|
|
4
|
+
const {menu} = options;
|
|
5
|
+
const currentName = Object.keys(menu)[index];
|
|
6
|
+
const submenu = menu[currentName];
|
|
7
|
+
|
|
8
|
+
if (isObject(submenu))
|
|
9
|
+
return submenu;
|
|
10
|
+
|
|
11
|
+
return {};
|
|
12
|
+
}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import {getSubmenu} from './submenu/index.js';
|
|
2
|
+
|
|
3
|
+
export const keys = ['ArrowUp'];
|
|
4
|
+
|
|
5
|
+
export const preventDefault = true;
|
|
6
|
+
export const filter = ({state}) => state.command === 'show';
|
|
7
|
+
|
|
8
|
+
export const listener = ({state, options}) => {
|
|
9
|
+
const {menu, infiniteScroll} = options;
|
|
10
|
+
let {
|
|
11
|
+
index,
|
|
12
|
+
insideSubmenu,
|
|
13
|
+
submenuIndex,
|
|
14
|
+
} = state;
|
|
15
|
+
|
|
16
|
+
const count = Object.keys(menu).length;
|
|
17
|
+
|
|
18
|
+
if (insideSubmenu && submenuIndex > 0)
|
|
19
|
+
--submenuIndex;
|
|
20
|
+
|
|
21
|
+
if (infiniteScroll && !index)
|
|
22
|
+
index = count - 1;
|
|
23
|
+
else if (!insideSubmenu && index > 0)
|
|
24
|
+
--index;
|
|
25
|
+
|
|
26
|
+
if (index === -1)
|
|
27
|
+
index = count - 1;
|
|
28
|
+
|
|
29
|
+
const submenu = getSubmenu({
|
|
30
|
+
index,
|
|
31
|
+
options,
|
|
32
|
+
});
|
|
33
|
+
|
|
34
|
+
const submenuCount = Object.keys(submenu).length;
|
|
35
|
+
const showSubmenu = submenuCount > 0;
|
|
36
|
+
|
|
37
|
+
return {
|
|
38
|
+
index,
|
|
39
|
+
submenuIndex,
|
|
40
|
+
showSubmenu,
|
|
41
|
+
};
|
|
42
|
+
};
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
import {rules} from './rules/index.js';
|
|
2
|
+
import {hydrate} from '../aleman/index.js';
|
|
3
|
+
import {createState} from './state/state.js';
|
|
4
|
+
import {addons} from './addons/index.js';
|
|
5
|
+
import {createMouseEnter} from './addons/mouse-leave/index.js';
|
|
6
|
+
import {createItemClick} from './addons/item-click/item-click.js';
|
|
7
|
+
import * as click from './addons/click/click.js';
|
|
8
|
+
import {createContextMenu} from './addons/context-menu.js';
|
|
9
|
+
import {setPosition} from './addons/set-position/set-position.js';
|
|
10
|
+
|
|
11
|
+
const {assign} = Object;
|
|
12
|
+
|
|
13
|
+
export const hydrateMenu = (elementName, {hydrateElement, options, menu}) => {
|
|
14
|
+
assign(options, {
|
|
15
|
+
menu,
|
|
16
|
+
});
|
|
17
|
+
|
|
18
|
+
const {name} = options;
|
|
19
|
+
const state = createState(options);
|
|
20
|
+
const contextMenu = createContextMenu(elementName);
|
|
21
|
+
|
|
22
|
+
const {run} = hydrate(hydrateElement, {
|
|
23
|
+
options,
|
|
24
|
+
state,
|
|
25
|
+
addons: [
|
|
26
|
+
contextMenu,
|
|
27
|
+
createMouseEnter(name),
|
|
28
|
+
createItemClick(name),
|
|
29
|
+
...addons,
|
|
30
|
+
],
|
|
31
|
+
rules,
|
|
32
|
+
afterHydrate: setPosition,
|
|
33
|
+
stateName: `aleman-state-${name}`,
|
|
34
|
+
});
|
|
35
|
+
|
|
36
|
+
return {
|
|
37
|
+
show: (clientX, clientY) => {
|
|
38
|
+
const event = {
|
|
39
|
+
clientX,
|
|
40
|
+
clientY,
|
|
41
|
+
};
|
|
42
|
+
|
|
43
|
+
run(event, contextMenu);
|
|
44
|
+
},
|
|
45
|
+
hide: () => run({}, click),
|
|
46
|
+
};
|
|
47
|
+
};
|