Typescript emitted declarations cannot find name of global interface

This issue is in a private CDN library. I want to generate TypeScript declaration files for development use by apps that integrate the library. My issue is that my generated declaration files have 'cannot find name' errors regarding correctly-defined global interfaces.

First, the CDN library's compiler options have emitDeclarationOnly and declaration true. This correctly puts the declarations into the directory "types."

 "compilerOptions": {
    "module": "es2020",
    "target": "es2020",
    "sourceMap": true,
    "checkJs": true,
    "allowJs": true,
    "emitDeclarationOnly": true,
    "declaration": true,
    "outDir": "types"

    // .... paths etc. omitted
  }

Second, I have a global interface declaration file that declares about 7 or 8 different interfaces.

// global.ts
    interface ComponentToggle {
        component: HTMLElement,

        // other properties here
    }

    // more interfaces here

Third, the original JavaScript source files are able to use the global interfaces inside the JSDocs. These files use JSDocs to define their TypeScript information. They compile to .d.ts files without any errors.

// otherfile.js
    /** Removes active state from all options.
     *
     * @param toggle {ComponentToggle} the parent element toggle message
     */
    inactivate( { component } ) {
        if ( component.contains( this ) ) {
            this.getOptions( true ).forEach( option => option.inactivate() );
        }
    }

The generated d.ts files are all correct.

// global.d.ts
    interface ComponentToggle {
        component: HTMLElement,

        // identical to the ts file
    }

// otherfile.d.ts
    /** Removes active state from all options.
     *
     * @param toggle {ComponentToggle} the parent element toggle message
     */
    inactivate({ component }: ComponentToggle): void;

Now we get to the problem. When trying to use otherfile.d.ts, there is a new TypeScript error:

TS2304: Cannot find name 'ComponentToggle'.

Can anyone explain what is going on? How is it that the global interface ComponentToggle cannot be found here when it was literally just used to generate this file?

EDIT: Mainly, I notice there is an issue as soon as I open affected d.ts files, because the WebStorm parser flags them.

As requested, here is the tsconfig of the app I am using to test this, which is also not a TypeScript application. I don't have ownership of any of the apps that will be consuming this library. Because this is for CDN use, the library is defined in the source code using local paths starting with /xxxyyy/ (see below) that are defined as "externals" in Webpack and also as proxy paths in Karma. The build (minus tsc) and unit tests run fine, and the types of the library are correctly found. WebStorm correctly displays the types and hints for the files that do not have this issue, and running tsc outputs the exact same errors that WebStorm displays when I open the files.

The consuming application:

{
  "include": [
    "src/**/*"
  ],
  "exclude": [
    "node_modules",
    "ci-output",
    "unitTest",
    "tutorials",
    "lib"
  ],
  "compilerOptions": {
    "module": "es2020",
    "target": "es2020",
    "sourceMap": true,
    "checkJs": true,
    "allowJs": true,
    "emitDeclarationOnly": true,
    "declaration": true,
    "outDir": "types",
    "downlevelIteration": true,
    "baseUrl": ".",
    "paths": {
      "*": [ "AppMain", "./src/component/app-main.js" ],
      "/xxxyyy/libraryname.min.js": [ "libraryname", "./node_modules/@xxxyyy/libraryname/types/index.d.ts" ],
      "/xxxyyy/libraryname.js": [ "libraryname", "./node_modules/@xxxyyy/libraryname/types/index.d.ts" ]
    }
  }
}

The library itself:

{
  "include": [
    "src/**/*"
  ],
  "exclude": [
    "node_modules",
    "ci-output",
    "conf",
    "jsdocTemplate",
    "unitTest",
    "tutorials"
  ],
  "compilerOptions": {
    "module": "es2020",
    "target": "es2020",
    "sourceMap": true,
    "checkJs": true,
    "allowJs": true,
    "emitDeclarationOnly": true,
    "declaration": true,
    "outDir": "types",
    "baseUrl": "./",
    "paths": {
      "*": [ "MainComponent", "./src/component/MainComponent.js" ]
    }
  }
}

EDIT 2 Okay, since nobody seems to have any answers for me, I'll try another approach. Every single one of these globals fits one of the following categories:

1. A "polyfill" because TypeScript's built-in definitions of Window are missing things.

• window.CustomEventListener: see https://github.com/microsoft/TypeScript/issues/28357
• window.ResizeObserverEntry: see https://github.com/microsoft/TypeScript/issues/37861

2. Definitions of what some functions expect to receive as object parameters.

• In the example above, I defined ComponentToggle because there are many functions that take a single object as their parameter, and that object has a specific set of properties that will be destructured. I want to define those properties so that the consuming app will know how to call the functions.

Is there anything I can do to meet requirements #1 and #2 that does not involve creating a global.ts file?

If not, how do I get the generated global.d.ts file to get consumed by WebStorm and the app? Do I set configurations in "paths", "types", "typeRoots", or something else I haven't heard of yet?

Also, the comments on this question seem to assume I know things. I know nothing at all about TypeScript. I could very well be making the most beginner of errors here.