aloha-vue 1.0.149 → 1.0.150

package/docs/src/components/TheMenu/TheMenu.js

@@ -47,6 +47,16 @@ export default {
           },
           icon: "EyeOpen",
         },
+        {
+          group: "Hola",
+          id: "cloak2",
+          label: "Cloak disabled",
+          to: {
+            name: "PageCloak",
+          },
+          icon: "EyeOpen",
+          disabled: true,
+        },
         {
           group: "Hola",
           id: "loading",

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "aloha-vue",
   "description": "Project aloha",
-  "version": "1.0.149",
+  "version": "1.0.150",
   "author": "Ilia Brykin",
   "scripts": {
     "build-icons": "node scriptsNode/iconsSvgToJs.js bootstrap3 && node scriptsNode/iconsSvgToJs.js bootstrap-1-9-1"

package/src/AMenu/AMenuPanelLink.js

@@ -76,6 +76,10 @@ export default {
       return undefined;
     });
 
+    const isLinkDisabled = computed(() => {
+      return !!item.value.disabled;
+    });
+
     const isLinkVisible = computed(() => {
       if (isLinkInSearchPanel.value) {
         return !!idsSearchVisible.value.rest[item.value[AKeyId]];
@@ -121,6 +125,13 @@ export default {
       return item.value.title || labelWithoutFilter.value;
     });
 
+    const toLocal = computed(() => {
+      if (isLinkDisabled.value) {
+        return "#";
+      }
+      return item.value.to;
+    });
+
     const openSubMenu = () => {
       togglePanel({ parentId: id.value, isLinkInSearchPanel: isLinkInSearchPanel.value });
       setFocusToFirstLinkInPanel(id.value);
@@ -148,6 +159,7 @@ export default {
       countChildren,
       currentSlot,
       icon,
+      isLinkDisabled,
       isLinkTruncated,
       isLinkVisible,
       label,
@@ -155,6 +167,7 @@ export default {
       onKeydown,
       openSubMenu,
       title,
+      toLocal,
     };
   },
   render() {
@@ -196,8 +209,10 @@ export default {
         }) :
         this.item.to ?
           h(resolveComponent("RouterLink"), {
-            class: "a_menu__link a_menu__link__text_truncated",
-            to: this.item.to,
+            class: ["a_menu__link a_menu__link__text_truncated", {
+              a_menu__link_disabled: this.isLinkDisabled,
+            }],
+            to: this.toLocal,
             tabindex: this.isPanelOpen ? 0 : -1,
             onClick: this.clickLink,
           }, () => ICON_AND_TEXT) :

package/src/styles/components/AMenu.scss

@@ -193,6 +193,10 @@ $a_menu_breakpoint_mobile: 991px;
     box-shadow: inset 0 0 1px 4px var(--a_menu_icon_focus_shadow_color);
   }
 }
+.a_menu__link_disabled {
+  opacity: .8;
+  cursor: not-allowed;
+}
 .a_menu__link__text_truncated {
   text-overflow: ellipsis;
   white-space: nowrap;