@kaena1/mm-ui-shared-utils 1.25.0-f-poc-EC-3301.1 → 1.25.0-f-poc-EC-3301.3

package/dist/_virtual/_commonjsHelpers.js

@@ -0,0 +1,6 @@
+function getDefaultExportFromCjs(x) {
+  return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
+}
+export {
+  getDefaultExportFromCjs
+};

package/dist/_virtual/_interop_require_default.js

@@ -0,0 +1,4 @@
+var _interop_require_default = {};
+export {
+  _interop_require_default as __exports
+};

package/dist/_virtual/_interop_require_wildcard.js

@@ -0,0 +1,4 @@
+var _interop_require_wildcard = {};
+export {
+  _interop_require_wildcard as __exports
+};

package/dist/_virtual/head-manager-context.shared-runtime.js

@@ -0,0 +1,4 @@
+var headManagerContext_sharedRuntime = {};
+export {
+  headManagerContext_sharedRuntime as __exports
+};

package/dist/_virtual/head-manager.js

@@ -0,0 +1,4 @@
+var headManager = { exports: {} };
+export {
+  headManager as __module
+};

package/dist/_virtual/request-idle-callback.js

@@ -0,0 +1,4 @@
+var requestIdleCallback = { exports: {} };
+export {
+  requestIdleCallback as __module
+};

package/dist/_virtual/script.js

@@ -0,0 +1,4 @@
+var script = { exports: {} };
+export {
+  script as __module
+};

package/dist/components/ImportMapScripts.js

@@ -0,0 +1,36 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+import "react";
+import "react-dom";
+import { generateImportMapJson } from "../services/ImportMapService.js";
+import "../node_modules/next/dist/client/script.js";
+const ImportMapScripts = () => /* @__PURE__ */ jsxs(Fragment, { children: [
+  /* @__PURE__ */ jsx(
+    "script",
+    {
+      defer: true,
+      src: "https://ga.jspm.io/npm:es-module-shims@1.10.0/dist/es-module-shims.js",
+      crossOrigin: "anonymous"
+    }
+  ),
+  /* @__PURE__ */ jsx(
+    "link",
+    {
+      rel: "preconnect",
+      href: "https://assets-qa.mintmobile.com",
+      crossOrigin: "anonymous"
+    }
+  ),
+  /* @__PURE__ */ jsx("link", { rel: "dns-prefetch", href: "https://assets-qa.mintmobile.com" }),
+  /* @__PURE__ */ jsx("link", { rel: "preconnect", href: "https://esm.sh", crossOrigin: "anonymous" }),
+  /* @__PURE__ */ jsx("link", { rel: "dns-prefetch", href: "https://esm.sh" }),
+  /* @__PURE__ */ jsx(
+    "script",
+    {
+      type: "importmap-shim",
+      dangerouslySetInnerHTML: { __html: generateImportMapJson() }
+    }
+  )
+] });
+export {
+  ImportMapScripts
+};

package/dist/components/RemoteLinks.js

@@ -0,0 +1,10 @@
+import { jsxs, Fragment, jsx } from "react/jsx-runtime";
+const RemoteLinks = ({ manifest }) => {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    manifest.styleUrl && /* @__PURE__ */ jsx("link", { rel: "stylesheet", href: manifest.styleUrl }),
+    /* @__PURE__ */ jsx("link", { rel: "modulepreload", href: manifest.bundleUrl })
+  ] });
+};
+export {
+  RemoteLinks
+};

package/dist/components/RemoteRenderer.js

@@ -0,0 +1,27 @@
+import { jsx, Fragment } from "react/jsx-runtime";
+import { useRemoteComponent } from "../hooks/useRemoteComponent.js";
+const RemoteRenderer = ({
+  manifest,
+  componentName,
+  componentProps,
+  autoLoad = true,
+  placeholder = null,
+  children,
+  errorFallback
+}) => {
+  const {
+    component: Comp,
+    error,
+    loaded
+  } = useRemoteComponent({
+    manifest,
+    componentName,
+    autoLoad
+  });
+  if (error) return errorFallback ? errorFallback(error) : null;
+  if (!loaded || !Comp) return /* @__PURE__ */ jsx(Fragment, { children: placeholder });
+  return /* @__PURE__ */ jsx(Comp, { ...componentProps, children });
+};
+export {
+  RemoteRenderer
+};

package/dist/hooks/useRemoteComponent.js

