@appshell/loader 0.0.1-alpha.0

package/CHANGELOG.md

@@ -0,0 +1,8 @@
+# Change Log
+
+All notable changes to this project will be documented in this file.
+See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## 0.0.1-alpha.0 (2023-03-19)
+
+**Note:** Version bump only for package @appshell/loader

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2023 Navaris Technologies, LLC
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,60 @@
+<div align="center">
+  <a href="https://github.com/navaris/appshell">
+    <picture>
+      <source media="(prefers-color-scheme: dark)" srcset="https://github.com/navaris/appshell/blob/main/assets/branding/appshell-logo-white_2x.png">
+      <img alt="appshell" src="https://github.com/navaris/appshell/blob/main/assets/branding/appshell-logo_2x.png">
+    </picture>
+  </a>
+</div>
+
+[![Appshell CI](https://github.com/navaris/appshell/actions/workflows/pipeline.yml/badge.svg)](https://github.com/navaris/appshell/actions/workflows/pipeline.yml)
+
+# @appshell/loader
+
+Dynamically load federated components for Webpack Module federation micro-frontends.
+
+Working examples can be found [here](https://github.com/navaris/appshell/tree/main/examples).
+
+## Getting Started
+
+To begin, you'll need to install `@appshell/loader`:
+
+```console
+npm install @appshell/loader --save-dev
+```
+
+or
+
+```console
+yarn add -D @appshell/loader
+```
+
+or
+
+```console
+pnpm add -D @appshell/loader
+```
+
+The default export from this package is the loader function. It is given a manifest and returns an async function that can be called to dynamically load federated components.
+
+```ts
+import componentLoader from '@appshell/loader';
+
+const load = componentLoader(manifest);
+
+const Component = load<MyComponent>('MyModule/MyComponent');
+
+render(<Component />);
+```
+
+**Where does the manifest come from?**
+
+> See [@appshell/cli](https://www.npmjs.com/package/@appshell/cli)
+
+```bash
+appshell generate manifest --configsDir appshell_configs
+```
+
+**Do you have any framework specific loaders?**
+
+> See [@appshell/react-federated-component](https://www.npmjs.com/package/@appshell/react-federated-component) for a `React` loader.

package/__tests__/fetchDynamicScript.spec.ts

@@ -0,0 +1,36 @@
+/** @jest-environment jsdom */
+import { fireEvent } from '@testing-library/react';
+import fetchDynamicScript from '../src/fetchDynamicScript';
+
+const mockHead = (event: string) => {
+  const appendChildSpy = jest.spyOn(document.head, 'appendChild').mockImplementation((element) => {
+    fireEvent(element, new Event(event));
+    return element;
+  });
+  const removeChildSpy = jest.spyOn(document.head, 'removeChild').mockReturnThis();
+
+  return [appendChildSpy, removeChildSpy];
+};
+
+describe('fetchDynamicScript', () => {
+  it('should successfully resolve when valid script url is provided', async () => {
+    mockHead('load');
+    const url = 'http://test.com/somescript.js';
+    const success = await fetchDynamicScript(url);
+
+    expect(success).toBe(true);
+  });
+
+  it('should reject when fetching the script results in an error', async () => {
+    mockHead('error');
+    const url = 'http://test.com/somescript.js';
+
+    await expect(fetchDynamicScript(url)).rejects.toMatch(/Failed to fetch remote entry/i);
+  });
+
+  it('should cleanup script tags when finished', async () => {
+    const [, removeChildSpy] = mockHead('load');
+
+    expect(removeChildSpy).toHaveBeenCalled();
+  });
+});

package/__tests__/fixtures/TestComponent.ts

@@ -0,0 +1,3 @@
+const TestComponent = () => 'test component';
+
+export default TestComponent;

package/__tests__/loadFederatedComponent.spec.ts

@@ -0,0 +1,112 @@
+/** @jest-environment jsdom */
+/* eslint-disable no-underscore-dangle */
+import loadFederatedComponent from '../src/loadFederatedComponent';
+import { ModuleContainer, ShareScope } from '../src/types';
+
+type ComponentType = () => string;
+
+const TestComponent = () => 'test component';
+const mockModule = {
+  './TestComponent': {
+    get: jest.fn(),
+    from: '',
+    eager: false,
+  },
+};
+const scopes: Record<string, ShareScope<ComponentType>> = {
+  default: {
+    TestModule: mockModule,
+  },
+  test_scope: {
+    TestModule2: mockModule,
+  },
+  no_factory: {
+    TestModule3: mockModule,
+  },
+};
+const containers: Record<string, Record<string, ModuleContainer<ComponentType>>> = {
+  default: {
+    TestModule: {
+      init: jest.fn(),
+      get: jest.fn().mockReturnValue(() => ({
+        default: TestComponent,
+      })),
+    },
+  },
+  test_scope: {
+    TestModule2: {
+      init: jest.fn(),
+      get: jest.fn().mockReturnValue(() => ({
+        test_scope: TestComponent,
+      })),
+    },
+  },
+  no_factory: {
+    TestModule3: {
+      init: jest.fn(),
+      get: jest.fn().mockReturnValue(undefined),
+    },
+  },
+};
+
+describe('loadFederatedComponent', () => {
+  beforeEach(() => {
+    window.__webpack_init_sharing__ = jest.fn(async (shareScope: string) => {
+      // eslint-disable-next-line @typescript-eslint/dot-notation
+      Object.entries(containers[shareScope] || {}).forEach(([key, module]) => {
+        window[key] = module;
+      });
+      window.__webpack_share_scopes__ = {};
+      window.__webpack_share_scopes__[shareScope] = scopes[shareScope];
+    });
+  });
+
+  afterEach(() => {
+    Object.values(window.__webpack_share_scopes__ || {})
+      .flatMap((val) => Object.keys(val || {}))
+      .forEach((key) => {
+        delete window[key];
+      });
+    window.__webpack_share_scopes__ = {};
+  });
+
+  it('should load the federated component from the default scope', async () => {
+    const scope = 'TestModule';
+    const module = './TestComponent';
+    const shareScope = undefined;
+
+    const Component = await loadFederatedComponent<ComponentType>(scope, module, shareScope);
+
+    expect(Component).toBe(TestComponent);
+  });
+
+  it('should load the federated component from the share scope', async () => {
+    const scope = 'TestModule2';
+    const module = './TestComponent';
+    const shareScope = 'test_scope';
+
+    const Component = await loadFederatedComponent<ComponentType>(scope, module, shareScope);
+
+    expect(Component).toBe(TestComponent);
+  });
+
+  it('should throw if the share scope does not exist', async () => {
+    const scope = 'TestModule';
+    const module = './TestComponent';
+    const shareScope = 'does_not_exist';
+
+    await expect(loadFederatedComponent<ComponentType>(scope, module, shareScope)).rejects.toThrow(
+      /Failed to find module container/i,
+    );
+  });
+
+  it('should throw if the module factory does not exist', async () => {
+    const scope = 'TestModule3';
+    const module = './TestComponent';
+    const shareScope = 'no_factory';
+
+    await expect(loadFederatedComponent<ComponentType>(scope, module, shareScope)).rejects.toThrow(
+      /Invalid factory produced/i,
+    );
+  });
+});

package/__tests__/remoteLoader.spec.ts

@@ -0,0 +1,53 @@
+/** @jest-environment jsdom */
+import { AppshellManifest } from '@appshell/config';
+import * as loadFederatedComponent from '../src/loadFederatedComponent';
+import remoteLoader from '../src/remoteLoader';
+
+jest.mock('../src/fetchDynamicScript');
+jest.mock('../src/loadFederatedComponent');
+
+describe('remoteLoader', () => {
+  const manifest: AppshellManifest = {
+    remotes: {
+      'TestModule/TestComponent': {
+        id: 'test-component',
+        scope: 'TestModule',
+        module: './TestComponent',
+        url: 'http://test.com/remoteEntry.js',
+        metadata: {},
+      },
+    },
+    modules: {},
+  };
+
+  it('should return the federated component if it is found in the manifest', async () => {
+    const ExpectedComponent = () => 'test component';
+    jest.spyOn(loadFederatedComponent, 'default').mockResolvedValue(ExpectedComponent);
+
+    const loadRemote = remoteLoader(manifest);
+    const ActualComponent = await loadRemote('TestModule/TestComponent');
+
+    expect(ActualComponent).toEqual(ExpectedComponent);
+  });
+
+  it('should throw if remote key is not found in the manifest', async () => {
+    const ExpectedComponent = () => 'test component';
+    jest.spyOn(loadFederatedComponent, 'default').mockResolvedValue(ExpectedComponent);
+
+    const loadRemote = remoteLoader(manifest);
+
+    await expect(loadRemote('TestModule/DoesNotExist')).rejects.toThrow(
+      /Remote resource not found in manifest/i,
+    );
+  });
+
+  it('should throw if load federated component fails', async () => {
+    jest.spyOn(loadFederatedComponent, 'default').mockRejectedValue(new Error('failed'));
+
+    const loadRemote = remoteLoader(manifest);
+
+    await expect(loadRemote('TestModule/TestComponent')).rejects.toThrow(
+      /Failed to load component/i,
+    );
+  });
+});

package/dist/main.js

@@ -0,0 +1 @@
+!function(e,o){if("object"==typeof exports&&"object"==typeof module)module.exports=o();else if("function"==typeof define&&define.amd)define([],o);else{var t=o();for(var r in t)("object"==typeof exports?exports:e)[r]=t[r]}}(self,(()=>(()=>{"use strict";var e={d:(o,t)=>{for(var r in t)e.o(t,r)&&!e.o(o,r)&&Object.defineProperty(o,r,{enumerable:!0,get:t[r]})},o:(e,o)=>Object.prototype.hasOwnProperty.call(e,o),r:e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})}};(()=>{e.S={};var o={},t={};e.I=(r,n)=>{n||(n=[]);var a=t[r];if(a||(a=t[r]={}),!(n.indexOf(a)>=0)){if(n.push(a),o[r])return o[r];e.o(e.S,r)||(e.S[r]={}),e.S[r];var d=[];return o[r]=d.length?Promise.all(d).then((()=>o[r]=1)):1}}})();var o={};e.r(o),e.d(o,{default:()=>r});const t=new Set,r=o=>async r=>{let n;const a=o.remotes[r];if(!a)throw new Error(`Remote resource not found in manifest. Expected: ${r}`);try{return await(async e=>{const o=document.createElement("script");return new Promise(((r,n)=>{o.src=e,o.type="text/javascript",o.async=!0,o.onload=()=>{t.add(e),console.debug(`Remote entry fetched from '${e}'.`),r(!0)},o.onerror=()=>{const o=`Failed to fetch remote entry from '${e}'.`;console.error(o),n(o)},document.head.appendChild(o)})).finally((()=>{t.delete(e),document.head.removeChild(o)}))})(a.url),n=await(async(o,t,r="default")=>{console.debug(`loading federated component: { scope: ${o}, module: ${t}, shareScope: ${r} }`),await e.I(r);const n=window[o];if(!n)throw new Error(`Failed to find module container ${o}`);await n.init(e.S[r]);const a=await n.get(t);if(!a)throw new Error(`Invalid factory produced by container for module ${t}.`);const d=a();return console.debug(`federated component loaded: { scope: ${o}, module: ${t}, shareScope: ${r} }`),d[r]})(a.scope,a.module,a.shareScope),n}catch(e){throw new Error(`Failed to load component '${r}'. ${e?.toString()}`)}};return o})()));

package/dist/types/config/src/configmap.d.ts

@@ -0,0 +1,7 @@
+import { AppshellConfig, ConfigMap } from './types';
+declare const _default: {
+    apply: <T extends object>(obj: T, configMap: ConfigMap) => T;
+    create: (config: AppshellConfig<Record<string, unknown>>) => Record<string, string>;
+};
+export default _default;
+//# sourceMappingURL=configmap.d.ts.map

package/dist/types/config/src/configmap.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"configmap.d.ts","sourceRoot":"","sources":["../../../../../config/src/configmap.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,MAAM,SAAS,CAAC;;;;;AAgDpD,wBAGE"}

package/dist/types/config/src/generate.d.ts

@@ -0,0 +1,10 @@
+import { AppshellManifest } from './types';
+/**
+ * Compiles all configuration into an appshell manifest
+ * @param configsDir directory of configs to compile into an appshell manifest
+ * @param searchDepth depth to which app configs should be searched in configsDir
+ * @returns an appshell manifest
+ */
+declare const _default: <TMetadata extends Record<string, unknown>>(configsDir: string, searchDepth?: number) => AppshellManifest<TMetadata>;
+export default _default;
+//# sourceMappingURL=generate.d.ts.map

package/dist/types/config/src/generate.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"generate.d.ts","sourceRoot":"","sources":["../../../../../config/src/generate.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAI3C;;;;;GAKG;gFACoE,MAAM;AAA7E,wBAaE"}

package/dist/types/config/src/index.d.ts

@@ -0,0 +1,9 @@
+/**
+ * @appshell/config package API
+ */
+export { default as configmap } from './configmap';
+export { default as generate } from './generate';
+export type { AppshellConfig, AppshellConfigRemote, AppshellManifest, AppshellRemote, Schema, } from './types';
+export * as utils from './utils';
+export * as validators from './validators';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/config/src/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../config/src/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,EAAE,OAAO,IAAI,SAAS,EAAE,MAAM,aAAa,CAAC;AACnD,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,YAAY,EACV,cAAc,EACd,oBAAoB,EACpB,gBAAgB,EAChB,cAAc,EACd,MAAM,GACP,MAAM,SAAS,CAAC;AACjB,OAAO,KAAK,KAAK,MAAM,SAAS,CAAC;AACjC,OAAO,KAAK,UAAU,MAAM,cAAc,CAAC"}

package/dist/types/config/src/mappers/appshell.config.d.ts

@@ -0,0 +1,3 @@
+import { AppshellConfig, AppshellManifest, ConfigMap } from '../types';
+export declare const toAppshellManifest: <TMetadata extends Record<string, unknown>>(config: AppshellConfig, args: ConfigMap) => AppshellManifest<TMetadata>;
+//# sourceMappingURL=appshell.config.d.ts.map

package/dist/types/config/src/mappers/appshell.config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"appshell.config.d.ts","sourceRoot":"","sources":["../../../../../../config/src/mappers/appshell.config.ts"],"names":[],"mappings":"AAIA,OAAO,EACL,cAAc,EAEd,gBAAgB,EAEhB,SAAS,EACV,MAAM,UAAU,CAAC;AAwDlB,eAAO,MAAM,kBAAkB,sDACrB,cAAc,QAChB,SAAS,gCAQhB,CAAC"}

package/dist/types/config/src/types.d.ts

@@ -0,0 +1,207 @@
+import { JSONSchema4, JSONSchema6, JSONSchema7 } from 'json-schema';
+export type Schema = JSONSchema4 | JSONSchema6 | JSONSchema7;
+export type ConfigValidator = {
+    validate: <T>(...config: T[]) => void;
+};
+export type ConfigMap = Record<string, string>;
+export type AppshellConfigRemote<TMetadata = Record<string, unknown>> = {
+    id: string;
+    url: string;
+    metadata: TMetadata;
+};
+export type AppshellConfig<TMetadata = Record<string, unknown>> = {
+    name?: string;
+    remotes?: Record<string, AppshellConfigRemote<TMetadata>>;
+    module: ModuleFederationPluginOptions;
+};
+/** Appshell manifest types */
+export type AppshellRemote<TMetadata = Record<string, unknown>> = {
+    id: string;
+    url: string;
+    scope: string;
+    module: string;
+    shareScope?: string;
+    metadata: TMetadata;
+};
+export type AppshellManifest<TMetadata = Record<string, unknown>> = {
+    remotes: Record<string, AppshellRemote<TMetadata>>;
+    modules: Record<string, ModuleFederationPluginOptions>;
+};
+/**
+ * Advanced configuration for modules that should be exposed by this container.
+ */
+export interface ExposesConfig {
+    /**
+     * Request to a module that should be exposed by this container.
+     */
+    import: string | string[];
+    /**
+     * Custom chunk name for the exposed module.
+     */
+    name?: string;
+}
+export interface ExposesObject {
+    [index: string]: string | ExposesConfig | string[];
+}
+/**
+ * Set explicit comments for `commonjs`, `commonjs2`, `amd`, and `root`.
+ */
+export interface LibraryCustomUmdCommentObject {
+    /**
+     * Set comment for `amd` section in UMD.
+     */
+    amd?: string;
+    /**
+     * Set comment for `commonjs` (exports) section in UMD.
+     */
+    commonjs?: string;
+    /**
+     * Set comment for `commonjs2` (module.exports) section in UMD.
+     */
+    commonjs2?: string;
+    /**
+     * Set comment for `root` (global variable) section in UMD.
+     */
+    root?: string;
+}
+/**
+ * Description object for all UMD variants of the library name.
+ */
+export interface LibraryCustomUmdObject {
+    /**
+     * Name of the exposed AMD library in the UMD.
+     */
+    amd?: string;
+    /**
+     * Name of the exposed commonjs export in the UMD.
+     */
+    commonjs?: string;
+    /**
+     * Name of the property exposed globally by a UMD library.
+     */
+    root?: string | string[];
+}
+/**
+ * Options for library.
+ */
+export interface LibraryOptions {
+    /**
+     * Add a comment in the UMD wrapper.
+     */
+    auxiliaryComment?: string | LibraryCustomUmdCommentObject;
+    /**
+     * Specify which export should be exposed as library.
+     */
+    export?: string | string[];
+    /**
+     * The name of the library (some types allow unnamed libraries too).
+     */
+    name?: string | string[] | LibraryCustomUmdObject;
+    /**
+     * Type of library (types included by default are 'var', 'module', 'assign', 'assign-properties', 'this', 'window', 'self', 'global', 'commonjs', 'commonjs2', 'commonjs-module', 'commonjs-static', 'amd', 'amd-require', 'umd', 'umd2', 'jsonp', 'system', but others might be added by plugins).
+     */
+    type: string;
+    /**
+     * If `output.libraryTarget` is set to umd and `output.library` is set, setting this to true will name the AMD module.
+     */
+    umdNamedDefine?: boolean;
+}
+export interface SharedConfig {
+    /**
+     * Include the provided and fallback module directly instead behind an async request. This allows to use this shared module in initial load too. All possible shared modules need to be eager too.
+     */
+    eager?: boolean;
+    /**
+     * Provided module that should be provided to share scope. Also acts as fallback module if no shared module is found in share scope or version isn't valid. Defaults to the property name.
+     */
+    import?: string | false;
+    /**
+     * Package name to determine required version from description file. This is only needed when package name can't be automatically determined from request.
+     */
+    packageName?: string;
+    /**
+     * Version requirement from module in share scope.
+     */
+    requiredVersion?: string | false;
+    /**
+     * Module is looked up under this key from the share scope.
+     */
+    shareKey?: string;
+    /**
+     * Share scope name.
+     */
+    shareScope?: string;
+    /**
+     * Allow only a single version of the shared module in share scope (disabled by default).
+     */
+    singleton?: boolean;
+    /**
+     * Do not accept shared module if version is not valid (defaults to yes, if local fallback module is available and shared module is not a singleton, otherwise no, has no effect if there is no required version specified).
+     */
+    strictVersion?: boolean;
+    /**
+     * Version of the provided module. Will replace lower matching versions, but not higher.
+     */
+    version?: string | false;
+}
+export interface SharedObject {
+    [index: string]: string | SharedConfig;
+}
+/**
+ * Advanced configuration for container locations from which modules should be resolved and loaded at runtime.
+ */
+export interface RemotesConfig {
+    /**
+     * Container locations from which modules should be resolved and loaded at runtime.
+     */
+    external: string | string[];
+    /**
+     * The name of the share scope shared with this remote.
+     */
+    shareScope?: string;
+}
+/**
+ * Container locations from which modules should be resolved and loaded at runtime. Property names are used as request scopes.
+ */
+export interface RemotesObject {
+    [index: string]: string | RemotesConfig | string[];
+}
+export interface ModuleFederationPluginOptions {
+    /**
+     * Modules that should be exposed by this container. When provided, property name is used as public name, otherwise public name is automatically inferred from request.
+     */
+    exposes?: (string | ExposesObject)[] | ExposesObject;
+    /**
+     * The filename of the container as relative path inside the `output.path` directory.
+     */
+    filename?: string;
+    /**
+     * Options for library.
+     */
+    library?: LibraryOptions;
+    /**
+     * The name of the container.
+     */
+    name?: string;
+    /**
+     * The external type of the remote containers.
+     */
+    remoteType?: 'import' | 'var' | 'module' | 'assign' | 'this' | 'window' | 'self' | 'global' | 'commonjs' | 'commonjs2' | 'commonjs-module' | 'commonjs-static' | 'amd' | 'amd-require' | 'umd' | 'umd2' | 'jsonp' | 'system' | 'promise' | 'script' | 'node-commonjs';
+    /**
+     * Container locations and request scopes from which modules should be resolved and loaded at runtime. When provided, property name is used as request scope, otherwise request scope is automatically inferred from container location.
+     */
+    remotes?: (string | RemotesObject)[] | RemotesObject;
+    /**
+     * The name of the runtime chunk. If set a runtime chunk with this name is created or an existing entrypoint is used as runtime.
+     */
+    runtime?: string | false;
+    /**
+     * Share scope name used for all shared modules (defaults to 'default').
+     */
+    shareScope?: string;
+    /**
+     * Modules that should be shared in the share scope. When provided, property names are used to match requested modules in this compilation.
+     */
+    shared?: (string | SharedObject)[] | SharedObject;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/types/config/src/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../config/src/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAEpE,MAAM,MAAM,MAAM,GAAG,WAAW,GAAG,WAAW,GAAG,WAAW,CAAC;AAE7D,MAAM,MAAM,eAAe,GAAG;IAC5B,QAAQ,EAAE,CAAC,CAAC,EAAE,GAAG,MAAM,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC;CACvC,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAG/C,MAAM,MAAM,oBAAoB,CAAC,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI;IACtE,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,EAAE,MAAM,CAAC;IACZ,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,cAAc,CAAC,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI;IAChE,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,oBAAoB,CAAC,SAAS,CAAC,CAAC,CAAC;IAC1D,MAAM,EAAE,6BAA6B,CAAC;CACvC,CAAC;AAEF,8BAA8B;AAC9B,MAAM,MAAM,cAAc,CAAC,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI;IAChE,EAAE,EAAE,MAAM,CAAC;IACX,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,SAAS,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,gBAAgB,CAAC,SAAS,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAAI;IAClE,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,cAAc,CAAC,SAAS,CAAC,CAAC,CAAC;IACnD,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,6BAA6B,CAAC,CAAC;CACxD,CAAC;AAEF;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,MAAM,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAE1B;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,MAAM,WAAW,aAAa;IAC5B,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,aAAa,GAAG,MAAM,EAAE,CAAC;CACpD;AAED;;GAEG;AACH,MAAM,WAAW,6BAA6B;IAC5C;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;OAEG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IAEnB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED;;GAEG;AACH,MAAM,WAAW,sBAAsB;IACrC;;OAEG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;CAC1B;AAED;;GAEG;AACH,MAAM,WAAW,cAAc;IAC7B;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,GAAG,6BAA6B,CAAC;IAE1D;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAE3B;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,EAAE,GAAG,sBAAsB,CAAC;IAElD;;OAEG;IACH,IAAI,EAAE,MAAM,CAAC;IAEb;;OAEG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,MAAM,WAAW,YAAY;IAC3B;;OAEG;IACH,KAAK,CAAC,EAAE,OAAO,CAAC;IAEhB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IAExB;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,CAAC;IAErB;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IAEjC;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;IAEpB;;OAEG;IACH,aAAa,CAAC,EAAE,OAAO,CAAC;IAExB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;CAC1B;AAED,MAAM,WAAW,YAAY;IAC3B,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,YAAY,CAAC;CACxC;AAED;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,QAAQ,EAAE,MAAM,GAAG,MAAM,EAAE,CAAC;IAE5B;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;CACrB;AAED;;GAEG;AACH,MAAM,WAAW,aAAa;IAC5B,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,GAAG,aAAa,GAAG,MAAM,EAAE,CAAC;CACpD;AAED,MAAM,WAAW,6BAA6B;IAC5C;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,MAAM,GAAG,aAAa,CAAC,EAAE,GAAG,aAAa,CAAC;IAErD;;OAEG;IACH,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB;;OAEG;IACH,OAAO,CAAC,EAAE,cAAc,CAAC;IAEzB;;OAEG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;OAEG;IACH,UAAU,CAAC,EACP,QAAQ,GACR,KAAK,GACL,QAAQ,GACR,QAAQ,GACR,MAAM,GACN,QAAQ,GACR,MAAM,GACN,QAAQ,GACR,UAAU,GACV,WAAW,GACX,iBAAiB,GACjB,iBAAiB,GACjB,KAAK,GACL,aAAa,GACb,KAAK,GACL,MAAM,GACN,OAAO,GACP,QAAQ,GACR,SAAS,GACT,QAAQ,GACR,eAAe,CAAC;IAEpB;;OAEG;IACH,OAAO,CAAC,EAAE,CAAC,MAAM,GAAG,aAAa,CAAC,EAAE,GAAG,aAAa,CAAC;IAErD;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,KAAK,CAAC;IAEzB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IAEpB;;OAEG;IACH,MAAM,CAAC,EAAE,CAAC,MAAM,GAAG,YAAY,CAAC,EAAE,GAAG,YAAY,CAAC;CACnD"}

package/dist/types/config/src/utils/copy.d.ts

@@ -0,0 +1,11 @@
+/**
+ * Safely copies files and makes directories if they don't exist.
+ * @param pattern { from: @type string, to: @type string }
+ * @returns void
+ */
+declare const _default: (pattern: {
+    from: string;
+    to: string;
+}) => void;
+export default _default;
+//# sourceMappingURL=copy.d.ts.map

package/dist/types/config/src/utils/copy.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"copy.d.ts","sourceRoot":"","sources":["../../../../../../config/src/utils/copy.ts"],"names":[],"mappings":"AAGA;;;;GAIG;kCACsB;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,EAAE,EAAE,MAAM,CAAA;CAAE;AAArD,wBAOE"}

package/dist/types/config/src/utils/index.d.ts

@@ -0,0 +1,5 @@
+export { default as copy } from './copy';
+export { default as list } from './list';
+export { default as load, loadAll } from './load';
+export { default as merge } from './merge';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/config/src/utils/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../config/src/utils/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,MAAM,QAAQ,CAAC;AACzC,OAAO,EAAE,OAAO,IAAI,IAAI,EAAE,OAAO,EAAE,MAAM,QAAQ,CAAC;AAClD,OAAO,EAAE,OAAO,IAAI,KAAK,EAAE,MAAM,SAAS,CAAC"}

package/dist/types/config/src/utils/list.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Lists all files found in dirPath or its subdirectories
+ * @param dirPath directory to search
+ * @param depth depth to which the search should execute
+ * @param target filename to filter results on
+ * @returns list of paths for all files found
+ */
+declare const list: (dirPath: string, depth?: number, target?: string | RegExp) => string[];
+export default list;
+//# sourceMappingURL=list.d.ts.map

package/dist/types/config/src/utils/list.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"list.d.ts","sourceRoot":"","sources":["../../../../../../config/src/utils/list.ts"],"names":[],"mappings":"AAoBA;;;;;;GAMG;AACH,QAAA,MAAM,IAAI,YAAa,MAAM,2BAAqB,MAAM,GAAG,MAAM,aAMhE,CAAC;AAEF,eAAe,IAAI,CAAC"}

