@asup/context-menu 1.3.2 → 1.3.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.
Files changed (11) hide show
  1. package/dist/cjs/main.css +55 -45
  2. package/dist/cjs/main.css.map +1 -1
  3. package/dist/cjs/main.js +213 -70
  4. package/dist/cjs/main.js.map +1 -1
  5. package/dist/context-menu.d.ts +7 -9
  6. package/dist/context-menu.d.ts.map +1 -1
  7. package/dist/main.css +55 -45
  8. package/dist/main.css.map +1 -1
  9. package/dist/main.js +219 -72
  10. package/dist/main.js.map +1 -1
  11. package/package.json +31 -28
package/dist/cjs/main.css CHANGED
@@ -1,75 +1,79 @@
1
- .context-menu {
1
+ .aiw-WinFxq-anchor {
2
+ position: absolute;
3
+ top: 0;
4
+ left: 0;
5
+ }
6
+
7
+ .aiw-WinFxq-contextMenuHandler {
8
+ width: fit-content;
9
+ height: fit-content;
10
+ }
11
+
12
+ .aiw-WinFxq-contextMenu {
2
13
  visibility: hidden;
3
14
  opacity: 1;
4
15
  z-index: 10000;
16
+ -webkit-font-smoothing: antialiased;
17
+ -moz-osx-font-smoothing: grayscale;
5
18
  background-color: #fbfdf6;
6
19
  border: 1px solid #111418;
7
- border-radius: 8px;
20
+ font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen, Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
21
+ font-size: 9pt;
8
22
  position: absolute;
23
+ box-shadow: 4px 4px 4px #404040bf;
9
24
  }
10
25
 
11
- .context-menu.visible {
26
+ .aiw-WinFxq-contextMenu.aiw-WinFxq-visible {
12
27
  visibility: inherit;
13
28
  }
14
29
 
15
- .context-menu-item {
30
+ .aiw-WinFxq-contextMenuItem {
16
31
  color: #111418;
17
32
  cursor: pointer;
18
33
  white-space: nowrap;
19
34
  flex-direction: row;
20
35
  justify-content: space-between;
21
36
  min-width: 80px;
22
- height: 21px;
23
37
  padding: 0 4px;
24
38
  display: flex;
25
39
  position: relative;
26
40
  }
27
41
 
28
- .context-menu-item.disabled {
42
+ .aiw-WinFxq-contextMenuItem.aiw-WinFxq-disabled {
29
43
  cursor: not-allowed;
30
44
  background-color: #0003;
31
45
  }
32
46
 
33
- .context-menu-item:first-child {
34
- margin-top: 4px;
47
+ .aiw-WinFxq-contextMenuItem:first-child {
48
+ padding-top: 4px;
35
49
  }
36
50
 
37
- .context-menu-item:last-child {
38
- margin-bottom: 4px;
51
+ .aiw-WinFxq-contextMenuItem:last-child {
52
+ padding-bottom: 4px;
39
53
  }
40
54
 
41
- .context-menu-item:not(.disabled):hover {
55
+ .aiw-WinFxq-contextMenuItem:not(.aiw-WinFxq-disabled):hover {
42
56
  background-color: #fbe9e6;
43
57
  }
44
58
 
45
- .context-menu-item:hover:first-child {
46
- border-top-left-radius: 6px;
47
- border-top-right-radius: 6px;
48
- }
49
-
50
- .context-menu-item:hover:last-child {
51
- border-bottom-right-radius: 6px;
52
- border-bottom-left-radius: 6px;
53
- }
54
-
55
- .context-menu-item .caret-holder {
59
+ .aiw-WinFxq-contextMenuItem .aiw-WinFxq-caretHolder {
56
60
  align-self: flex-end;
57
61
  }
58
62
 
59
- .context-menu-item .caret-holder .sub-menu {
63
+ .aiw-WinFxq-contextMenuItem .aiw-WinFxq-caretHolder .aiw-WinFxq-subMenu {
60
64
  z-index: 1;
61
65
  position: relative;
62
66
  }
63
67
 
64
- .context-menu-item-label {
68
+ .aiw-WinFxq-contextMenuItemLabel {
65
69
  flex-grow: 1;
70
+ height: 19px;
66
71
  }
67
72
 
68
- .low-menu {
73
+ .aiw-JfzGeq-lowMenu {
69
74
  z-index: 2;
70
75
  -webkit-font-smoothing: antialiased;
71
76
  -moz-osx-font-smoothing: grayscale;
72
- opacity: .5;
73
77
  background-color: #111418;
74
78
  border: 2px solid #111418;
75
79
  border-top-right-radius: 4px;
@@ -87,17 +91,20 @@
87
91
  box-shadow: 2px 2px 2px #40404080;
88
92
  }
89
93
 
90
- .low-menu:hover {
94
+ .aiw-JfzGeq-lowMenu.aiw-JfzGeq-hidden {
95
+ opacity: 0;
96
+ }
97
+
98
+ .aiw-JfzGeq-lowMenu.aiw-JfzGeq-visible, .aiw-JfzGeq-lowMenu:hover {
91
99
  opacity: 1;
92
100
  }
93
101
 
94
- .low-menu-item {
102
+ .aiw-JfzGeq-lowMenuItem {
95
103
  color: #111418;
96
104
  cursor: pointer;
97
105
  white-space: nowrap;
98
106
  background-color: #fbfdf6;
99
107
  border: 0;
100
- border-radius: 4px;
101
108
  flex-direction: row;
102
109
  justify-content: space-between;
103
110
  padding: 0 4px;
@@ -105,25 +112,29 @@
105
112
  position: relative;
106
113
  }
107
114
 
108
- .low-menu-item.disabled {
115
+ .aiw-JfzGeq-lowMenuItem.aiw-JfzGeq-disabled {
109
116
  cursor: not-allowed;
110
117
  background-color: #c8c8c8;
111
118
  }
112
119
 
113
- .low-menu-item:not(.disabled):hover {
120
+ .aiw-JfzGeq-lowMenuItem:not(.aiw-JfzGeq-disabled):hover {
114
121
  background-color: #fbe9e6;
115
122
  }
116
123
 
117
- .low-menu-item .caret-holder {
124
+ .aiw-JfzGeq-lowMenu-item .aiw-JfzGeq-caretHolder {
118
125
  align-self: flex-end;
119
126
  }
120
127
 
121
- .low-menu-item .caret-holder .sub-menu {
128
+ .aiw-JfzGeq-lowMenuItem .aiw-JfzGeq-caretHolder .aiw-JfzGeq-subMenu {
122
129
  z-index: 1;
123
130
  position: relative;
124
131
  }
125
132
 
126
- .contextwindow {
133
+ .aiw-RIIF9a-contextWindowAnchor {
134
+ position: relative;
135
+ }
136
+
137
+ .aiw-RIIF9a-contextWindow {
127
138
  z-index: 2001;
128
139
  resize: both;
129
140
  background-color: #fafafa;
@@ -140,7 +151,7 @@
140
151
  box-shadow: 6px 6px 6px #40404080;
141
152
  }
142
153
 
143
- .contextwindow-title {
154
+ .aiw-RIIF9a-contextWindowTitle {
144
155
  cursor: grab;
145
156
  align-items: top;
146
157
  border-bottom: 1px dashed #000;
@@ -152,11 +163,11 @@
152
163
  display: flex;
153
164
  }
154
165
 
155
- .contextwindow-title.moving {
166
+ .aiw-RIIF9a-contextWindowTitle.aiw-RIIF9a-moving {
156
167
  cursor: grabbing;
157
168
  }
158
169
 
159
- .contextwindow-title-text {
170
+ .aiw-RIIF9a-contextWindowTitleText {
160
171
  text-overflow: ellipsis;
161
172
  white-space: nowrap;
162
173
  width: calc(100% - 16px);
@@ -166,7 +177,7 @@
166
177
  overflow: hidden;
167
178
  }
168
179
 
169
- .contextwindow-title-close {
180
+ .aiw-RIIF9a-contextWindowTitleClose {
170
181
  color: #000;
171
182
  cursor: pointer;
172
183
  background-color: #fff;
@@ -177,36 +188,35 @@
177
188
  display: inline-block;
178
189
  }
179
190
 
180
- .contextwindow-title-close:hover {
191
+ .aiw-RIIF9a-contextWindowTitleClose:hover {
181
192
  color: #fff;
182
193
  background-color: #000;
183
194
  }
184
195
 
185
- .contextwindow-body {
196
+ .aiw-RIIF9a-contextWindowBody {
186
197
  height: calc(100% - 40px);
187
198
  margin-right: 4px;
188
199
  padding-bottom: 8px;
189
200
  overflow: auto;
190
201
  }
191
202
 
192
- .contextwindow-body::-webkit-scrollbar {
203
+ .aiw-RIIF9a-contextWindowBody::-webkit-scrollbar {
193
204
  width: 8px;
194
205
  height: 8px;
195
206
  }
196
207
 
197
- .contextwindow-body::-webkit-scrollbar-track {
208
+ .aiw-RIIF9a-contextWindowBody::-webkit-scrollbar-track {
198
209
  background: #fff;
199
210
  border-radius: 8px;
200
211
  }
201
212
 
202
- .contextwindow-body::-webkit-scrollbar-thumb {
213
+ .aiw-RIIF9a-contextWindowBody::-webkit-scrollbar-thumb {
203
214
  background: #d3d3d3;
204
215
  border: none;
205
216
  border-radius: 8px;
206
217
  }
207
218
 
208
- .contextwindow-body::-webkit-scrollbar-thumb:hover {
219
+ .aiw-RIIF9a-contextWindowBody::-webkit-scrollbar-thumb:hover {
209
220
  background: gray;
210
221
  }
211
-
212
222
  /*# sourceMappingURL=main.css.map */
package/dist/cjs/main.css.map CHANGED
@@ -1 +1 @@
1
- {"mappings":"AAAA;;;;;;;;;;AAWA;;;;AAIA;;;;;;;;;;;;;AAaA;;;;;AAKA;;;;AAIA;;;;AAIA;;;;AAIA;;;;;AAKA;;;;;AAKA;;;;AAIA;;;;;AAKA;;;;AChEA;;;;;;;;;;;;;;;;;;;;;;AAyBA;;;;AAIA;;;;;;;;;;;;;;AAcA;;;;;AAKA;;;;AAIA;;;;AAIA;;;;;ACxDA;;;;;;;;;;;;;;;;;AAiBA;;;;;;;;;;;;AAYA;;;;AAIA;;;;;;;;;;AAUA;;;;;;;;;;;AAWA;;;;;AAKA;;;;;;;AAOA;;;;;AAKA;;;;;AAKA;;;;;;AAMA","sources":["src/components/ContextMenu.css","src/components/LowMenu.css","src/components/ContextWindow.css"],"sourcesContent":[".context-menu {\n position: absolute;\n visibility: hidden;\n border: 1px solid;\n border-color: rgb(17, 20, 24);\n border-radius: 8px;\n opacity: 1;\n background-color: rgb(251, 253, 246);\n z-index: 10000;\n}\n\n.context-menu.visible {\n visibility: inherit;\n}\n\n.context-menu-item {\n color: rgb(17, 20, 24);\n cursor: pointer;\n padding: 0 4px;\n min-width: 80px;\n height: 21px;\n position: relative;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n white-space: nowrap;\n}\n\n.context-menu-item.disabled {\n background-color: rgba(0, 0, 0, 0.2);\n cursor: not-allowed;\n}\n\n.context-menu-item:first-child {\n margin-top: 4px;\n}\n\n.context-menu-item:last-child {\n margin-bottom: 4px;\n}\n\n.context-menu-item:not(.disabled):hover {\n background-color: rgb(251, 233, 230);\n}\n\n.context-menu-item:hover:first-child {\n border-top-left-radius: 6px;\n border-top-right-radius: 6px;\n}\n\n.context-menu-item:hover:last-child {\n border-bottom-left-radius: 6px;\n border-bottom-right-radius: 6px;\n}\n\n.context-menu-item .caret-holder {\n align-self: flex-end;\n}\n\n.context-menu-item .caret-holder .sub-menu {\n z-index: 1;\n position: relative;\n}\n\n.context-menu-item-label {\n flex-grow: 1;\n}\n",".low-menu {\n z-index: 2;\n position: absolute;\n top: 0;\n margin: 0px;\n border: 2px solid rgb(17, 20, 24);\n border-top-right-radius: 4px;\n border-bottom-left-radius: 4px;\n border-bottom-right-radius: 4px;\n background-color: rgb(17, 20, 24);\n font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',\n 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;\n font-size: 9pt;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n box-shadow: 2px 2px 2px rgb(64, 64, 64, 0.5);\n opacity: 0.5;\n transition: opacity 0.3s linear;\n display: flex;\n flex-wrap: wrap;\n flex-direction: row;\n gap: 2px;\n row-gap: 2px;\n}\n\n.low-menu:hover {\n opacity: 1;\n}\n\n.low-menu-item {\n background-color: rgb(251, 253, 246);\n border: 0;\n border-radius: 4px;\n color: rgb(17, 20, 24);\n cursor: pointer;\n padding: 0 4px;\n position: relative;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n white-space: nowrap;\n}\n\n.low-menu-item.disabled {\n background-color: rgba(200, 200, 200);\n cursor: not-allowed;\n}\n\n.low-menu-item:not(.disabled):hover {\n background-color: rgb(251, 233, 230);\n}\n\n.low-menu-item .caret-holder {\n align-self: flex-end;\n}\n\n.low-menu-item .caret-holder .sub-menu {\n z-index: 1;\n position: relative;\n}\n",".contextwindow {\n z-index: 2001;\n border: 1px black solid;\n margin: 0;\n padding: 4px;\n background-color: rgb(250, 250, 250);\n box-shadow: 6px 6px 6px rgb(64, 64, 64, 0.5);\n transition: opacity 0.25s linear;\n justify-content: flex-start;\n position: absolute;\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n border-bottom-left-radius: 8px;\n resize: both;\n overflow: auto;\n}\n\n.contextwindow-title {\n border-bottom: 1px black dashed;\n padding-bottom: 4px;\n margin: 0 4px 3px 4px;\n height: 24px;\n max-height: 24px;\n cursor: grab;\n align-items: top;\n display: flex;\n width: calc(100% - 8px);\n}\n\n.contextwindow-title.moving {\n cursor: grabbing;\n}\n\n.contextwindow-title-text {\n font-size: 18px;\n font-weight: 600;\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n width: calc(100% - 16px);\n}\n\n.contextwindow-title-close {\n display: inline-block;\n color: black;\n background-color: white;\n height: 16px;\n width: 16px;\n border-radius: 3px;\n margin-left: 2px;\n cursor: pointer;\n}\n\n.contextwindow-title-close:hover {\n background-color: black;\n color: white;\n}\n\n.contextwindow-body {\n overflow: auto;\n padding-bottom: 8px;\n margin-right: 4px;\n height: calc(100% - 40px);\n}\n\n.contextwindow-body::-webkit-scrollbar {\n width: 8px;\n height: 8px;\n}\n\n.contextwindow-body::-webkit-scrollbar-track {\n background: white;\n border-radius: 8px;\n}\n\n.contextwindow-body::-webkit-scrollbar-thumb {\n background: lightgrey;\n border: none;\n border-radius: 8px;\n}\n\n.contextwindow-body::-webkit-scrollbar-thumb:hover {\n background: grey;\n}\n"],"names":[],"version":3,"file":"main.css.map"}
1
+ {"mappings":"ACAA;;;;;;AAMA;;;;;AAKA;;;;;;;;;;;;;;AAgBA;;;;AAIA;;;;;;;;;;;;AAYA;;;;;AAKA;;;;AAIA;;;;AAIA;;;;AAIA;;;;AAIA;;;;;AAKA;;;;;ACrEA;;;;;;;;;;;;;;;;;;;;;AAwBA;;;;AAIA;;;;AAKA;;;;;;;;;;;;;AAaA;;;;;AAKA;;;;AAIA;;;;AAIA;;;;;AC3DA;;;;AAIA;;;;;;;;;;;;;;;;;AAiBA;;;;;;;;;;;;AAYA;;;;AAIA;;;;;;;;;;AAUA;;;;;;;;;;;AAWA;;;;;AAKA;;;;;;;AAOA;;;;;AAKA;;;;;AAKA;;;;;;AAMA","sources":["73c443d00d29748b","src/components/ContextMenu.module.css","src/components/LowMenu.module.css","src/components/ContextWindow.module.css"],"sourcesContent":["@import \"630df238250c5b7f\";\n@import \"c4d631588337cb29\";\n@import \"864ea8cd88b57e56\";\n",".anchor {\n position: absolute;\n top: 0;\n left: 0;\n}\n\n.contextMenuHandler {\n height: fit-content;\n width: fit-content;\n}\n\n.contextMenu {\n position: absolute;\n visibility: hidden;\n border: 1px solid;\n border-color: rgb(17, 20, 24);\n opacity: 1;\n background-color: rgb(251, 253, 246);\n z-index: 10000;\n box-shadow: 4px 4px 4px rgb(64, 64, 64, 0.75);\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Roboto\", \"Oxygen\", \"Ubuntu\",\n \"Cantarell\", \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\", sans-serif;\n font-size: 9pt;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n\n.contextMenu.visible {\n visibility: inherit;\n}\n\n.contextMenuItem {\n color: rgb(17, 20, 24);\n cursor: pointer;\n padding: 0 4px;\n min-width: 80px;\n position: relative;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n white-space: nowrap;\n}\n\n.contextMenuItem.disabled {\n background-color: rgba(0, 0, 0, 0.2);\n cursor: not-allowed;\n}\n\n.contextMenuItem:first-child {\n padding-top: 4px;\n}\n\n.contextMenuItem:last-child {\n padding-bottom: 4px;\n}\n\n.contextMenuItem:not(.disabled):hover {\n background-color: rgb(251, 233, 230);\n}\n\n.contextMenuItem .caretHolder {\n align-self: flex-end;\n}\n\n.contextMenuItem .caretHolder .subMenu {\n z-index: 1;\n position: relative;\n}\n\n.contextMenuItemLabel {\n flex-grow: 1;\n height: 19px;\n}\n",".lowMenu {\n z-index: 2;\n position: absolute;\n top: 0;\n margin: 0px;\n border: 2px solid rgb(17, 20, 24);\n border-top-right-radius: 4px;\n border-bottom-left-radius: 4px;\n border-bottom-right-radius: 4px;\n background-color: rgb(17, 20, 24);\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Roboto\", \"Oxygen\", \"Ubuntu\",\n \"Cantarell\", \"Fira Sans\", \"Droid Sans\", \"Helvetica Neue\", sans-serif;\n font-size: 9pt;\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n box-shadow: 2px 2px 2px rgb(64, 64, 64, 0.5);\n transition: opacity 0.3s linear;\n display: flex;\n flex-wrap: wrap;\n flex-direction: row;\n gap: 2px;\n row-gap: 2px;\n}\n\n.lowMenu.hidden {\n opacity: 0;\n}\n\n.lowMenu.visible,\n.lowMenu:hover {\n opacity: 1;\n}\n\n.lowMenuItem {\n background-color: rgb(251, 253, 246);\n border: 0;\n color: rgb(17, 20, 24);\n cursor: pointer;\n padding: 0 4px;\n position: relative;\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n white-space: nowrap;\n}\n\n.lowMenuItem.disabled {\n background-color: rgba(200, 200, 200);\n cursor: not-allowed;\n}\n\n.lowMenuItem:not(.disabled):hover {\n background-color: rgb(251, 233, 230);\n}\n\n.lowMenu-item .caretHolder {\n align-self: flex-end;\n}\n\n.lowMenuItem .caretHolder .subMenu {\n z-index: 1;\n position: relative;\n}\n",".contextWindowAnchor {\n position: relative;\n}\n\n.contextWindow {\n z-index: 2001;\n border: 1px black solid;\n margin: 0;\n padding: 4px;\n background-color: rgb(250, 250, 250);\n box-shadow: 6px 6px 6px rgb(64, 64, 64, 0.5);\n transition: opacity 0.25s linear;\n justify-content: flex-start;\n position: absolute;\n border-top-left-radius: 8px;\n border-top-right-radius: 8px;\n border-bottom-left-radius: 8px;\n resize: both;\n overflow: auto;\n}\n\n.contextWindowTitle {\n border-bottom: 1px black dashed;\n padding-bottom: 4px;\n margin: 0 4px 3px 4px;\n height: 24px;\n max-height: 24px;\n cursor: grab;\n align-items: top;\n display: flex;\n width: calc(100% - 8px);\n}\n\n.contextWindowTitle.moving {\n cursor: grabbing;\n}\n\n.contextWindowTitleText {\n font-size: 18px;\n font-weight: 600;\n display: inline-block;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n width: calc(100% - 16px);\n}\n\n.contextWindowTitleClose {\n display: inline-block;\n color: black;\n background-color: white;\n height: 16px;\n width: 16px;\n border-radius: 3px;\n margin-left: 2px;\n cursor: pointer;\n}\n\n.contextWindowTitleClose:hover {\n background-color: black;\n color: white;\n}\n\n.contextWindowBody {\n overflow: auto;\n padding-bottom: 8px;\n margin-right: 4px;\n height: calc(100% - 40px);\n}\n\n.contextWindowBody::-webkit-scrollbar {\n width: 8px;\n height: 8px;\n}\n\n.contextWindowBody::-webkit-scrollbar-track {\n background: white;\n border-radius: 8px;\n}\n\n.contextWindowBody::-webkit-scrollbar-thumb {\n background: lightgrey;\n border: none;\n border-radius: 8px;\n}\n\n.contextWindowBody::-webkit-scrollbar-thumb:hover {\n background: grey;\n}\n"],"names":[],"version":3,"file":"main.css.map"}