@@ -0,0 +1,69 @@
+import { useState, useCallback, useEffect } from "react";
+import { moduleLoader } from "../services/moduleLoader.js";
+import "react/jsx-runtime";
+import "../node_modules/next/dist/client/script.js";
+function useRemoteComponent(options) {
+  const {
+    manifest: manifestFromProps,
+    componentName,
+    autoLoad = true
+  } = options;
+  const [state, setState] = useState({
+    component: null,
+    manifest: null,
+    loading: false,
+    error: null,
+    loaded: false
+  });
+  const loadComponent = useCallback(async () => {
+    try {
+      setState((prev) => ({
+        ...prev,
+        loading: true,
+        error: null,
+        manifest: manifestFromProps
+      }));
+      const loadOptions = {
+        bundleUrl: manifestFromProps.bundleUrl,
+        componentName
+      };
+      const component = await moduleLoader.loadComponent(loadOptions);
+      setState((prev) => ({
+        ...prev,
+        component,
+        loading: false,
+        loaded: true
+      }));
+    } catch (err) {
+      console.error("Error loading remote component:", err);
+      setState((prev) => ({
+        ...prev,
+        error: err.message,
+        loading: false,
+        loaded: false
+      }));
+    }
+  }, [manifestFromProps, componentName]);
+  const reload = useCallback(async () => {
+    await loadComponent();
+  }, [loadComponent]);
+  const clearError = useCallback(() => {
+    setState((prev) => ({ ...prev, error: null }));
+  }, []);
+  useEffect(() => {
+    if (autoLoad) {
+      loadComponent().then(() => {
+        setState((prev) => ({ ...prev, loaded: true }));
+      });
+    }
+  }, [autoLoad, loadComponent]);
+  return {
+    ...state,
+    loadComponent,
+    reload,
+    clearError
+  };
+}
+export {
+  useRemoteComponent
+};

package/dist/index.d.ts

