@farm-investimentos/front-mfe-components 11.5.5 → 11.5.6

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@farm-investimentos/front-mfe-components",
-	"version": "11.5.5",
+	"version": "11.5.6",
 	"author": "farm investimentos",
 	"private": false,
 	"main": "./dist/front-mfe-components.common.js",

package/src/components/ContextMenu/ContextMenu.stories.js

@@ -27,7 +27,23 @@ export const Primary = () => ({
 					v-bind="attrs"
 					v-on="on"
 				>
-					toggle
+					open
+				</farm-btn>
+            </template>
+        </farm-contextmenu>
+	</div>`,
+});
+
+export const LongActivator = () => ({
+	template: `<div style="padding-left: 120px; padding-top: 80px; display: flex;">
+        <farm-contextmenu>
+            some text
+            <template v-slot:activator="{ on, attrs }">
+                <farm-btn
+					v-bind="attrs"
+					v-on="on"
+				>
+					Very long Activator
 				</farm-btn>
             </template>
         </farm-contextmenu>

package/src/components/ContextMenu/ContextMenu.vue

@@ -104,15 +104,23 @@ export default Vue.extend({
 				window.scrollY +
 				(!bottom.value ? 0 : activatorBoundingClientRect.height);
 
-			const w = popupClientRect.width < 96 ? 96 : popupClientRect.width;
-			let offsetLeft =
-				activatorBoundingClientRect.left + activatorBoundingClientRect.width / 2 - w / 2;
+			//
+
+			let offsetLeft = activatorBoundingClientRect.left;
 
 			styles.minWidth =
 				(activatorBoundingClientRect.width > 96
 					? parseInt(activatorBoundingClientRect.width)
 					: 96) + 'px';
 
+			if(activatorBoundingClientRect.width < 96) {
+				const w = popupClientRect.width < 96 ? 96 : popupClientRect.width;
+				offsetLeft =
+					activatorBoundingClientRect.left +
+					activatorBoundingClientRect.width / 2 -
+					w / 2;
+			}
+
 			//Do not allow to open outside window
 
 			const rightEdge = offsetLeft + popupClientRect.width;