@myop/sdk 0.4.0-beta.5 → 0.4.0-beta.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (48) hide show
  1. package/README.md +13 -0
  2. package/dist/bundled-declarations.d.ts +87 -4
  3. package/dist/cjs/{_IframeSDK.ac4c28cf.js → _IframeSDK.49662e01.js} +97 -18
  4. package/dist/cjs/_IframeSDK.49662e01.js.map +7 -0
  5. package/dist/cjs/_IframeSDK.d4a97876.min.js +1 -0
  6. package/dist/cjs/_MyopHelpers.12acc780.min.js +1 -0
  7. package/dist/cjs/{_MyopHelpers.efed13e4.js → _MyopHelpers.2c449e7a.js} +78 -15
  8. package/dist/cjs/_MyopHelpers.2c449e7a.js.map +7 -0
  9. package/dist/cjs/_WebComponentSDK.1addf28b.min.js +1 -0
  10. package/dist/cjs/{_WebComponentSDK.4085389a.js → _WebComponentSDK.d5f9105b.js} +97 -18
  11. package/dist/cjs/_WebComponentSDK.d5f9105b.js.map +7 -0
  12. package/dist/cjs/_hostSDK.6dab59cb.min.js +1 -0
  13. package/dist/cjs/{_hostSDK.46b85afc.js → _hostSDK.8cf37510.js} +97 -18
  14. package/dist/cjs/_hostSDK.8cf37510.js.map +7 -0
  15. package/dist/cjs/myop_sdk.js +14 -14
  16. package/dist/cjs/myop_sdk.js.map +1 -1
  17. package/dist/cjs/myop_sdk.min.js +1 -1
  18. package/dist/cjs-bundled/myop_sdk.bundled.js +107 -21
  19. package/dist/cjs-bundled/myop_sdk.bundled.js.map +3 -3
  20. package/dist/cjs-bundled/myop_sdk.bundled.min.js +1 -1
  21. package/dist/module/Iframe/index.js +98 -19
  22. package/dist/module/Iframe/index.js.map +2 -2
  23. package/dist/module/SDK.js +107 -21
  24. package/dist/module/SDK.js.map +3 -3
  25. package/dist/module/common/index.d.ts +5 -0
  26. package/dist/module/common/index.js +1 -1
  27. package/dist/module/common/index.js.map +2 -2
  28. package/dist/module/embeddedSDK.js +1 -1
  29. package/dist/module/helpers/CloudRepository.d.ts +36 -1
  30. package/dist/module/helpers/cloudRepositoryHelpers.d.ts +42 -2
  31. package/dist/module/helpers/index.js +77 -16
  32. package/dist/module/helpers/index.js.map +2 -2
  33. package/dist/module/host/components/IMyopComponent.d.ts +3 -0
  34. package/dist/module/host/embeddedSDK.js +1 -1
  35. package/dist/module/host/hostSDK.d.ts +1 -1
  36. package/dist/module/host/index.js +98 -19
  37. package/dist/module/host/index.js.map +2 -2
  38. package/dist/module/webcomponent/index.js +98 -19
  39. package/dist/module/webcomponent/index.js.map +2 -2
  40. package/package.json +1 -1
  41. package/dist/cjs/_IframeSDK.47f37ec9.min.js +0 -1
  42. package/dist/cjs/_IframeSDK.ac4c28cf.js.map +0 -7
  43. package/dist/cjs/_MyopHelpers.91004b19.min.js +0 -1
  44. package/dist/cjs/_MyopHelpers.efed13e4.js.map +0 -7
  45. package/dist/cjs/_WebComponentSDK.4085389a.js.map +0 -7
  46. package/dist/cjs/_WebComponentSDK.4ca43f0a.min.js +0 -1
  47. package/dist/cjs/_hostSDK.0443afcd.min.js +0 -1
  48. package/dist/cjs/_hostSDK.46b85afc.js.map +0 -7
@@ -1019,6 +1019,10 @@ var BaseMyopComponent = class {
1019
1019
  }
1020
1020
  });
1021
1021
  }
1022
+ get uiTags() {
1023
+ var _a;
1024
+ return ((_a = this.componentDefinition) == null ? void 0 : _a.uiTags) || [];
1025
+ }
1022
1026
  get markedForDisposed() {
1023
1027
  return this._markedForDisposed;
1024
1028
  }
@@ -2098,6 +2102,21 @@ var addQueryParam = (url, param, value) => {
2098
2102
  urlObj.searchParams.append(param, value);
2099
2103
  return urlObj.toString();
2100
2104
  };