package/dist/types/config/src/utils/load.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Reads the YAML file
+ * @param configPath to configuration file
+ * @returns a yaml object
+ */
+declare const load: <TSchema>(configPath: string) => TSchema;
+/**
+ * Loads the YAML files specified by paths
+ * @param paths Paths to configurations to process
+ * @returns yaml objects
+ */
+export declare const loadAll: <TSchema>(...paths: string[]) => TSchema[];
+export default load;
+//# sourceMappingURL=load.d.ts.map

package/dist/types/config/src/utils/load.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"load.d.ts","sourceRoot":"","sources":["../../../../../../config/src/utils/load.ts"],"names":[],"mappings":"AAGA;;;;GAIG;AACH,QAAA,MAAM,IAAI,wBAAyB,MAAM,YAWxC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,OAAO,sBAAuB,MAAM,EAAE,cAA+C,CAAC;AAEnG,eAAe,IAAI,CAAC"}

package/dist/types/config/src/utils/merge.d.ts

@@ -0,0 +1,4 @@
+import { ConfigValidator } from '../types';
+declare const _default: <TSchema>(validator: ConfigValidator, ...documents: TSchema[]) => TSchema;
+export default _default;
+//# sourceMappingURL=merge.d.ts.map

package/dist/types/config/src/utils/merge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"merge.d.ts","sourceRoot":"","sources":["../../../../../../config/src/utils/merge.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;6CAUP,eAAe;AAAnD,wBAiBE"}

