@vc-shell/framework 1.0.86 → 1.0.88

package/dist/ui/components/organisms/vc-gallery/_internal/vc-gallery-item/vc-gallery-item.vue.d.ts

@@ -19,7 +19,7 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
         remove: any;
     };
     disableDrag: boolean;
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("preview" | "edit" | "remove")[], "preview" | "edit" | "remove", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
+}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("remove" | "preview" | "edit")[], "remove" | "preview" | "edit", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToRuntimeProps<Props>, {
     readonly: boolean;
     actions: () => {
         name: any;
@@ -30,8 +30,8 @@ declare const _default: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_T
     disableDrag: boolean;
 }>>> & {
     onEdit?: (...args: any[]) => any;
-    onPreview?: (...args: any[]) => any;
     onRemove?: (...args: any[]) => any;
+    onPreview?: (...args: any[]) => any;
 }, {
     disableDrag: boolean;
     actions: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vc-shell/framework",
-  "version": "1.0.86",
+  "version": "1.0.88",
   "main": "./dist/framework.mjs",
   "module": "./dist/framework.mjs",
   "types": "./dist/index.d.ts",
@@ -55,8 +55,8 @@
     "whatwg-fetch": "^3.6.2"
   },
   "devDependencies": {
-    "@vc-shell/api-client-generator": "^1.0.86",
-    "@vc-shell/config-generator": "^1.0.86",
+    "@vc-shell/api-client-generator": "^1.0.88",
+    "@vc-shell/config-generator": "^1.0.88",
     "@vitejs/plugin-vue": "^4.2.3",
     "sass": "^1.62.1",
     "typescript": "~5.0.4",

package/shared/components/blade-navigation/components/vc-blade-navigation/vc-blade-navigation.vue

@@ -13,6 +13,11 @@
         v-show="$isMobile.value ? !blades.length : blades.length <= 1"
         :key="route.path"
         :ref="(el: CoreBladeExposed) => setParentRef(el, Component)"
+        v-element-hover="
+          (state) => {
+            setActiveBlade(state, Component.type as Component);
+          }
+        "
         :closable="false"
         :options="workspaceOptions"
         :expanded="blades.length === 0"
@@ -39,6 +44,11 @@
         :is="blade.blade"
         v-show="i >= blades.length - ($isMobile.value ? 1 : 2)"
         :ref="(el: CoreBladeExposed) => setBladesRef(el, blade)"
+        v-element-hover="
+          (state) => {
+            setActiveBlade(state, blade.blade);
+          }
+        "
         :param="blade.param"
         :closable="i >= 0"
         :expanded="i === blades.length - 1"
@@ -59,6 +69,7 @@
 
 <script lang="ts" setup>
 import { computed, ref, VNode } from "vue";
+import type { Component } from "vue";
 import { useRoute } from "vue-router";
 import {
   IBladeContainer,
@@ -69,6 +80,8 @@ import {
   BladeConstructor,
 } from "./../../../../../shared";
 import { ErrorInterceptor } from "./../../../error-interceptor";
+import { vElementHover } from "@vueuse/components";
+import * as _ from "lodash-es";
 
 export interface Props {
   blades: IBladeContainer[];
@@ -82,6 +95,8 @@ export interface Emits {
   (event: "onParentCall", args: { id: number; args: IParentCallArgs }): void;
 }
 
+const activeBlade = ref();
+
 const emit = defineEmits<Emits>();
 
 withDefaults(defineProps<Props>(), {
@@ -95,6 +110,19 @@ const state = ref<IBladeRef[]>([]);
 
 const visibleBlades = computed(() => bladesRefs.value.slice(-2));
 
+const setActiveBlade = (state: boolean, el: Component) => {
+  const blade = bladesRefs.value.find((item) => _.isEqual(item.blade.blade, el));
+  if (blade) {
+    if (state) {
+      activeBlade.value = el;
+      Object.assign(blade, { active: true });
+    } else {
+      activeBlade.value = undefined;
+      Object.assign(blade, { active: false });
+    }
+  }
+};
+
 function handleMaximizeBlade(id: number, expand: boolean) {
   state.value = visibleBlades.value?.map((x: IBladeRef) => {
     if (x.blade.idx === id) {
@@ -112,6 +140,7 @@ function setParentRef(el: CoreBladeExposed, bladeNode: VNode) {
   if (el && bladeNode) {
     bladesRefs.value = [
       {
+        active: _.isEqual(activeBlade.value, bladeNode.type),
         exposed: el,
         blade: {
           blade: bladeNode.type as BladeConstructor,
@@ -127,7 +156,7 @@ function setBladesRef(el: CoreBladeExposed, blade: IBladeContainer) {
   if (el && el !== null && blade) {
     const isExists = bladesRefs.value.some((item) => item.blade.idx === blade.idx);
     if (!isExists) {
-      bladesRefs.value.push({ exposed: el, blade });
+      bladesRefs.value.push({ active: _.isEqual(activeBlade.value, blade), exposed: el, blade });
     }
   }
 }

package/shared/components/blade-navigation/composables/useBladeNavigation/index.ts

@@ -39,6 +39,7 @@ interface IUseBladeNavigation {
   readonly workspaceParam: Ref<string>;
   readonly lastBladeData: Ref<BladeData>;
   bladesRefs: Ref<IBladeRef[]>;
+  activeBlade: Ref<IBladeContainer>;
   openBlade: <Blade extends ComponentPublicInstance = ComponentPublicInstance>(
     { blade, param, options, onOpen, onClose }: IBladeEvent<Blade>,
     isWorkspace?: boolean
@@ -59,7 +60,7 @@ interface IUseBladeNavigation {
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 const workspaceOptions: Ref<Record<string, any>> = ref();
 const workspaceParam: Ref<string> = ref();
-
+const activeBlade = ref();
 const lastBladeData = useLocalStorage<BladeData>("VC_BLADE_DATA", {});
 
 export function useBladeNavigation(): IUseBladeNavigation {
@@ -124,34 +125,38 @@ export function useBladeNavigation(): IUseBladeNavigation {
       return;
     }
 
-    // caller blade component from instance
-    const instanceComponent = instance && instance.vnode.type;
+    // caller blade component
+    const instanceComponent =
+      navigationInstance.bladesRefs.value.find((item) => item.active)?.blade?.blade ??
+      (instance && instance.vnode.type);
 
-    // Caller blade index in blades array
-    const callerIndex = navigationInstance.bladesRefs.value.findIndex((item) => {
-      return _.isEqual(item.blade.blade, instanceComponent);
-    });
+    if (instanceComponent) {
+      // Caller blade index in blades array
+      const callerIndex = navigationInstance.bladesRefs.value.findIndex((item) => {
+        return _.isEqual(item.blade.blade, instanceComponent);
+      });
 
-    // Trying to determine if the calling blade already has a child in order to replace it
-    const isBladeAlreadyExist =
-      callerIndex >= 0 ? navigationInstance.bladesRefs.value[callerIndex + 1]?.blade.blade : undefined;
+      // Trying to determine if the calling blade already has a child in order to replace it
+      const isBladeAlreadyExist =
+        callerIndex >= 0 ? navigationInstance.bladesRefs.value[callerIndex + 1]?.blade.blade : undefined;
 
-    // Blade we want to open
-    const bladeComponent = unref(blade);
+      // Blade we want to open
+      const bladeComponent = unref(blade);
 
-    // Check if caller blade has idx
-    const index = instanceComponent?.idx ? instanceComponent.idx : 0;
+      // Check if caller blade has idx
+      const index = instanceComponent?.idx ? instanceComponent.idx : 0;
 
-    if (isBladeAlreadyExist === undefined) {
-      bladeComponent.idx = index ? index + 1 : 1;
-    } else if (isBladeAlreadyExist) {
-      await closeBlade(
-        navigationInstance.blades.value.findIndex((x: IBladeContainer) => x.idx === isBladeAlreadyExist.idx)
-      );
-      bladeComponent.idx = isBladeAlreadyExist.idx;
-    }
-    if (!isPrevented.value) {
-      await addBlade(bladeComponent, param, options, onOpen, onClose, index);
+      if (isBladeAlreadyExist === undefined) {
+        bladeComponent.idx = index ? index + 1 : 1;
+      } else if (isBladeAlreadyExist) {
+        await closeBlade(
+          navigationInstance.blades.value.findIndex((x: IBladeContainer) => x.idx === isBladeAlreadyExist.idx)
+        );
+        bladeComponent.idx = isBladeAlreadyExist.idx;
+      }
+      if (!isPrevented.value) {
+        await addBlade(bladeComponent, param, options, onOpen, onClose, index);
+      }
     }
   }
 
@@ -296,6 +301,7 @@ export function useBladeNavigation(): IUseBladeNavigation {
     workspaceOptions: computed(() => workspaceOptions.value),
     workspaceParam: computed(() => workspaceParam.value),
     lastBladeData: computed(() => lastBladeData.value),
+    activeBlade,
     bladesRefs: navigationInstance.bladesRefs,
     openBlade,
     closeBlade,

package/shared/components/blade-navigation/types/index.ts

@@ -72,6 +72,7 @@ export interface IBladeRef {
   exposed: CoreBladeExposed;
   blade: IBladeContainer;
   expanded?: boolean;
+  active?: boolean;
 }
 
 export interface BladeNavigationPlugin {

package/ui/components/molecules/vc-select/vc-select.vue

@@ -870,7 +870,7 @@ async function onSearch(value: string) {
     }
   } else {
     optionsTemp.value = optionsList.value.filter((x) => {
-      return x[getOptionLabel.value(x)].toLowerCase().includes(filterString.value.toLowerCase());
+      return x[props.optionLabel as string].toLowerCase().includes(filterString.value.toLowerCase());
     });
   }
 }