@@ -1,3 +1,5 @@
+/// <reference types="react" />
+
 import { default as default_2 } from 'react';
 
 export declare interface ComponentManifest {
@@ -8,20 +10,61 @@ export declare interface ComponentManifest {
 export declare function fetchManifest(manifestUrl: string): Promise<RemoteManifest>;
 
 /**
- * Generates an import map JSON string for ES module dependency resolution
- * This allows remote modules to use bare specifiers like 'react' instead of full CDN URLs
+ * Generate complete import map object for remote components
+ *
+ * @param config - Optional configuration to override default settings
+ * @returns Import map object ready for browser consumption
  */
-export declare function generateImportMapJson(): string;
+export declare const generateImportMap: (config?: ImportMapConfig) => object;
+
+export declare const generateImportMapJson: (config?: ImportMapConfig) => string;
+
+/**
+ * Get import map script props for Next.js Script component
+ *
+ * @param config - Optional configuration to override default settings
+ * @returns Props object with type and dangerouslySetInnerHTML for Script component
+ * @example
+ * ```tsx
+ * <Script {...getImportMapScriptProps()} strategy="beforeInteractive" />
+ * ```
+ */
+export declare const getImportMapScriptProps: (config?: ImportMapConfig) => {
+    type: "importmap-shim";
+    dangerouslySetInnerHTML: {
+        __html: string;
+    };
+};
+
+export declare interface ImportMapConfig {
+    reactVersion?: string;
+    reactDomVersion?: string;
+    customImports?: Record<string, string>;
+}
+
+export declare const ImportMapScript: React.FC<ImportMapScriptProps>;
+
+declare interface ImportMapScriptProps {
+    reactVersion?: string;
+    reactDomVersion?: string;
+    customImports?: Record<string, string>;
+    strategy?: 'beforeInteractive' | 'afterInteractive' | 'lazyOnload';
+}
 
 export declare const ImportMapScripts: default_2.FC;
 
+/**
+ * Validate browser support for import maps
+ *
+ * @returns true if the browser supports import maps, false otherwise
+ * @see https://caniuse.com/import-maps
+ */
+export declare const isImportMapSupported: () => boolean;
+
 export declare class ModuleLoader {
     private loadedModules;
     private importMapInjected;
-    /**
-     * Ensure React and ReactDOM are available globally
-     * Remote components may expect these to be on window object.
-     */
+    private prepareGlobalDependencies;
     /**
      * Ensure import map is injected before loading any modules
      * Import maps MUST be added before any module scripts

package/dist/index.js

@@ -1,299 +1,22 @@
-var M = Object.defineProperty;
-var y = (n, e, t) => e in n ? M(n, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : n[e] = t;
-var u = (n, e, t) => y(n, typeof e != "symbol" ? e + "" : e, t);
-import { useState as x, useEffect as w, useCallback as f } from "react";
-import { jsx as l, Fragment as h, jsxs as g } from "react/jsx-runtime";
-async function $(n) {
-  try {
-    const e = await fetch(n, {
-      headers: {
-        "Content-Type": "application/json"
-      }
-    });
-    if (!e.ok)
-      throw new Error(
-        `Failed to fetch manifest: ${e.status} ${e.statusText}`
-      );
-    const t = await e.json();
-    if (!t || typeof t != "object" || !t.components || typeof t.components != "object")
-      throw new Error("Invalid manifest: missing 'components' object");
-    return t;
-  } catch (e) {
-    throw e instanceof Error ? new Error(
-      `Manifest loading failed from ${n}: ${e.message}`
-    ) : new Error(
-      `Manifest loading failed from ${n}: Unknown error`
-    );
-  }
-}
-class R {
-  constructor() {
-    u(this, "loadedModules", /* @__PURE__ */ new Map());
-    u(this, "importMapInjected", !1);
-  }
-  /**
-   * Ensure React and ReactDOM are available globally
-   * Remote components may expect these to be on window object.
-   */
-  // private prepareGlobalDependencies(): void {
-  //   if (typeof window === 'undefined') return;
-  //   if (!(window as any).React) {
-  //     (window as any).React = require('react');
-  //   }
-  //   if (!(window as any).ReactDOM) {
-  //     (window as any).ReactDOM = require('react-dom');
-  //   }
-  // }
-  /**
-   * Ensure import map is injected before loading any modules
-   * Import maps MUST be added before any module scripts
-   */
-  ensureImportMap() {
-    if (typeof window > "u" || this.importMapInjected) return;
-    if (document.querySelector(
-      'script[type="importmap"], script[type="importmap-shim"]'
-    )) {
-      this.importMapInjected = !0;
-      return;
-    }
-    console.warn(
-      `Import map not found. Ensure an import map is included early in:
-
-      - pages router: the document head (e.g. in pages/_document.tsx).
-
-      - app router: the root layout head (e.g. in app/layout.tsx).`
-    ), this.importMapInjected = !0;
-  }
-  /**
-   * Load remote React component from ES module URL
-   *
-   * @param options - Configuration object with bundleUrl and componentName
-   * @returns Promise that resolves to the loaded React component
-   * @throws Error if component loading fails or times out (10s)
-   */
-  async loadComponent(e) {
-    const { bundleUrl: t, componentName: a } = e;
-    if (this.loadedModules.has(t)) {
-      console.log(
-        `%c📦 LOADER: Returning module from INTERNAL cache for ${t}`,
-        "color: green; font-weight: bold;"
-      );
-      const o = this.loadedModules.get(t), s = (o == null ? void 0 : o[a]) || (o == null ? void 0 : o.default);
-      if (s) return s;
-    }
-    this.ensureImportMap();
-    try {
-      const o = await this.loadModuleViaScript(t), s = o[a] || o.default;
-      if (!s)
-        throw new Error(`Component ${a} not found in module`);
-      return this.loadedModules.set(t, o), s;
-    } catch (o) {
-      throw console.error("🔍 LOADER: Failed to load component:", o), o;
-    }
-  }
-  /**
-   * Load ES module from external URL using dynamic script injection
-   * This bypasses Webpack's module resolution and works with import maps
-   */
-  loadModuleViaScript(e) {
-    return new Promise((t, a) => {
-      const o = `__moduleCallback_${Date.now()}_${Math.random().toString(36).substr(2, 9)}`, s = 50, i = 200;
-      let c = 0;
-      const m = `
-        import * as loadedModule from '${e}';
-        window.${o} = loadedModule;
-      `, r = document.createElement("script");
-      r.type = "module-shim", r.textContent = m;
-      const d = setInterval(() => {
-        if (c++, window[o]) {
-          clearInterval(d);
-          const p = window[o];
-          delete window[o], r.parentNode && document.head.removeChild(r), t(p);
-        } else c >= i && (clearInterval(d), delete window[o], r.parentNode && document.head.removeChild(r), a(new Error(`Timeout loading module from ${e}`)));
-      }, s);
-      r.onerror = (p) => {
-        clearInterval(d), delete window[o], r.parentNode && document.head.removeChild(r), a(new Error(`Failed to load module from ${e}`));
-      }, document.head.appendChild(r);
-    });
-  }
-  /**
-   * Preload a module without extracting components
-   * Useful for warming up cache
-   *
-   * @param bundleUrl - URL of the module to preload
-   */
-  async preloadModule(e) {
-    if (!this.loadedModules.has(e)) {
-      this.ensureImportMap();
-      try {
-        const t = await this.loadModuleViaScript(e);
-        this.loadedModules.set(e, t);
-      } catch (t) {
-        console.error(`Failed to preload module ${e}:`, t);
-      }
-    }
-  }
-  /**
-   * Check if a module has already been loaded
-   *
-   * @param bundleUrl - URL of the module to check
-   * @returns true if module is already loaded, false otherwise
-   */
-  isLoaded(e) {
-    return this.loadedModules.has(e);
-  }
-  /**
-   * Clear all loaded modules from cache
-   * Useful for development/testing
-   */
-  clearCache() {
-    this.loadedModules.clear();
-  }
-}
-const j = new R();
-function I() {
-  const n = `data:text/javascript;charset=utf-8,
-  const React = window.React;
-  export default React;
-  export const {
-    Component, PureComponent, createContext, useContext, useState, useEffect,
-    useCallback, useMemo, useRef, forwardRef, createElement, Fragment, memo, lazy, Suspense,
-    useLayoutEffect, useId, useReducer, useImperativeHandle
-  } = React;`, e = `data:text/javascript;charset=utf-8,
-  const React = window.React;
-  export const jsx = React.createElement;
-  export const jsxs = React.createElement;
-  export const Fragment = React.Fragment;`;
-  return JSON.stringify({
-    imports: {
-      react: n,
-      "react/jsx-runtime": e,
-      "react/jsx-dev-runtime": e,
-      "react/jsx-runtime.js": e,
-      "react/jsx-dev-runtime.js": e,
-      "react-dom": "https://esm.sh/react-dom@18.3.1",
-      "react-dom/client": "https://esm.sh/react-dom@18.3.1/client"
-    }
-  });
-}
-function C(n) {
-  const {
-    manifest: e,
-    componentName: t,
-    autoLoad: a = !0
-  } = n, [o, s] = x({
-    component: null,
-    manifest: null,
-    loading: !1,
-    error: null,
-    loaded: !1
-  });
-  w(() => {
-    var r;
-    typeof window < "u" && console.log("🧩 Remote sees React:", {
-      react: window.React,
-      useState: (r = window.React) == null ? void 0 : r.useState
-    });
-  }, []);
-  const i = f(async () => {
-    try {
-      s((p) => ({
-        ...p,
-        loading: !0,
-        error: null,
-        manifest: e
-      }));
-      const r = {
-        bundleUrl: e.bundleUrl,
-        componentName: t
-      }, d = await j.loadComponent(r);
-      s((p) => ({
-        ...p,
-        component: d,
-        loading: !1,
-        loaded: !0
-      }));
-    } catch (r) {
-      console.error("Error loading remote component:", r), s((d) => ({
-        ...d,
-        error: r.message,
-        loading: !1,
-        loaded: !1
-      }));
-    }
-  }, [e, t]), c = f(async () => {
-    await i();
-  }, [i]), m = f(() => {
-    s((r) => ({ ...r, error: null }));
-  }, []);
-  return w(() => {
-    a && i().then(() => {
-      s((r) => ({ ...r, loaded: !0 }));
-    });
-  }, [a, i]), {
-    ...o,
-    loadComponent: i,
-    reload: c,
-    clearError: m
-  };
-}
-const k = ({
-  manifest: n,
-  componentName: e,
-  componentProps: t,
-  autoLoad: a = !0,
-  placeholder: o = null,
-  children: s,
-  errorFallback: i
-}) => {
-  const {
-    component: c,
-    error: m,
-    loaded: r
-  } = C({
-    manifest: n,
-    componentName: e,
-    autoLoad: a
-  });
-  return m ? i ? i(m) : null : !r || !c ? /* @__PURE__ */ l(h, { children: o }) : /* @__PURE__ */ l(c, { ...t, children: s });
-}, b = ({ manifest: n }) => /* @__PURE__ */ g(h, { children: [
-  n.styleUrl && /* @__PURE__ */ l("link", { rel: "stylesheet", href: n.styleUrl }),
-  /* @__PURE__ */ l("link", { rel: "modulepreload", href: n.bundleUrl })
-] }), L = () => /* @__PURE__ */ g(h, { children: [
-  /* @__PURE__ */ l(
-    "script",
-    {
-      defer: !0,
-      src: "https://ga.jspm.io/npm:es-module-shims@1.10.0/dist/es-module-shims.js",
-      crossOrigin: "anonymous"
-    }
-  ),
-  /* @__PURE__ */ l(
-    "link",
-    {
-      rel: "preconnect",
-      href: "https://assets-qa.mintmobile.com",
-      crossOrigin: "anonymous"
-    }
-  ),
-  /* @__PURE__ */ l("link", { rel: "dns-prefetch", href: "https://assets-qa.mintmobile.com" }),
-  /* @__PURE__ */ l("link", { rel: "preconnect", href: "https://esm.sh", crossOrigin: "anonymous" }),
-  /* @__PURE__ */ l("link", { rel: "dns-prefetch", href: "https://esm.sh" }),
-  /* @__PURE__ */ l(
-    "script",
-    {
-      type: "importmap-shim",
-      dangerouslySetInnerHTML: { __html: I() }
-    }
-  )
-] });
+import { fetchManifest } from "./services/fetchManifest.js";
+import { ModuleLoader, moduleLoader } from "./services/moduleLoader.js";
+import { generateImportMap, generateImportMapJson, getImportMapScriptProps, isImportMapSupported } from "./services/ImportMapService.js";
+import { ImportMapScript } from "./services/ImportMapScript.js";
+import { useRemoteComponent } from "./hooks/useRemoteComponent.js";
+import { RemoteRenderer } from "./components/RemoteRenderer.js";
+import { RemoteLinks } from "./components/RemoteLinks.js";
+import { ImportMapScripts } from "./components/ImportMapScripts.js";
 export {
-  L as ImportMapScripts,
-  R as ModuleLoader,
-  b as RemoteLinks,
-  k as RemoteRenderer,
-  $ as fetchManifest,
-  I as generateImportMapJson,
-  j as moduleLoader,
-  C as useRemoteComponent
+  ImportMapScript,
+  ImportMapScripts,
+  ModuleLoader,
+  RemoteLinks,
+  RemoteRenderer,
+  fetchManifest,
+  generateImportMap,
+  generateImportMapJson,
+  getImportMapScriptProps,
+  isImportMapSupported,
+  moduleLoader,
+  useRemoteComponent
 };