2105
+ var showsSamePage = (frame, url) => {
2106
+ const current = frame.getAttribute("src");
2107
+ if (!current || !url) return false;
2108
+ const norm = (u) => {
2109
+ const x = new URL(u, document.baseURI);
2110
+ x.hash = "";
2111
+ if (x.pathname.length > 1) x.pathname = x.pathname.replace(/\/$/, "");
2112
+ return x.href;
2113
+ };
2114
+ try {
2115
+ return norm(current) === norm(url);
2116
+ } catch (e) {
2117
+ return false;
2118
+ }
2119
+ };
2101
2120
  var MyopIframeLoader = class extends BaseMyopLoader {
2102
2121
  constructor() {
2103
2122
  super(...arguments);
@@ -2107,9 +2126,10 @@ var MyopIframeLoader = class extends BaseMyopLoader {
2107
2126
  let IframeElement;
2108
2127
  const typedLoaderConfig = skin.loader;
2109
2128
  if ((container == null ? void 0 : container.nodeName) === "IFRAME") {
2110
- console.log("needs to load into an exsisting Iframe...", typedLoaderConfig.url, container);
2111
2129
  IframeElement = container;
2112
- IframeElement.src = typedLoaderConfig.url;
2130
+ if (!showsSamePage(IframeElement, typedLoaderConfig.url)) {
2131
+ IframeElement.src = typedLoaderConfig.url;
2132
+ }
2113
2133
  } else {
2114
2134
  const uniqId = uuidv4();
2115
2135
  const domId = "myop-comp-".concat(uniqId);
@@ -2247,7 +2267,7 @@ var WebcomponentLoader = class extends BaseMyopLoader {
2247
2267
  };
2248
2268
 
2249
2269
  // version:myop-sdk-version
2250
- var myop_sdk_version_default = "0.4.0-beta.5";
2270
+ var myop_sdk_version_default = "0.4.0-beta.6";
2251
2271
 
2252
2272
  // src/helpers/deliveryStore.ts
2253
2273
  var DB_NAME = "myop-delivery";
@@ -2404,7 +2424,10 @@ var convertV2VariantToComponentConfig = (config) => {
2404
2424
  loader: config.consume_variant[0].loader
2405
2425
  }
2406
2426
  ],
2407
- defaultSkin: 0
2427
+ defaultSkin: 0,
2428
+ // Only `ui:` tags ever reach the client; the server filters, absent = none.
2429
+ // @ts-ignore
2430
+ uiTags: Array.isArray(config.uiTags) ? config.uiTags : []
2408
2431
  },
2409
2432
  name: config.name
2410
2433
  };
@@ -2446,7 +2469,7 @@ var _CloudRepository = class _CloudRepository {
2446
2469
  * Opt-in delivery settings, set by myop.delivery(). Off means: this file behaves
2447
2470
  * EXACTLY as it did before — same host, same URL, same everything.
2448
2471
  */
2449
- __publicField(this, "_delivery", { minify: false, host: null, cache: false });
2472
+ __publicField(this, "_delivery", { minify: false, host: null, cache: false, flow: false });
2450
2473
  /**
2451
2474
  * What actually happened, for myop.delivery.stats(). `fellBack` is the number that
2452
2475
  * matters: it is how you find out the lane is unhealthy without waiting for a
@@ -2481,6 +2504,9 @@ var _CloudRepository = class _CloudRepository {
2481
2504
  */
2482
2505
  __publicField(this, "_localServes", /* @__PURE__ */ new Map());
2483
2506
  __publicField(this, "_flushBound", false);
2507
+ // ============ V1 Methods (Legacy) ============
2508
+ /** ids seeded by hydrateV1Component whose first use has not been counted yet */
2509
+ __publicField(this, "_hydratedV1", /* @__PURE__ */ new Set());
2484
2510
  }
2485
2511
  static get Main() {
2486
2512
  const globalMain = getGlobalMain();
@@ -2516,32 +2542,46 @@ var _CloudRepository = class _CloudRepository {
2516
2542
  * Deliberately mutates THIS instance rather than constructing a new repository:
2517
2543
  * CloudRepository.Main is a global singleton shared across bundles (see getGlobalMain),
2518
2544
  * so a second instance would be ignored by every component already using the first.
2545
+ *
2546
+ * @internal
2519
2547
  */
2520
2548
  setDelivery(opts = {}) {
2521
2549
  if (opts.minify !== void 0) this._delivery.minify = !!opts.minify;
2522
2550
  if (opts.host !== void 0) this._delivery.host = opts.host;
2523
2551
  if (opts.cache !== void 0) this._delivery.cache = !!opts.cache;
2552
+ if (opts.flow !== void 0) this._delivery.flow = !!opts.flow;
2524
2553
  }
2554
+ /** @internal */
2525
2555
  deliveryStats() {
2526
2556
  var _a;
2527
2557
  return __spreadProps(__spreadValues({}, this._deliveryStats), {
2528
2558
  host: (_a = this._delivery.host) != null ? _a : _CloudRepository.DEFAULT_HOST,
2529
2559
  minify: this._delivery.minify,
2530
- cache: this._delivery.cache
2560
+ cache: this._delivery.cache,
2561
+ flow: this._delivery.flow
2531
2562
  });
2532
2563
  }
2533
2564
  /**
2534
2565
  * Forget what this browser holds, so the next load asks the server.
2535
2566
  * `refresh()` with no ids drops everything; the counterpart to the window for the case
2536
2567
  * where a change has to be visible on THIS load — right after someone publishes.
2568
+ *
2569
+ * @internal
2537
2570
  */
2538
2571
  async refreshDelivery() {
2539
2572
  await deliveryStore.clear();
2540
2573
  }
2541
- noteLocalServe(componentId, env) {
2542
- const cur = this._localServes.get(componentId);
2574
+ /**
2575
+ * `source: 'h'` = the view was served from a config the page's SERVER embedded
2576
+ * (hydrateV1Component), not from this browser's cache window. Reported as a 4th batch
2577
+ * field (`id:env:n:h`) so our usage data can tell server-rendered views apart; a server
2578
+ * that predates it reads the first three fields and counts the view all the same.
2579
+ */
2580
+ noteLocalServe(componentId, env, source) {
2581
+ const key = source ? "".concat(componentId, ":").concat(source) : componentId;
2582
+ const cur = this._localServes.get(key);
2543
2583
  if (cur) cur.count++;
2544
- else this._localServes.set(componentId, { env, count: 1 });
2584
+ else this._localServes.set(key, { id: componentId, env, count: 1, source });
2545
2585
  this.bindFlush();
2546
2586
  }
2547
2587
  /** Report on page-hide, which is the only event that reliably fires on mobile. */
@@ -2561,7 +2601,7 @@ var _CloudRepository = class _CloudRepository {
2561
2601
  */
2562
2602
  flushLocalServes() {
2563
2603
  if (!this._localServes.size) return;
2564
- const batch = [...this._localServes.entries()].map(([id, v]) => "".concat(id, ":").concat(v.env, ":").concat(v.count)).join(",");
2604
+ const batch = [...this._localServes.entries()].map(([, v]) => "".concat(v.id, ":").concat(v.env, ":").concat(v.count).concat(v.source ? ":" + v.source : "")).join(",");
2565
2605
  this._localServes.clear();
2566
2606
  try {
2567
2607
  const url = "".concat(this.deliveryHost(), "/clientUsage?b=").concat(encodeURIComponent(batch));
@@ -2610,7 +2650,7 @@ var _CloudRepository = class _CloudRepository {
2610
2650
  /**
2611
2651
  * Enable static mode for self-hosted component registries.
2612
2652
  * In static mode, URLs are constructed as file paths instead of query params:
2613
- * ${baseUrl}/components/${componentId}/${env}.json
2653
+ * `${baseUrl}/components/${componentId}/${env}.json`
2614
2654
  */
2615
2655
  enableStaticMode() {
2616
2656
  this._staticMode = true;
@@ -2819,6 +2859,14 @@ var _CloudRepository = class _CloudRepository {
2819
2859
  const { cacheKey } = this.resolveParams(componentId, env, preview);
2820
2860
  return ((_a = this.variants[cacheKey]) == null ? void 0 : _a.resolved) || null;
2821
2861
  }
2862
+ /**
2863
+ * The `ui:` tags of an already-resolved component (`[]` if it has none or is not
2864
+ * resolved yet). Synchronous, no request: tags arrive with the component itself.
2865
+ */
2866
+ getComponentTags(componentId, env, preview) {
2867
+ var _a, _b;
2868
+ return ((_b = (_a = this.getResolvedConfig(componentId, env, preview)) == null ? void 0 : _a.type) == null ? void 0 : _b.uiTags) || [];
2869
+ }
2822
2870
  /**
2823
2871
  * Resolve which (env, preview) pair — and therefore which cache key — a call
2824
2872
  * for `componentId` refers to.
@@ -2863,7 +2911,27 @@ var _CloudRepository = class _CloudRepository {
2863
2911
  this.variants[cacheKey] = promise;
2864
2912
  this.preloadedComponents[componentId] = { env: resolvedEnv, preview: usePreview };
2865
2913
  }
2866
- // ============ V1 Methods (Legacy) ============
2914
+ /**
2915
+ * Seed a v1 component's config, so `fetchComponentV1(componentId)` answers from memory
2916
+ * with no request. The v1 counterpart of {@link hydrateComponent}.
2917
+ *
2918
+ * `flow` is what `GET /flow?id=<componentId>&auto=true` returns: either the whole body
2919
+ * (`{item: {...}}`) or its `item`. Typical use is a server that fetched it (with
2920
+ * `&prefetch=1`, so the fetch is not counted as a view) and embedded it in the page.
2921
+ *
2922
+ * The view IS counted: the first time the seeded config is used, it is reported through
2923
+ * /clientUsage (flagged `:h`, recorded as deliveryPath 'hydrated'), so hydrating never makes
2924
+ * usage disappear and server-rendered views stay distinguishable.
2925
+ */
2926
+ hydrateV1Component(componentId, flow) {
2927
+ var _a, _b;
2928
+ const item = (_a = flow == null ? void 0 : flow.item) != null ? _a : flow;
2929
+ if (!((_b = item == null ? void 0 : item.components) == null ? void 0 : _b.length)) {
2930
+ throw new Error("hydrateV1Component(".concat(componentId, "): not a /flow?auto=true response"));
2931
+ }
2932
+ this.userFlows[componentId] = Promise.resolve(item);
2933
+ this._hydratedV1.add(componentId);
2934
+ }
2867
2935
  /**
2868
2936
  * Fetch a v1 component from a flow
2869
2937
  */
@@ -2877,13 +2945,15 @@ var _CloudRepository = class _CloudRepository {
2877
2945
  }
2878
2946
  }
2879
2947
  async fetchAutoFlow(componentId) {
2948
+ if (this._hydratedV1.delete(componentId)) {
2949
+ this.noteLocalServe(componentId, "v1_auto_flow", "h");
2950
+ }
2880
2951
  if (!this.userFlows[componentId]) {
2881
2952
  this.userFlows[componentId] = new Promise(
2882
2953
  async (resolve, reject) => {
2883
2954
  try {
2884
- const res = await fetch(
2885
- "".concat(this._baseUrl, "/flow?id=").concat(componentId, "&auto=true")
2886
- );
2955
+ const path = "/flow?id=".concat(componentId, "&auto=true");
2956
+ const res = this._delivery.flow && this._delivery.host ? await this.deliveryFetch(path) : await fetch("".concat(this._baseUrl).concat(path));
2887
2957
  const json = await res.json();
2888
2958
  resolve(json.item);
2889
2959
  } catch (e) {
@@ -2932,11 +3002,12 @@ var CloudRepository = _CloudRepository;
2932
3002
  var _cloudRepository = CloudRepository.Main;
2933
3003
  var DELIVERY_HOST = "https://delivery.myop.dev";
2934
3004
  var delivery = (opts = {}) => {
2935
- var _a, _b;
2936
- const wantsLane = opts.minify !== false || opts.cache === true;
3005
+ var _a, _b, _c;
3006
+ const wantsLane = opts.minify !== false || opts.cache === true || opts.flow === true;
2937
3007
  _cloudRepository.setDelivery({
2938
3008
  minify: (_a = opts.minify) != null ? _a : false,
2939
3009
  cache: (_b = opts.cache) != null ? _b : false,
3010
+ flow: (_c = opts.flow) != null ? _c : false,
2940
3011
  host: opts.host !== void 0 ? opts.host : wantsLane ? DELIVERY_HOST : null
2941
3012
  });
2942
3013
  return deliveryStats();
@@ -2947,9 +3018,14 @@ var deliveryRefresh = async () => {
2947
3018
  };
2948
3019
  var deliveryStats = () => _cloudRepository.deliveryStats();
2949
3020
  var deliveryOff = () => {
2950
- _cloudRepository.setDelivery({ minify: false, cache: false, host: null });
3021
+ _cloudRepository.setDelivery({ minify: false, cache: false, flow: false, host: null });
2951
3022
  return deliveryStats();
2952
3023
  };
3024
+ var hydrateV1Components = (flows) => {
3025
+ for (const [id, flow] of Object.entries(flows)) {
3026
+ _cloudRepository.hydrateV1Component(id, flow);
3027
+ }
3028
+ };
2953
3029
 
2954
3030
  // src/host/embeddedSDK.ts
2955
3031
  var EMBEDDED_SDK_CONTENT = "";
@@ -3693,6 +3769,9 @@ if (window.myop && !window.myop.delivery) {
3693
3769
  api.refresh = deliveryRefresh;
3694
3770
  window.myop.delivery = api;
3695
3771
  }
3772
+ if (window.myop && !window.myop.hydrateV1) {
3773
+ window.myop.hydrateV1 = hydrateV1Components;
3774
+ }
3696
3775
  var hostSDK = window.myop.hostSDK;
3697
3776
  defineDynamicImport("hostSDK", hostSDK);
3698
3777