package/dist/types/config/src/validators/appshell.config.d.ts

@@ -0,0 +1,4 @@
+import { ConfigValidator } from '../types';
+declare const _default: ConfigValidator;
+export default _default;
+//# sourceMappingURL=appshell.config.d.ts.map

package/dist/types/config/src/validators/appshell.config.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"appshell.config.d.ts","sourceRoot":"","sources":["../../../../../../config/src/validators/appshell.config.ts"],"names":[],"mappings":"AAIA,OAAO,EAAkB,eAAe,EAAE,MAAM,UAAU,CAAC;;AAgB3D,wBAcqB"}

package/dist/types/config/src/validators/appshell.manifest.d.ts

@@ -0,0 +1,4 @@
+import { ConfigValidator } from '../types';
+declare const _default: ConfigValidator;
+export default _default;
+//# sourceMappingURL=appshell.manifest.d.ts.map

package/dist/types/config/src/validators/appshell.manifest.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"appshell.manifest.d.ts","sourceRoot":"","sources":["../../../../../../config/src/validators/appshell.manifest.ts"],"names":[],"mappings":"AAIA,OAAO,EAAoB,eAAe,EAAE,MAAM,UAAU,CAAC;;AAkB7D,wBAcqB"}

package/dist/types/config/src/validators/index.d.ts