package/dist/node_modules/@swc/helpers/cjs/_interop_require_default.js

@@ -0,0 +1,8 @@
+import { __exports as _interop_require_default$1 } from "../../../../_virtual/_interop_require_default.js";
+_interop_require_default$1._ = _interop_require_default$1._interop_require_default = _interop_require_default;
+function _interop_require_default(obj) {
+  return obj && obj.__esModule ? obj : { default: obj };
+}
+export {
+  _interop_require_default$1 as default
+};

package/dist/node_modules/@swc/helpers/cjs/_interop_require_wildcard.js

@@ -0,0 +1,31 @@
+import { __exports as _interop_require_wildcard$1 } from "../../../../_virtual/_interop_require_wildcard.js";
+function _getRequireWildcardCache(nodeInterop) {
+  if (typeof WeakMap !== "function") return null;
+  var cacheBabelInterop = /* @__PURE__ */ new WeakMap();
+  var cacheNodeInterop = /* @__PURE__ */ new WeakMap();
+  return (_getRequireWildcardCache = function(nodeInterop2) {
+    return nodeInterop2 ? cacheNodeInterop : cacheBabelInterop;
+  })(nodeInterop);
+}
+_interop_require_wildcard$1._ = _interop_require_wildcard$1._interop_require_wildcard = _interop_require_wildcard;
+function _interop_require_wildcard(obj, nodeInterop) {
+  if (!nodeInterop && obj && obj.__esModule) return obj;
+  if (obj === null || typeof obj !== "object" && typeof obj !== "function") return { default: obj };
+  var cache = _getRequireWildcardCache(nodeInterop);
+  if (cache && cache.has(obj)) return cache.get(obj);
+  var newObj = { __proto__: null };
+  var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;
+  for (var key in obj) {
+    if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {
+      var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;
+      if (desc && (desc.get || desc.set)) Object.defineProperty(newObj, key, desc);
+      else newObj[key] = obj[key];
+    }
+  }
+  newObj.default = obj;
+  if (cache) cache.set(obj, newObj);
+  return newObj;
+}
+export {
+  _interop_require_wildcard$1 as default
+};