@nectary/assets 3.5.6 → 3.6.1

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nectary/assets",
-  "version": "3.5.6",
+  "version": "3.6.1",
   "files": [
     "**/*/*.css",
     "**/*/*.json",
@@ -38,6 +38,6 @@
     "vite": "^7.0.6"
   },
   "peerDependencies": {
-    "@nectary/theme-base": "1.10.0"
+    "@nectary/theme-base": "1.11.1"
   }
 }

package/utils/shared/cdn-loader.d.js

@@ -0,0 +1 @@
+

package/utils/shared/cdn-loader.d.ts

@@ -0,0 +1,10 @@
+interface LoadModuleOptions {
+    cdnUrl: string;
+    fallbackCdnUrl: string;
+    version: string;
+    modulePath: string;
+    logPrefix?: string;
+}
+export declare const loadModuleWithFallback: <TModule = Record<string, any>>(options: LoadModuleOptions) => Promise<TModule>;
+export declare const loadCSSModuleWithFallback: <TModule = Record<string, any>>(options: LoadModuleOptions) => Promise<TModule>;
+export {};

package/utils/shared/cdn-loader.js

@@ -0,0 +1,126 @@
+const getImportPath = (cdnUrl, version, modulePath) => {
+  if (cdnUrl.length === 0) {
+    return null;
+  }
+  const host = new URL(cdnUrl).host;
+  if (host === "esm.sh") {
+    if (version.length !== 0) {
+      return `${cdnUrl}@${version}/es2022/${modulePath}.mjs`;
+    }
+    return `${cdnUrl}/${modulePath}`;
+  }
+  if (version.length !== 0) {
+    return `${cdnUrl}/${version}/${modulePath}.js`;
+  }
+  return `${cdnUrl}/latest/${modulePath}.js`;
+};
+const getCssImportPath = (cdnUrl, version, modulePath) => {
+  if (cdnUrl.length === 0) {
+    return null;
+  }
+  const host = new URL(cdnUrl).host;
+  if (host === "esm.sh") {
+    if (version.length !== 0) {
+      return `${cdnUrl}@${version}/es2022/${modulePath}.css`;
+    }
+    return `${cdnUrl}/${modulePath}`;
+  }
+  if (version.length !== 0) {
+    return `${cdnUrl}/${version}/${modulePath}.css`;
+  }
+  return `${cdnUrl}/latest/${modulePath}.css`;
+};
+const FALLBACK_DELAY_MS = 2e3;
+const loadModuleWithFallback = async (options) => {
+  const { cdnUrl, fallbackCdnUrl, version, modulePath, logPrefix = "CDN" } = options;
+  const importPath = getImportPath(cdnUrl, version, modulePath);
+  const fallbackImportPath = getImportPath(fallbackCdnUrl, version, modulePath);
+  const promises = [
+    import(
+      /* webpackIgnore: true */
+      importPath
+    )
+  ];
+  let timeoutId = null;
+  if (fallbackImportPath !== null) {
+    promises.push(
+      new Promise((resolve) => {
+        timeoutId = setTimeout(() => resolve(import(
+          /* webpackIgnore: true */
+          fallbackImportPath
+        )), FALLBACK_DELAY_MS);
+      })
+    );
+  }
+  try {
+    const module = await Promise.any(promises);
+    if (timeoutId !== null) {
+      clearTimeout(timeoutId);
+    }
+    return module;
+  } catch (error) {
+    if (error instanceof AggregateError) {
+      console.error(`${logPrefix} primary load failed: ${importPath}`, error.errors[0]);
+      if (fallbackImportPath !== null) {
+        console.error(`${logPrefix} fallback load failed: ${fallbackImportPath}`, error.errors[1]);
+      }
+    } else {
+      console.error(`${logPrefix} failed to load module: ${importPath}`, error);
+    }
+    throw error;
+  }
+};
+const fetchCSS = async (url) => {
+  const res = await fetch(url);
+  if (!res.ok) {
+    throw new Error(`CSS fetch failed: ${res.status} ${url}`);
+  }
+  const css = await res.text();
+  return { default: css };
+};
+const loadCSSFromUrl = (url) => {
+  if (url.endsWith(".css")) {
+    return fetchCSS(url);
+  }
+  return import(
+    /* webpackIgnore: true */
+    url
+  );
+};
+const loadCSSModuleWithFallback = async (options) => {
+  const { cdnUrl, fallbackCdnUrl, version, modulePath, logPrefix = "CDN" } = options;
+  const importPath = getCssImportPath(cdnUrl, version, modulePath);
+  const fallbackImportPath = getCssImportPath(fallbackCdnUrl, version, modulePath);
+  const promises = [
+    loadCSSFromUrl(importPath)
+  ];
+  let timeoutId = null;
+  if (fallbackImportPath !== null) {
+    promises.push(
+      new Promise((resolve) => {
+        timeoutId = setTimeout(() => resolve(loadCSSFromUrl(fallbackImportPath)), FALLBACK_DELAY_MS);
+      })
+    );
+  }
+  try {
+    const module = await Promise.any(promises);
+    if (timeoutId !== null) {
+      clearTimeout(timeoutId);
+    }
+    return module;
+  } catch (error) {
+    if (error instanceof AggregateError) {
+      console.error(`${logPrefix} primary load failed: ${importPath}`, error.errors[0]);
+      if (fallbackImportPath !== null) {
+        console.error(`${logPrefix} fallback load failed: ${fallbackImportPath}`, error.errors[1]);
+      }
+    } else {
+      console.error(`${logPrefix} failed to load module: ${importPath}`, error);
+    }
+    throw error;
+  }
+};
+export {
+  loadCSSModuleWithFallback,
+  loadModuleWithFallback
+};

