@thinkpixellab-public/px-vue 3.0.91 → 3.0.93
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.
|
@@ -13,7 +13,10 @@
|
|
|
13
13
|
:class="bem(variantsMap)"
|
|
14
14
|
:popupClass="[bem('popup', variantsMap), popupClass]"
|
|
15
15
|
:tag="'button'"
|
|
16
|
+
:label="buttonLabel"
|
|
16
17
|
:trigger="'click'"
|
|
18
|
+
:aria-expanded="dropdownExpanded ? 'true' : 'false'"
|
|
19
|
+
@update:popupVisible="dropdownExpanded = $event"
|
|
17
20
|
v-bind="popupProps"
|
|
18
21
|
ref="popup"
|
|
19
22
|
>
|
|
@@ -83,8 +86,14 @@ export default {
|
|
|
83
86
|
};
|
|
84
87
|
},
|
|
85
88
|
},
|
|
86
|
-
},
|
|
87
89
|
|
|
90
|
+
buttonLabel: { type: String, default: null },
|
|
91
|
+
},
|
|
92
|
+
data() {
|
|
93
|
+
return {
|
|
94
|
+
dropdownExpanded: false,
|
|
95
|
+
};
|
|
96
|
+
},
|
|
88
97
|
computed: {
|
|
89
98
|
allowMultiSelect() {
|
|
90
99
|
return false;
|
|
@@ -99,7 +108,6 @@ export default {
|
|
|
99
108
|
return this.getItemLabel(this.selectedItem);
|
|
100
109
|
},
|
|
101
110
|
},
|
|
102
|
-
|
|
103
111
|
mounted() {
|
|
104
112
|
this.select;
|
|
105
113
|
},
|
package/components/PxPopup.vue
CHANGED
|
@@ -34,6 +34,7 @@
|
|
|
34
34
|
<component
|
|
35
35
|
:is="tag"
|
|
36
36
|
:class="bem()"
|
|
37
|
+
:aria-label="label"
|
|
37
38
|
@click="onClick"
|
|
38
39
|
@contextmenu.stop="onContextMenu"
|
|
39
40
|
@mouseenter="onMouseEnter"
|
|
@@ -117,6 +118,8 @@ export default {
|
|
|
117
118
|
|
|
118
119
|
// for the popup to never be wider than the reference element
|
|
119
120
|
setPopupMaxWidth: { type: Boolean, default: false },
|
|
121
|
+
|
|
122
|
+
label: { type: String, default: null },
|
|
120
123
|
},
|
|
121
124
|
|
|
122
125
|
data() {
|
|
@@ -63,6 +63,10 @@ export default {
|
|
|
63
63
|
type: String,
|
|
64
64
|
default: null,
|
|
65
65
|
},
|
|
66
|
+
fixedLeave: {
|
|
67
|
+
type: Boolean,
|
|
68
|
+
default: false,
|
|
69
|
+
},
|
|
66
70
|
},
|
|
67
71
|
// data() { return { b: 0 }; },f
|
|
68
72
|
computed: {
|
|
@@ -181,7 +185,28 @@ export default {
|
|
|
181
185
|
...params.to,
|
|
182
186
|
duration: this.hideDur,
|
|
183
187
|
ease: this.hideEase,
|
|
184
|
-
|
|
188
|
+
onStart: () => {
|
|
189
|
+
if (this.fixedLeave && element) {
|
|
190
|
+
const rect = element.getBoundingClientRect();
|
|
191
|
+
element.style.width = `${rect.width}px`;
|
|
192
|
+
element.style.height = `${rect.height}px`;
|
|
193
|
+
element.style.top = `${rect.top}px`;
|
|
194
|
+
element.style.left = `${rect.left}px`;
|
|
195
|
+
element.style.position = 'fixed';
|
|
196
|
+
}
|
|
197
|
+
},
|
|
198
|
+
onComplete: () => {
|
|
199
|
+
if (this.fixedLeave && element) {
|
|
200
|
+
if (element) {
|
|
201
|
+
element.style.width = '';
|
|
202
|
+
element.style.height = '';
|
|
203
|
+
element.style.position = '';
|
|
204
|
+
element.style.top = '';
|
|
205
|
+
element.style.left = '';
|
|
206
|
+
}
|
|
207
|
+
}
|
|
208
|
+
done();
|
|
209
|
+
},
|
|
185
210
|
});
|
|
186
211
|
}
|
|
187
212
|
},
|