@vc-shell/framework 1.2.4-beta.8 → 2.0.0-alpha.1

package/shared/components/blade-navigation/components/vc-blade-view/vc-blade-view.ts

@@ -1,188 +0,0 @@
-import {
-  h,
-  provide,
-  ref,
-  VNode,
-  PropType,
-  Component,
-  reactive,
-  computed,
-  toRefs,
-  Slot,
-  defineComponent,
-  SetupContext,
-  onErrorCaptured,
-} from "vue";
-import { BladeInstance, navigationViewLocation, BLADE_BACK_BUTTON } from "@framework/injection-keys";
-import { BladeVNode, CoreBladeExposed, IBladeInstance } from "@shared/components/blade-navigation/types";
-import { toRef, watchTriggerable } from "@vueuse/core";
-import { DisplayableError } from "@core/utilities/error";
-import { Breadcrumbs } from "@ui/types";
-import { FALLBACK_BLADE_ID } from "@core/constants";
-
-/**
- * Normalizes slot content
- * @param slot The slot to normalize
- * @param data The data to pass to the slot
- * @returns Normalized slot content or null
- */
-function normalizeSlot(slot: Slot | undefined, data: { Component: VNode }): VNode | VNode[] | null {
-  if (!slot) return null;
-  const slotContent = slot(data);
-  return slotContent.length === 1 ? slotContent[0] : slotContent;
-}
-
-// Define the props type for type safety
-interface BladeViewProps {
-  blade?: BladeVNode;
-  expandable?: boolean;
-  error?: DisplayableError | Error | null | undefined;
-  breadcrumbs?: Breadcrumbs[];
-  backButton?: Component;
-}
-
-export const VcBladeView = defineComponent({
-  name: "BladeView",
-  inheritAttrs: false,
-  props: {
-    blade: {
-      type: Object as PropType<BladeVNode>,
-    },
-    expandable: {
-      type: Boolean,
-    },
-    error: {
-      type: Object as PropType<DisplayableError | Error | null | undefined>,
-      default: null,
-    },
-    breadcrumbs: {
-      type: Array as PropType<Breadcrumbs[]>,
-    },
-    backButton: {
-      type: Object as PropType<Component>,
-      default: undefined,
-    },
-  },
-  setup(props: BladeViewProps, { attrs, slots }: SetupContext) {
-    const maximized = ref<boolean>(false);
-    const viewRef = ref<CoreBladeExposed | undefined>();
-
-    const bl = toRef(props.blade);
-    const { backButton } = toRefs(props);
-
-    /**
-     * Links the blade instance to its navigation object.
-     *
-     * This is a crucial part of the blade navigation system:
-     * 1. When a blade is mounted, we need to associate its instance with the navigation props
-     * 2. This creates a two-way reference where the blade knows about its navigation context
-     * 3. The navigation instance property is implemented as a getter to ensure it always returns
-     *    the current value of viewRef
-     *
-     * The flush:sync option ensures this happens immediately in the same tick to prevent
-     * timing issues where the instance might not be available when needed.
-     */
-    const linkBladeInstanceToNavigation = (): void => {
-      const instance = viewRef.value;
-      const blade = bl.value;
-
-      if (!instance || !blade || !blade.props?.navigation) {
-        return;
-      }
-
-      // Create a reactive getter for the instance property
-      // This ensures that navigation.instance always returns the current viewRef value
-      Object.defineProperty(blade.props.navigation, "instance", {
-        get: () => instance,
-        configurable: true,
-        enumerable: true,
-      });
-    };
-
-    // Use watchTriggerable to manually invoke the linking process when needed
-    const { trigger: syncNavigationWithInstance } = watchTriggerable(
-      () => [viewRef.value, bl.value] as const,
-      () => linkBladeInstanceToNavigation(),
-      { flush: "sync" },
-    );
-
-    // Provide the navigation view location without using non-null assertion
-    if (bl.value) {
-      provide(navigationViewLocation, bl.value);
-    }
-
-    provide(BLADE_BACK_BUTTON, backButton);
-
-    provide(
-      BladeInstance,
-      computed<IBladeInstance>(() => ({
-        id: (bl.value?.type.name ?? FALLBACK_BLADE_ID).toLowerCase(),
-        param: bl.value?.props?.param,
-        options: bl.value?.props?.options,
-        expandable: props.expandable ?? false,
-        maximized: maximized.value,
-        error: props.error ?? null,
-        navigation: bl.value?.props?.navigation,
-        breadcrumbs: props.breadcrumbs,
-        title: bl.value?.props?.navigation?.instance?.title,
-      })),
-    );
-
-    /**
-     * Handler for expanding the blade
-     */
-    const onExpand = (): void => {
-      maximized.value = true;
-    };
-
-    /**
-     * Handler for collapsing the blade
-     */
-    const onCollapse = (): void => {
-      maximized.value = false;
-    };
-
-    /**
-     * Callback function onClose, which is passed while opening blade, called when a BladeVNode is unmounted.
-     * @param vnode The unmounted VNode.
-     */
-    const onVnodeUnmounted: BladeVNode["props"]["onVnodeUnmounted"] = (vnode): void => {
-      if (vnode.component?.isUnmounted && typeof vnode.props?.navigation?.onClose === "function") {
-        vnode.props.navigation.onClose();
-      }
-    };
-
-    /**
-     * Callback function onOpen, which is passed while opening blade, called when a BladeVNode is mounted.
-     * @param vnode The mounted VNode.
-     */
-    const onVnodeMounted: BladeVNode["props"]["onVnodeMounted"] = (vnode): void => {
-      if (vnode.component?.isMounted) {
-        // Synchronize the blade instance with navigation when the component is mounted
-        syncNavigationWithInstance();
-
-        if (typeof vnode.props?.navigation?.onOpen === "function") {
-          vnode.props.navigation.onOpen();
-        }
-      }
-    };
-
-    return () => {
-      if (props.blade) {
-        const component = h(
-          props.blade as Component,
-          Object.assign({}, attrs, {
-            ref: viewRef,
-            onVnodeUnmounted,
-            onVnodeMounted,
-            "onExpand:blade": onExpand,
-            "onCollapse:blade": onCollapse,
-          }),
-        );
-
-        return normalizeSlot(slots.default, { Component: component });
-      }
-      return null;
-    };
-  },
-});

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