package/utils/shared/deferred-promise.d.js

@@ -0,0 +1 @@
+

package/utils/shared/deferred-promise.d.ts

@@ -0,0 +1,5 @@
+export interface DeferredPromise<T = void> {
+    promise: Promise<T>;
+    resolve: (value: T) => void;
+}
+export declare const createDeferredPromise: <T = void>() => DeferredPromise<T>;

package/utils/shared/deferred-promise.js

@@ -0,0 +1,10 @@
+const createDeferredPromise = () => {
+  let resolve;
+  const promise = new Promise((r) => {
+    resolve = r;
+  });
+  return { promise, resolve };
+};
+export {
+  createDeferredPromise
+};

package/utils/shared/global-elements-manager.d.ts

@@ -31,12 +31,11 @@ export declare abstract class GlobalElementsManager {
     getConstructor(name: SinchElementName): Promise<CustomElementConstructor> | null;
     private patchCustomElements;
     private toClassName;
-    private loadModuleWithFallback;
+    private loadModule;
     private createLoader;
     private preloadBundle;
     init(options: GlobalManagerInitOptions): Promise<void>;
     whenLoaded(): Promise<void>;
-    private getImportPath;
     private getModulePath;
     preload(name: SinchElementName | SinchElementName[] | 'all'): Promise<void>;
 }

package/utils/shared/global-elements-manager.js

@@ -1,4 +1,6 @@
 import { isSinchElementName, sinchElementNameToBase } from "./nectary-element-base.js";