@@ -0,0 +1,3 @@
+export { default as appshell_config } from './appshell.config';
+export { default as appshell_manifest } from './appshell.manifest';
+//# sourceMappingURL=index.d.ts.map

package/dist/types/config/src/validators/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../../config/src/validators/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAC/D,OAAO,EAAE,OAAO,IAAI,iBAAiB,EAAE,MAAM,qBAAqB,CAAC"}

package/dist/types/loader/src/fetchDynamicScript.d.ts

@@ -0,0 +1,3 @@
+declare const _default: (url: string) => Promise<boolean>;
+export default _default;
+//# sourceMappingURL=fetchDynamicScript.d.ts.map

package/dist/types/loader/src/fetchDynamicScript.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"fetchDynamicScript.d.ts","sourceRoot":"","sources":["../../../../src/fetchDynamicScript.ts"],"names":[],"mappings":"8BAE2B,MAAM;AAAjC,wBA8BE"}

package/dist/types/loader/src/index.d.ts

@@ -0,0 +1,4 @@
+import remoteLoader from './remoteLoader';
+export * from './types';
+export default remoteLoader;
+//# sourceMappingURL=index.d.ts.map

package/dist/types/loader/src/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,YAAY,MAAM,gBAAgB,CAAC;AAE1C,cAAc,SAAS,CAAC;AAExB,eAAe,YAAY,CAAC"}