@@ -1,5 +0,0 @@
-export { useBladeNavigation } from "@shared/components/blade-navigation/composables/useBladeNavigationAdapter";
-export { useBladeNavigation as useBladeNavigationAdapter } from "@shared/components/blade-navigation/composables/useBladeNavigationAdapter";
-export type { IUseBladeNavigation } from "@shared/components/blade-navigation/composables/useBladeNavigationAdapter";
-export { createBladeStack, useBladeStack } from "@shared/components/blade-navigation/composables/useBladeStack";
-export { createBladeMessaging, useBladeMessaging } from "@shared/components/blade-navigation/composables/useBladeMessaging";

package/shared/components/blade-navigation/composables/useBladeMessaging.test.ts

@@ -1,189 +0,0 @@
-import { describe, it, expect, vi, beforeEach } from "vitest";
-import { computed, ref } from "vue";
-import { createBladeMessaging } from "@shared/components/blade-navigation/composables/useBladeMessaging";
-import { createBladeStack } from "@shared/components/blade-navigation/composables/useBladeStack";
-import type { IBladeRegistry } from "@core/composables/useBladeRegistry";
-import type { IBladeStack, IBladeMessaging } from "@shared/components/blade-navigation/types";
-
-// ── Mock registry ──────────────────────────────────────────────────────────────
-
-function createMockRegistry(): IBladeRegistry {
-  const map = new Map<string, any>([
-    ["Workspace", { component: {} as any, route: "/workspace" }],
-    ["Child", { component: {} as any, route: "/child" }],
-    ["GrandChild", { component: {} as any, route: "/grandchild" }],
-  ]);
-
-  return {
-    registeredBladesMap: computed(() => map),
-    getBlade: (name: string) => map.get(name),
-    getBladeComponent: (name: string) => map.get(name)?.component,
-    getBladeByRoute: (route: string) => {
-      const normalized = route.replace(/^\/+/, "");
-      for (const [name, data] of map.entries()) {
-        if (data.route?.replace(/^\/+/, "") === normalized) return { name, data };
-      }
-      return undefined;
-    },
-  };
-}
-
-// ── Tests ──────────────────────────────────────────────────────────────────────
-
-describe("createBladeMessaging", () => {
-  let stack: IBladeStack;
-  let messaging: IBladeMessaging;
-
-  beforeEach(async () => {
-    stack = createBladeStack(createMockRegistry());
-    messaging = createBladeMessaging(stack);
-
-    // Set up: Workspace → Child
-    await stack.openWorkspace({ name: "Workspace" });
-    await stack.openBlade({ name: "Child", param: "c1" });
-  });
-
-  // ── exposeToChildren + callParent ──────────────────────────────────────────
-
-  describe("exposeToChildren + callParent", () => {
-    it("child can call parent's exposed method", async () => {
-      const reloadFn = vi.fn().mockResolvedValue("reloaded");
-
-      // Workspace exposes "reload" to its children
-      const wsId = stack.workspace.value!.id;
-      messaging.exposeToChildren(wsId, { reload: reloadFn });
-
-      // Child calls parent's "reload"
-      const childId = stack.blades.value[1].id;
-      const result = await messaging.callParent(childId, "reload");
-
-      expect(reloadFn).toHaveBeenCalledOnce();
-      expect(result).toBe("reloaded");
-    });
-
-    it("passes args to parent method", async () => {
-      const updateFn = vi.fn().mockResolvedValue(true);
-
-      const wsId = stack.workspace.value!.id;
-      messaging.exposeToChildren(wsId, { update: updateFn });
-
-      const childId = stack.blades.value[1].id;
-      await messaging.callParent(childId, "update", { id: 42 });
-
-      expect(updateFn).toHaveBeenCalledWith({ id: 42 });
-    });
-
-    it("supports multiple methods", async () => {
-      const reloadFn = vi.fn().mockResolvedValue("ok");
-      const deleteFn = vi.fn().mockResolvedValue("deleted");
-
-      const wsId = stack.workspace.value!.id;
-      messaging.exposeToChildren(wsId, {
-        reload: reloadFn,
-        delete: deleteFn,
-      });
-
-      const childId = stack.blades.value[1].id;
-      await messaging.callParent(childId, "reload");
-      await messaging.callParent(childId, "delete");
-
-      expect(reloadFn).toHaveBeenCalledOnce();
-      expect(deleteFn).toHaveBeenCalledOnce();
-    });
-
-    it("works across multiple levels", async () => {
-      // Add grandchild: Workspace → Child → GrandChild
-      const childId = stack.blades.value[1].id;
-      await stack.openBlade({ name: "GrandChild", param: "g1", parentId: childId });
-
-      const saveItemFn = vi.fn().mockResolvedValue("saved");
-
-      // Child exposes "saveItem" to its children
-      messaging.exposeToChildren(childId, { saveItem: saveItemFn });
-
-      // GrandChild calls parent's "saveItem"
-      const grandChildId = stack.blades.value[2].id;
-      const result = await messaging.callParent(grandChildId, "saveItem", { data: "test" });
-
-      expect(saveItemFn).toHaveBeenCalledWith({ data: "test" });
-      expect(result).toBe("saved");
-    });
-  });
-
-  // ── Error cases ────────────────────────────────────────────────────────────
-
-  describe("error handling", () => {
-    it("throws when caller blade not found", async () => {
-      await expect(
-        messaging.callParent("non-existent-id", "reload"),
-      ).rejects.toThrow("not found in stack");
-    });
-
-    it("throws when caller has no parent", async () => {
-      // Workspace has no parent
-      const wsId = stack.workspace.value!.id;
-      await expect(
-        messaging.callParent(wsId, "reload"),
-      ).rejects.toThrow("has no parent");
-    });
-
-    it("throws when parent has no exposed methods", async () => {
-      // Child tries to call parent but parent hasn't exposed anything
-      const childId = stack.blades.value[1].id;
-      await expect(
-        messaging.callParent(childId, "reload"),
-      ).rejects.toThrow("no exposed methods");
-    });
-
-    it("throws when method not found on parent", async () => {
-      const wsId = stack.workspace.value!.id;
-      messaging.exposeToChildren(wsId, { reload: vi.fn() });
-
-      const childId = stack.blades.value[1].id;
-      await expect(
-        messaging.callParent(childId, "nonExistentMethod"),
-      ).rejects.toThrow("not found on parent");
-    });
-  });
-
-  // ── cleanup ────────────────────────────────────────────────────────────────
-
-  describe("cleanup", () => {
-    it("removes exposed methods after cleanup", async () => {
-      const wsId = stack.workspace.value!.id;
-      messaging.exposeToChildren(wsId, { reload: vi.fn() });
-
-      messaging.cleanup(wsId);
-
-      const childId = stack.blades.value[1].id;
-      await expect(
-        messaging.callParent(childId, "reload"),
-      ).rejects.toThrow("no exposed methods");
-    });
-
-    it("cleanup for non-existent blade is a no-op", () => {
-      // Should not throw
-      messaging.cleanup("non-existent-id");
-    });
-  });
-
-  // ── overwriting exposed methods ────────────────────────────────────────────
-
-  describe("overwriting exposed methods", () => {
-    it("last exposeToChildren wins", async () => {
-      const firstReload = vi.fn().mockResolvedValue("first");
-      const secondReload = vi.fn().mockResolvedValue("second");
-
-      const wsId = stack.workspace.value!.id;
-      messaging.exposeToChildren(wsId, { reload: firstReload });
-      messaging.exposeToChildren(wsId, { reload: secondReload });
-
-      const childId = stack.blades.value[1].id;
-      const result = await messaging.callParent(childId, "reload");
-
-      expect(firstReload).not.toHaveBeenCalled();
-      expect(secondReload).toHaveBeenCalledOnce();
-      expect(result).toBe("second");
-    });
-  });
-});

