how to mock some functions, export rest as actual of external module using builder alias / resolve

[nutrian]

I'm having trouble understanding mocking external pacakges. I think perhaps I don't fully understand the subpaths so please let me know if I'm going about it wrong. I have a monorepo with a local package called @packages/api -- I have story and component in @packages/mypkg that is importing a call from @packages/api and calling it. I'd like to mock only a few functions exported from this local monorepo package, and export the rest / actual. Since the component imports from @packages/api I believe I cannot use subpaths like #api for example, unless I am not understanding that correctly.

All of the documentation I have seen using the subpaths solution doesn't seem to show the component, or whatever is importing the library, how it imports that library.

Is the subpaths essentially an alias only within the context of storybook stories? Can my component still import from @packages/api, but my subpaths / stories would refer to #api and that is how it is supposed to be aligned? Can the subpaths default point to @packages/api ? All the examples show local files. Can the local wrapper & mock only be used in storybook the consuming code never actually refers to #api ?

https://storybook.js.org/docs/writing-stories/mocking-data-and-modules/mocking-modules#subpath-imports

So then I tried to use the builder aliases with webpack resolve, which seems to be working, at least the code gets swapped, however, I end up in a chicken or egg scenario, where my actual import within the mock file, everything seems to be undefined, because I assume I the import is now pointed to the mock file, which I am currently in. So how can I work around this and shim / mock while still exporting many of the original functions?

https://storybook.js.org/docs/writing-stories/mocking-data-and-modules/mocking-modules#builder-aliases

I looked for a help channel but I might be blind so please let me know if this is the wrong channel and should go in testing instead or somewhere else.

UPDATE:

I was able to get around this a bit further by creating an @packages/api-actual alias, but I now have a different problem, where I need to replace one single file inside that @packages/api, but is imported locally within that package.

main.ts

      // webpackFinal
      config.resolve.alias = {
        ...config.resolve.alias,
        "@packages/api": require.resolve("../src/api.mock"),
        "@packages/api-actual": getAbsolutePath("@packages/api");
      };

api.mock.ts

      import { fn } from "@storybook/test";
      import * as actual from "@packages/api-actual";

      export const Auth = {
        // i want to replace this particular function or the whole file from the other package
        // but its not overriding, the imported function from `@packages/api-actual` imports Auth from internal relative file 
        getAccessToken: () => {
          return "123";
        }
      };