package/dist/types/loader/src/loadFederatedComponent.d.ts

@@ -0,0 +1,14 @@
+import { ShareScope } from './types';
+declare global {
+    function __webpack_init_sharing__(id: string): Promise<void>;
+    const __webpack_share_scopes__: {
+        default: ShareScope;
+    };
+    interface Window {
+        [key: string]: unknown;
+        __webpack_share_scopes__: Record<string, ShareScope>;
+    }
+}
+declare const _default: <TComponent>(scope: string, module: string, shareScope?: string) => Promise<TComponent>;
+export default _default;
+//# sourceMappingURL=loadFederatedComponent.d.ts.map

package/dist/types/loader/src/loadFederatedComponent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loadFederatedComponent.d.ts","sourceRoot":"","sources":["../../../../src/loadFederatedComponent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAmB,UAAU,EAAE,MAAM,SAAS,CAAC;AAGtD,OAAO,CAAC,MAAM,CAAC;IACb,SAAS,wBAAwB,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAE7D,MAAM,wBAAwB,EAAE;QAAE,OAAO,EAAE,UAAU,CAAA;KAAE,CAAC;IACxD,UAAU,MAAM;QACd,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;QACvB,wBAAwB,EAAE,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC;KACtD;CACF;4CAIwC,MAAM,UAAU,MAAM;AAA/D,wBAgCE"}