package/shared/components/blade-navigation/composables/useBladeMessaging.ts

@@ -1,81 +0,0 @@
-import { inject } from "vue";
-import type { IBladeMessaging, IBladeStack } from "@shared/components/blade-navigation/types";
-import { BladeMessagingKey } from "@shared/components/blade-navigation/types";
-
-/**
- * Creates the inter-blade messaging system.
- *
- * Uses a Map<bladeId, Record<string, Function>> to store exposed methods.
- * Child blades call parent methods via direct ID lookup (no tree walking).
- *
- * @param bladeStack - BladeStack for looking up blade descriptors by ID
- */
-export function createBladeMessaging(bladeStack: IBladeStack): IBladeMessaging {
-  // bladeId → Record of method name → function
-  const _exposedMethods = new Map<string, Record<string, (...args: any[]) => any>>();
-
-  function exposeToChildren(
-    bladeId: string,
-    methods: Record<string, (...args: any[]) => any>,
-  ): void {
-    _exposedMethods.set(bladeId, methods);
-  }
-
-  async function callParent<T = unknown>(
-    callerBladeId: string,
-    method: string,
-    args?: unknown,
-  ): Promise<T> {
-    // Find the caller blade to get its parentId
-    const callerBlade = bladeStack.blades.value.find((b) => b.id === callerBladeId);
-    if (!callerBlade) {
-      throw new Error(`[BladeMessaging] Caller blade '${callerBladeId}' not found in stack`);
-    }
-
-    if (!callerBlade.parentId) {
-      throw new Error(`[BladeMessaging] Blade '${callerBladeId}' has no parent`);
-    }
-
-    // Look up the parent's exposed methods
-    const parentMethods = _exposedMethods.get(callerBlade.parentId);
-    if (!parentMethods) {
-      throw new Error(
-        `[BladeMessaging] Parent blade '${callerBlade.parentId}' has no exposed methods`,
-      );
-    }
-
-    const fn = parentMethods[method];
-    if (typeof fn !== "function") {
-      throw new Error(
-        `[BladeMessaging] Method '${method}' not found on parent blade '${callerBlade.parentId}'`,
-      );
-    }
-
-    // Call the method and return the result
-    return (await fn(args)) as T;
-  }
-
-  function cleanup(bladeId: string): void {
-    _exposedMethods.delete(bladeId);
-  }
-
-  return {
-    exposeToChildren,
-    callParent,
-    cleanup,
-  };
-}
-
-/**
- * Composable for accessing BladeMessaging from within a component.
- * Must be used after BladeMessaging is provided via BladeMessagingKey.
- */
-export function useBladeMessaging(): IBladeMessaging {
-  const messaging = inject(BladeMessagingKey);
-  if (!messaging) {
-    throw new Error(
-      "[useBladeMessaging] BladeMessaging not found. Ensure BladeNavigationPlugin is installed.",
-    );
-  }
-  return messaging;
-}