@myop/sdk 0.3.33 → 0.3.36

package/dist/bundled-declarations.d.ts

@@ -1710,7 +1710,8 @@ declare module "@myop/sdk/host/loaders/HTMLComponentLoader" {
          */
         private extractWebComponentScript;
         /**
-         * Execute the web component script on the host document
+         * Execute the web component script on the host document.
+         * Returns the custom element tag name this script registered.
          */
         private executeWebComponentScript;
         /**
@@ -1821,9 +1822,28 @@ declare module "@myop/sdk/helpers/CloudRepository" {
             env: string;
             preview: boolean;
         } | undefined;
+        /**
+         * Resolve a component config: fetch it once, then serve it from this
+         * repository's cache.
+         *
+         * This is the name to use. `fetchComponentV2` is the same method under its
+         * versioned name and stays for backward compatibility — note that the
+         * unversioned `fetchComponent` is a *deprecated v1* API and is NOT this.
+         *
+         * Completes the trio with {@link getResolvedConfig} (synchronous read of an
+         * already-resolved config) and {@link hydrateComponent} (seed one you
+         * already hold).
+         *
+         * Prefer the module-level `preloadComponents([id])` in app code; reach for
+         * this when you need an isolated repository instance whose cache lifetime
+         * you control — a server with its own TTL, for example.
+         */
+        resolveComponent(componentId: string, env?: string, preview?: boolean): Promise<IComponentConfig>;
         /**
          * Fetch a v2 component config
          * If env/preview not specified and component was preloaded, uses preloaded params
+         *
+         * @see resolveComponent — the unversioned name for this method
          */
         fetchComponentV2(componentId: string, environmentIdentifier?: string, preview?: boolean): Promise<IComponentConfig>;
         /**
@@ -1840,6 +1860,30 @@ declare module "@myop/sdk/helpers/CloudRepository" {
          * skipping the WEBVIEW_READY → fetch → inject round trip entirely.
          */
         getResolvedConfig(componentId: string, env?: string, preview?: boolean): IComponentConfig | null;
+        /**
+         * Resolve which (env, preview) pair — and therefore which cache key — a call
+         * for `componentId` refers to.
+         *
+         * Single source of truth for fetchComponentV2, getResolvedConfig and
+         * hydrateComponent, so a hydrated config always lands on the key a later
+         * fetch will look under.
+         */
+        private resolveParams;
+        /**
+         * Seed an already-resolved component config into the cache, without any
+         * network request.
+         *
+         * The counterpart to {@link fetchComponentV2}: use it when the config was
+         * resolved somewhere else — most often on a server, then embedded in the
+         * page — so the browser can render the component with no round trip.
+         *
+         * After hydrating, `fetchComponentV2`, `getResolvedConfig` and `isPreloaded`
+         * all answer for this component from memory.
+         *
+         * Pass the same `env` / `preview` the config was resolved with; the defaults
+         * match what a plain `fetchComponentV2(componentId)` would have used.
+         */
+        hydrateComponent(componentId: string, config: IComponentConfig, env?: string, preview?: boolean): void;
         /**
          * Fetch a v1 component from a flow
          */
@@ -1862,6 +1906,7 @@ declare module "@myop/sdk/helpers/exec" {
 }
 declare module "@myop/sdk/helpers/cloudRepositoryHelpers" {
     import { CloudRepository } from "@myop/sdk/helpers/CloudRepository";
+    import { IComponentConfig } from "@myop/sdk/common";
     export const getCloudRepository: () => CloudRepository;
     export const isPreloaded: (componentId: string, env?: string, preview?: boolean) => boolean;
     export const getPreloadedParams: (componentId: string) => {
@@ -1878,8 +1923,26 @@ declare module "@myop/sdk/helpers/cloudRepositoryHelpers" {
     export const enableSelfHosted: (cdnUrl: string, queryParams?: Record<string, string>) => void;
     export const setCloudRepository: (repository: CloudRepository) => void;
     export const setEnvironment: (env: string) => void;
-    export const getResolvedConfig: (componentId: string, env?: string, preview?: boolean) => import("common").IComponentConfig;
-    export const preloadComponents: (ids: string[], env?: string, preview?: boolean) => Promise<PromiseSettledResult<import("common").IComponentConfig>[]>;
+    export const getResolvedConfig: (componentId: string, env?: string, preview?: boolean) => IComponentConfig;
+    export const preloadComponents: (ids: string[], env?: string, preview?: boolean) => Promise<PromiseSettledResult<IComponentConfig>[]>;
+    /**
+     * Seed already-resolved component configs into the SDK cache, with no network
+     * request. The counterpart to {@link preloadComponents}.
+     *
+     * Use it when the configs were resolved somewhere else — typically on a server
+     * and embedded in the page — so the component renders with zero round trips:
+     *
+     * ```ts
+     * // server: const configs = { [id]: await new CloudRepository().fetchComponentV2(id) }
+     * // client:
+     * hydrateComponents(configs);
+     * // <MyopComponent componentId={id} /> now renders without fetching
+     * ```
+     *
+     * Pass the same `env` / `preview` the configs were resolved with; the defaults
+     * match what a plain `preloadComponents([id])` would have used.
+     */
+    export const hydrateComponents: (configs: Record<string, IComponentConfig>, env?: string, preview?: boolean) => void;
 }
 declare module "@myop/sdk/helpers" {
     export * from "@myop/sdk/helpers/applyStylesheet";

package/dist/cjs/{_IframeSDK.e5b2bc49.js → _IframeSDK.3283252f.js}

@@ -2142,7 +2142,7 @@ var WebcomponentLoader = class extends BaseMyopLoader {
 };
 
 // version:myop-sdk-version
-var myop_sdk_version_default = "0.3.33";
+var myop_sdk_version_default = "0.3.36";
 
 // src/webcomponent/messageHandlers/BaseWebComponentMessageHandler.ts
 var BaseWebComponentMessageHandler = class extends BaseContextMessageHandler {
@@ -2474,7 +2474,7 @@ var HAS_EMBEDDED_SDK = false;
 // src/host/loaders/HTMLComponentLoader.ts
 var MYOP_WEB_COMPONENT_MARKER = "<!-- myop-web-component -->";
 var MYOP_WEB_COMPONENT_SCRIPT_ID = "myop-web-component";
-var extractedWebComponentScripts = /* @__PURE__ */ new Set();
+var extractedWebComponentScripts = /* @__PURE__ */ new Map();
 var seen2 = [];
 var sdk;
 var getInitiatedSdk = async () => {
@@ -2715,19 +2715,25 @@ var HTMLComponentLoader = class extends BaseMyopLoader {
     return (script == null ? void 0 : script.textContent) || null;
   }
   /**
-   * Execute the web component script on the host document
+   * Execute the web component script on the host document.
+   * Returns the custom element tag name this script registered.
    */
   executeWebComponentScript(scriptContent, scriptId) {
-    if (extractedWebComponentScripts.has(scriptId)) {
-      console.log("[MyopWebComponent] Script already executed for ".concat(scriptId, ", skipping"));
-      return;
+    const cachedTagName = extractedWebComponentScripts.get(scriptId);
+    if (cachedTagName) {
+      console.log("[MyopWebComponent] Script already executed for ".concat(scriptId, ", reusing <").concat(cachedTagName, ">"));
+      return cachedTagName;
     }
     const script = document.createElement("script");
     script.textContent = scriptContent;
     script.id = "myop-extracted-".concat(scriptId);
     document.head.appendChild(script);
-    extractedWebComponentScripts.add(scriptId);
-    console.log("[MyopWebComponent] Executed web component script: ".concat(scriptId));
+    const tagName = window.__MYOP_TAG_NAME__;
+    if (tagName) {
+      extractedWebComponentScripts.set(scriptId, tagName);
+    }
+    console.log("[MyopWebComponent] Executed web component script: ".concat(scriptId, " -> <").concat(tagName, ">"));
+    return tagName;
   }
   /**
    * Load a Myop Web Component (extracted and run on host document)
@@ -2738,15 +2744,10 @@ var HTMLComponentLoader = class extends BaseMyopLoader {
       throw new Error('[MyopWebComponent] No <script id="myop-web-component"> found in HTML');
     }
     const scriptId = "".concat(componentDefinition.id, "-").concat(skin.id);
-    const previousTagName = window.__MYOP_TAG_NAME__;
-    this.executeWebComponentScript(scriptContent, scriptId);
-    const tagName = window.__MYOP_TAG_NAME__;
+    const tagName = this.executeWebComponentScript(scriptContent, scriptId);
     if (!tagName) {
       throw new Error("[MyopWebComponent] Script did not set window.__MYOP_TAG_NAME__");
     }
-    if (previousTagName && previousTagName !== tagName) {
-      console.warn("[MyopWebComponent] __MYOP_TAG_NAME__ changed from ".concat(previousTagName, " to ").concat(tagName));
-    }
     const domId = "myop-comp-".concat(uuidv4());
     const element = document.createElement(tagName);
     element.id = domId;
@@ -2922,24 +2923,33 @@ var _CloudRepository = class _CloudRepository {
   getPreloadedParams(componentId) {
     return this.preloadedComponents[componentId];
   }
+  /**
+   * Resolve a component config: fetch it once, then serve it from this
+   * repository's cache.
+   *
+   * This is the name to use. `fetchComponentV2` is the same method under its
+   * versioned name and stays for backward compatibility — note that the
+   * unversioned `fetchComponent` is a *deprecated v1* API and is NOT this.
+   *
+   * Completes the trio with {@link getResolvedConfig} (synchronous read of an
+   * already-resolved config) and {@link hydrateComponent} (seed one you
+   * already hold).
+   *
+   * Prefer the module-level `preloadComponents([id])` in app code; reach for
+   * this when you need an isolated repository instance whose cache lifetime
+   * you control — a server with its own TTL, for example.
+   */
+  async resolveComponent(componentId, env, preview) {
+    return this.fetchComponentV2(componentId, env, preview);
+  }
   /**
    * Fetch a v2 component config
    * If env/preview not specified and component was preloaded, uses preloaded params
+   *
+   * @see resolveComponent — the unversioned name for this method
    */
   async fetchComponentV2(componentId, environmentIdentifier, preview) {
-    const preloaded = this.preloadedComponents[componentId];
-    const hasExplicitParams = environmentIdentifier !== void 0 || preview !== void 0;
-    let env;
-    let usePreview;
-    if (!hasExplicitParams && preloaded) {
-      env = preloaded.env;
-      usePreview = preloaded.preview;
-    } else {
-      env = environmentIdentifier || this._defaultEnv;
-      const hasEffectiveEnv = environmentIdentifier || this._envExplicitlySet;
-      usePreview = preview === true ? true : preview === false ? false : !hasEffectiveEnv;
-    }
-    const cacheKey = "".concat(componentId, ":").concat(env, ":").concat(usePreview ? "preview" : "live");
+    const { env, usePreview, cacheKey } = this.resolveParams(componentId, environmentIdentifier, preview);
     console.log("[CloudRepository] fetchComponentV2", {
       componentId: componentId.slice(0, 8) + "...",
       env,
@@ -3008,20 +3018,52 @@ var _CloudRepository = class _CloudRepository {
    */
   getResolvedConfig(componentId, env, preview) {
     var _a;
+    const { cacheKey } = this.resolveParams(componentId, env, preview);
+    return ((_a = this.variants[cacheKey]) == null ? void 0 : _a.resolved) || null;
+  }
+  /**
+   * Resolve which (env, preview) pair — and therefore which cache key — a call
+   * for `componentId` refers to.
+   *
+   * Single source of truth for fetchComponentV2, getResolvedConfig and
+   * hydrateComponent, so a hydrated config always lands on the key a later
+   * fetch will look under.
+   */
+  resolveParams(componentId, environmentIdentifier, preview) {
     const preloaded = this.preloadedComponents[componentId];
-    const hasExplicitParams = env !== void 0 || preview !== void 0;
-    let resolvedEnv;
+    const hasExplicitParams = environmentIdentifier !== void 0 || preview !== void 0;
+    let env;
     let usePreview;
     if (!hasExplicitParams && preloaded) {
-      resolvedEnv = preloaded.env;
+      env = preloaded.env;
       usePreview = preloaded.preview;
     } else {
-      resolvedEnv = env || this._defaultEnv;
-      const hasEffectiveEnv = env || this._envExplicitlySet;
+      env = environmentIdentifier || this._defaultEnv;
+      const hasEffectiveEnv = environmentIdentifier || this._envExplicitlySet;
       usePreview = preview === true ? true : preview === false ? false : !hasEffectiveEnv;
     }
-    const cacheKey = "".concat(componentId, ":").concat(resolvedEnv, ":").concat(usePreview ? "preview" : "live");
-    return ((_a = this.variants[cacheKey]) == null ? void 0 : _a.resolved) || null;
+    return { env, usePreview, cacheKey: "".concat(componentId, ":").concat(env, ":").concat(usePreview ? "preview" : "live") };
+  }
+  /**
+   * Seed an already-resolved component config into the cache, without any
+   * network request.
+   *
+   * The counterpart to {@link fetchComponentV2}: use it when the config was
+   * resolved somewhere else — most often on a server, then embedded in the
+   * page — so the browser can render the component with no round trip.
+   *
+   * After hydrating, `fetchComponentV2`, `getResolvedConfig` and `isPreloaded`
+   * all answer for this component from memory.
+   *
+   * Pass the same `env` / `preview` the config was resolved with; the defaults
+   * match what a plain `fetchComponentV2(componentId)` would have used.
+   */
+  hydrateComponent(componentId, config, env, preview) {
+    const { env: resolvedEnv, usePreview, cacheKey } = this.resolveParams(componentId, env, preview);
+    const promise = Promise.resolve(config);
+    promise.resolved = config;
+    this.variants[cacheKey] = promise;
+    this.preloadedComponents[componentId] = { env: resolvedEnv, preview: usePreview };
   }
   // ============ V1 Methods (Legacy) ============
   /**