package/dist/types/loader/src/remoteLoader.d.ts

@@ -0,0 +1,4 @@
+import { type AppshellManifest } from '@appshell/config';
+declare const _default: (manifest: AppshellManifest) => <TComponent>(key: string) => Promise<TComponent>;
+export default _default;
+//# sourceMappingURL=remoteLoader.d.ts.map

package/dist/types/loader/src/remoteLoader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"remoteLoader.d.ts","sourceRoot":"","sources":["../../../../src/remoteLoader.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,gBAAgB,EAAE,MAAM,kBAAkB,CAAC;mCAI/B,gBAAgB,uBAChB,MAAM;AADhC,wBAqBI"}

package/dist/types/loader/src/types.d.ts

@@ -0,0 +1,11 @@
+export type ShareScope<TComponent = any> = Record<string, Record<string, {
+    loaded?: 1;
+    get: () => Promise<TComponent>;
+    from: string;
+    eager: boolean;
+}>>;
+export interface ModuleContainer<TComponent> {
+    init(shareScope: ShareScope<TComponent>): Promise<void>;
+    get(module: string): Promise<() => Record<string, TComponent>>;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/types/loader/src/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/types.ts"],"names":[],"mappings":"AACA,MAAM,MAAM,UAAU,CAAC,UAAU,GAAG,GAAG,IAAI,MAAM,CAC/C,MAAM,EACN,MAAM,CAAC,MAAM,EAAE;IAAE,MAAM,CAAC,EAAE,CAAC,CAAC;IAAC,GAAG,EAAE,MAAM,OAAO,CAAC,UAAU,CAAC,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,OAAO,CAAA;CAAE,CAAC,CAC7F,CAAC;AAEF,MAAM,WAAW,eAAe,CAAC,UAAU;IACzC,IAAI,CAAC,UAAU,EAAE,UAAU,CAAC,UAAU,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACxD,GAAG,CAAC,MAAM,EAAE,MAAM,GAAG,OAAO,CAAC,MAAM,MAAM,CAAC,MAAM,EAAE,UAAU,CAAC,CAAC,CAAC;CAChE"}

package/package.json

@@ -0,0 +1,24 @@
+{
+  "name": "@appshell/loader",
+  "version": "0.0.1-alpha.0",
+  "description": "Utility for loading federated components",
+  "main": "dist/main.js",
+  "types": "dist/loader/src/index.d.ts",
+  "scripts": {
+    "build": "webpack --mode production && yarn build:types",
+    "build:types": "tsc --emitDeclarationOnly",
+    "clean": "rm -rf dist",
+    "prebuild": "npm run clean",
+    "start": "webpack --watch --mode development && yarn build:types",
+    "stats": "webpack --json > stats.json"
+  },
+  "keywords": [
+    "webpack",
+    "module federation",
+    "micro-frontends",
+    "appshell"
+  ],
+  "author": "Robert Hamilton <rh@navaris.com>",
+  "license": "MIT",
+  "gitHead": "305b39fb81e7c267918dda7d16336e37b2b36643"
+}

package/src/fetchDynamicScript.ts

@@ -0,0 +1,33 @@
+const urlCache = new Set<string>();
+
+export default async (url: string) => {
+  const element = document.createElement('script');
+
+  const cleanup = (): void => {
+    urlCache.delete(url);
+    document.head.removeChild(element);
+  };
+
+  return new Promise<boolean>((resolve, reject) => {
+    element.src = url;
+    element.type = 'text/javascript';
+    element.async = true;
+
+    element.onload = () => {
+      urlCache.add(url);
+      // eslint-disable-next-line no-console
+      console.debug(`Remote entry fetched from '${url}'.`);
+
+      resolve(true);
+    };
+
+    element.onerror = () => {
+      const message = `Failed to fetch remote entry from '${url}'.`;
+      // eslint-disable-next-line no-console
+      console.error(message);
+      reject(message);
+    };
+
+    document.head.appendChild(element);
+  }).finally(cleanup);
+};

package/src/index.ts

@@ -0,0 +1,5 @@
+import remoteLoader from './remoteLoader';
+
+export * from './types';
+
+export default remoteLoader;

package/src/loadFederatedComponent.ts

@@ -0,0 +1,48 @@
+import { ModuleContainer, ShareScope } from './types';
+
+/* eslint-disable @typescript-eslint/naming-convention */
+declare global {
+  function __webpack_init_sharing__(id: string): Promise<void>;
+  // eslint-disable-next-line no-underscore-dangle
+  const __webpack_share_scopes__: { default: ShareScope };
+  interface Window {
+    [key: string]: unknown;
+    __webpack_share_scopes__: Record<string, ShareScope>;
+  }
+}
+
+type ShareScopes = keyof typeof __webpack_share_scopes__;
+
+export default async <TComponent>(scope: string, module: string, shareScope = 'default') => {
+  // eslint-disable-next-line no-console
+  console.debug(
+    `loading federated component: { scope: ${scope}, module: ${module}, shareScope: ${shareScope} }`,
+  );
+
+  // Initializes the share scope. This fills it with known provided modules from this build and all remotes
+  await __webpack_init_sharing__(shareScope);
+  const container = window[scope] as ModuleContainer<TComponent>;
+
+  if (!container) {
+    throw new Error(`Failed to find module container ${scope}`);
+  }
+
+  // Initialize the container, it may provide shared modules
+  await container.init(__webpack_share_scopes__[shareScope as ShareScopes]);
+  const factory = await container.get(module);
+
+  if (!factory) {
+    throw new Error(`Invalid factory produced by container for module ${module}.`);
+  }
+
+  const Module = factory();
+
+  // eslint-disable-next-line no-console
+  console.debug(
+    `federated component loaded: { scope: ${scope}, module: ${module}, shareScope: ${shareScope} }`,
+  );
+
+  const Component = Module[shareScope as ShareScopes];
+
+  return Component;
+};

package/src/remoteLoader.ts

@@ -0,0 +1,26 @@
+import { type AppshellManifest } from '@appshell/config';
+import fetchDynamicScript from './fetchDynamicScript';
+import loadFederatedComponent from './loadFederatedComponent';
+
+export default (manifest: AppshellManifest) =>
+  async <TComponent>(key: string) => {
+    let Component: TComponent;
+    const remote = manifest.remotes[key];
+    if (!remote) {
+      throw new Error(`Remote resource not found in manifest. Expected: ${key}`);
+    }
+
+    try {
+      await fetchDynamicScript(remote.url);
+      Component = await loadFederatedComponent<TComponent>(
+        remote.scope,
+        remote.module,
+        remote.shareScope,
+      );
+
+      return Component;
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    } catch (err: any) {
+      throw new Error(`Failed to load component '${key}'. ${err?.toString()}`);
+    }
+  };

package/src/types.ts

@@ -0,0 +1,10 @@
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export type ShareScope<TComponent = any> = Record<
+  string,
+  Record<string, { loaded?: 1; get: () => Promise<TComponent>; from: string; eager: boolean }>
+>;
+
+export interface ModuleContainer<TComponent> {
+  init(shareScope: ShareScope<TComponent>): Promise<void>;
+  get(module: string): Promise<() => Record<string, TComponent>>;
+}

package/tsconfig.json

@@ -0,0 +1,7 @@
+{
+  "extends": "../../tsconfig",
+  "compilerOptions": {
+    "declarationDir": "./dist/types"
+  },
+  "include": ["./src"]
+}

package/webpack.config.js

@@ -0,0 +1,37 @@
+const path = require('path');
+const TsconfigPathsPlugin = require('tsconfig-paths-webpack-plugin');
+
+module.exports = (env, { mode }) => {
+  const isDevelopment = mode === 'development';
+
+  return {
+    entry: './src/index',
+    mode,
+    devtool: isDevelopment ? 'eval-source-map' : false,
+    output: {
+      filename: '[name].js',
+      pathinfo: false,
+      libraryTarget: 'umd',
+    },
+    resolve: {
+      extensions: ['.js', '.ts'],
+      plugins: [new TsconfigPathsPlugin()],
+    },
+    module: {
+      rules: [
+        {
+          test: /\.ts$/,
+          exclude: /node_modules/,
+          use: [
+            {
+              loader: 'babel-loader',
+              options: {
+                presets: ['@babel/preset-typescript'],
+              },
+            },
+          ],
+        },
+      ],
+    },
+  };
+};