+import "./deferred-promise.js";
+import { loadModuleWithFallback } from "./cdn-loader.js";
 import { getConstructor, getStore } from "./global-elements-store.js";
 class GlobalElementsManager {
   config;
@@ -39,49 +41,19 @@ class GlobalElementsManager {
   toClassName(itemName) {
     return itemName.split("-").map((part) => part.charAt(0).toUpperCase() + part.slice(1)).join("");
   }
-  async loadModuleWithFallback(modulePath) {
+  loadModule(modulePath) {
     const store = getStore(this.config.storeKey);
-    const importPath = this.getImportPath(store.cdnUrl, modulePath);
-    const fallbackImportPath = this.getImportPath(store.fallbackCdnUrl, modulePath);
-    const promises = [
-      import(
-        /* webpackIgnore: true */
-        importPath
-      )
-    ];
-    let timeoutId = null;
-    const FALLBACK_DELAY_MS = 2e3;
-    if (fallbackImportPath !== null) {
-      promises.push(
-        new Promise((resolve) => {
-          timeoutId = setTimeout(() => resolve(import(
-            /* webpackIgnore: true */
-            fallbackImportPath
-          )), FALLBACK_DELAY_MS);
-        })
-      );
-    }
-    try {
-      const module = await Promise.any(promises);
-      if (timeoutId !== null) {
-        clearTimeout(timeoutId);
-      }
-      return module;
-    } catch (error) {
-      if (error instanceof AggregateError) {
-        console.error(`Nectary Primary load failed: ${importPath}`, error.errors[0]);
-        if (fallbackImportPath !== null) {
-          console.error(`Nectary fallback load failed: ${fallbackImportPath}`, error.errors[1]);
-        }
-      } else {
-        console.error(`Nectary failed to load module: ${importPath}`, error);
-      }
-      throw error;
-    }
+    return loadModuleWithFallback({
+      cdnUrl: store.cdnUrl,
+      fallbackCdnUrl: store.fallbackCdnUrl,
+      version: store.targetlibVersion,
+      modulePath,
+      logPrefix: "Nectary"
+    });
   }
   createLoader(modulePath, itemName) {
     return async () => {
-      const module = await this.loadModuleWithFallback(modulePath);
+      const module = await this.loadModule(modulePath);
       const className = this.toClassName(itemName);
       const globalConstructor = module[className];
       if (globalConstructor == null) {
@@ -93,7 +65,7 @@ class GlobalElementsManager {
   }
   async preloadBundle() {
     const store = getStore(this.config.storeKey);
-    const module = await this.loadModuleWithFallback("bundle");
+    const module = await this.loadModule("bundle");
     for (const itemName of this.config.baseElementNames) {
       const className = this.toClassName(itemName);
       const globalConstructor = module[className];
@@ -150,23 +122,6 @@ class GlobalElementsManager {
     const store = getStore(this.config.storeKey);
     return store.loadPromise.promise;
   }
-  getImportPath(cdnUrl, modulePath) {
-    if (cdnUrl.length === 0) {
-      return null;
-    }
-    const store = getStore(this.config.storeKey);
-    const host = new URL(cdnUrl).host;
-    if (host === "esm.sh") {
-      if (store.targetlibVersion.length !== 0) {
-        return `${cdnUrl}@${store.targetlibVersion}/es2022/${modulePath}.mjs`;
-      }
-      return `${cdnUrl}/${modulePath}`;
-    }
-    if (store.targetlibVersion.length !== 0) {
-      return `${cdnUrl}/${store.targetlibVersion}/${modulePath}.js`;
-    }
-    return `${cdnUrl}/latest/${modulePath}.js`;
-  }
   getModulePath(name) {
     for (const [key, value] of this.config.nameToPathMap ?? []) {
       const splittedName = name.startsWith(key) ? name.split(key) : [name];

package/utils/shared/global-elements-store.d.ts

@@ -1,3 +1,4 @@
+import type { DeferredPromise } from './deferred-promise';
 import type { SinchElementName } from './nectary-element-base';
 interface GlobalStore {
     definitions: Map<SinchElementName, () => Promise<any>>;
@@ -6,10 +7,7 @@ interface GlobalStore {
     preload: boolean;
     cdnUrl: string;
     fallbackCdnUrl: string;
-    loadPromise: {
-        promise: Promise<void>;
-        resolve: (value: void) => void;
-    };
+    loadPromise: DeferredPromise;
 }
 export declare const getStore: (storeKey: symbol) => GlobalStore;
 export declare const getConstructor: (storeKey: symbol, name: SinchElementName) => Promise<CustomElementConstructor> | null;

package/utils/shared/global-elements-store.js

@@ -1,10 +1,4 @@
-const createDeferredPromise = () => {
-  let resolve;
-  const promise = new Promise((r) => {
-    resolve = r;
-  });
-  return { promise, resolve };
-};
+import { createDeferredPromise } from "./deferred-promise.js";
 const getStore = (storeKey) => {
   if (window[storeKey] != null) {
     return window[storeKey];

package/utils/shared/index.d.js

@@ -1,11 +1,16 @@
 import { NectaryElementBase, isSinchElementName, sinchElementNameToBase } from "./nectary-element-base.js";
+import { createDeferredPromise } from "./deferred-promise.js";
+import { loadCSSModuleWithFallback, loadModuleWithFallback } from "./cdn-loader.js";
 import { getConstructor, getStore } from "./global-elements-store.js";
 import { GlobalElementsManager } from "./global-elements-manager.js";
 export {
   GlobalElementsManager,
   NectaryElementBase,
+  createDeferredPromise,
   getConstructor,
   getStore,
   isSinchElementName,
+  loadCSSModuleWithFallback,
+  loadModuleWithFallback,
   sinchElementNameToBase
 };

package/utils/shared/index.d.ts

@@ -1,3 +1,5 @@
 export * from './nectary-element-base';
+export * from './deferred-promise';
+export * from './cdn-loader';
 export * from './global-elements-store';
 export * from './global-elements-manager';

package/utils/shared/index.js

@@ -1,11 +1,16 @@
 import { NectaryElementBase, isSinchElementName, sinchElementNameToBase } from "./nectary-element-base.js";
+import { createDeferredPromise } from "./deferred-promise.js";
+import { loadCSSModuleWithFallback, loadModuleWithFallback } from "./cdn-loader.js";
 import { getConstructor, getStore } from "./global-elements-store.js";
 import { GlobalElementsManager } from "./global-elements-manager.js";
 export {
   GlobalElementsManager,
   NectaryElementBase,
+  createDeferredPromise,
   getConstructor,
   getStore,
   isSinchElementName,
+  loadCSSModuleWithFallback,
+  loadModuleWithFallback,
   sinchElementNameToBase
 };

package/utils/global-assets-manager.d.ts

@@ -1,52 +0,0 @@
-// Generated by dts-bundle-generator v9.5.1
-
-export type SinchElementName = `sinch-${string}`;
-export interface GlobalManagerConfig {
-	storeKey: symbol;
-	registryUrl: string;
-	baseElementNames: Set<string>;
-	nameToPathMap?: Map<string, string>;
-}
-export interface GlobalManagerInitOptions {
-	/**
-	 * URL to resolve the modules from
-	 */
-	cdnUrl: string;
-	/**
-	 * Fallback URL to resolve the modules from if `cdnUrl` fails
-	 */
-	fallbackCdnUrl?: string;
-	/**
-	 * Preloads all components from the bundle.js module
-	 */
-	preload?: boolean;
-	/**
-	 * Target version of the library to resolve
-	 *
-	 * If left unspecified, it will resolve to the latest version
-	 */
-	targetlibVersion?: string;
-}
-declare abstract class GlobalElementsManager {
-	private config;
-	constructor(config: GlobalManagerConfig);
-	getConstructor(name: SinchElementName): Promise<CustomElementConstructor> | null;
-	private patchCustomElements;
-	private toClassName;
-	private loadModuleWithFallback;
-	private createLoader;
-	private preloadBundle;
-	init(options: GlobalManagerInitOptions): Promise<void>;
-	whenLoaded(): Promise<void>;
-	private getImportPath;
-	private getModulePath;
-	preload(name: SinchElementName | SinchElementName[] | "all"): Promise<void>;
-}
-declare class GlobalAssetsManagerImpl extends GlobalElementsManager {
-	private static instance;
-	constructor();
-	static getInstance(): GlobalAssetsManagerImpl;
-}
-export declare const GlobalAssetsManager: GlobalAssetsManagerImpl;
-
-export {};