@plasmicapp/loader-react 1.0.341 → 1.0.343

package/dist/react-server.esm.js

@@ -17,6 +17,18 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
+var __objRest = (source, exclude) => {
+  var target = {};
+  for (var prop in source)
+    if (__hasOwnProp.call(source, prop) && exclude.indexOf(prop) < 0)
+      target[prop] = source[prop];
+  if (source != null && __getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(source)) {
+      if (exclude.indexOf(prop) < 0 && __propIsEnum.call(source, prop))
+        target[prop] = source[prop];
+    }
+  return target;
+};
 var __async = (__this, __arguments, generator) => {
   return new Promise((resolve, reject) => {
     var fulfilled = (value) => {
@@ -40,7 +52,22 @@ var __async = (__this, __arguments, generator) => {
 
 // src/react-server.ts
 import "server-only";
-import { PlasmicModulesFetcher, PlasmicTracker } from "@plasmicapp/loader-core";
+
+// src/loader-server.tsx
+import { PlasmicModulesFetcher as PlasmicModulesFetcher2, PlasmicTracker as PlasmicTracker2 } from "@plasmicapp/loader-core";
+import React2 from "react";
+import ReactDOM from "react-dom";
+import * as jsxDevRuntime from "react/jsx-dev-runtime";
+import * as jsxRuntime from "react/jsx-runtime";
+
+// src/loader-shared.ts
+import {
+  Registry
+} from "@plasmicapp/loader-core";
+import {
+  internal_getCachedBundleInNodeServer
+} from "@plasmicapp/loader-fetcher";
+import { getActiveVariation, getExternalIds } from "@plasmicapp/loader-splits";
 
 // src/bundles.ts
 import {
@@ -114,7 +141,7 @@ function prepComponentData(bundle, compMetas, opts) {
   };
 }
 function mergeBundles(target, from) {
-  var _a;
+  var _a2;
   const existingCompIds = new Set(target.components.map((c) => c.id));
   const newCompMetas = from.components.filter(
     (m) => !existingCompIds.has(m.id)
@@ -158,13 +185,8 @@ function mergeBundles(target, from) {
       globalGroups: [...target.globalGroups, ...newGlobals]
     });
   }
-  const existingExternals = new Set(target.external);
-  const newExternals = target.external.filter((x) => !existingExternals.has(x));
-  if (newExternals.length > 0) {
-    target = __spreadProps(__spreadValues({}, target), { external: [...target.external, ...newExternals] });
-  }
   const existingSplitIds = new Set(target.activeSplits.map((s) => s.id));
-  const newSplits = (_a = from.activeSplits.filter((s) => !existingSplitIds.has(s.id))) != null ? _a : [];
+  const newSplits = (_a2 = from.activeSplits.filter((s) => !existingSplitIds.has(s.id))) != null ? _a2 : [];
   if (newSplits.length > 0) {
     target = __spreadProps(__spreadValues({}, target), {
       activeSplits: [...target.activeSplits, ...newSplits]
@@ -273,10 +295,169 @@ function getLookupSpecName(lookup) {
     return lookup.name;
   }
 }
+function uniq(elements) {
+  return Array.from(new Set(elements));
+}
+function uniqBy(elements, iterator) {
+  const vis = /* @__PURE__ */ new Set();
+  const filtered = [];
+  for (const elt of elements) {
+    const key = iterator(elt);
+    if (!vis.has(key)) {
+      vis.add(key);
+      filtered.push(elt);
+    }
+  }
+  return filtered;
+}
 
-// src/loader-react-server.ts
-var ReactServerPlasmicComponentLoader = class {
+// src/component-lookup.ts
+function getFirstCompMeta(metas, lookup) {
+  const filtered = getCompMetas(metas, lookup);
+  return filtered.length === 0 ? void 0 : filtered[0];
+}
+var ComponentLookup = class {
+  constructor(bundle, registry) {
+    this.bundle = bundle;
+    this.registry = registry;
+  }
+  getComponentMeta(spec) {
+    const compMeta = getFirstCompMeta(this.bundle.components, spec);
+    return compMeta;
+  }
+  getComponent(spec, opts = {}) {
+    const compMeta = getFirstCompMeta(this.bundle.components, spec);
+    if (!compMeta) {
+      throw new Error(`Component not found: ${spec}`);
+    }
+    const moduleName = compMeta.entry;
+    if (!this.registry.hasModule(moduleName, opts)) {
+      throw new Error(`Component not yet fetched: ${compMeta.name}`);
+    }
+    const entry = this.registry.load(moduleName, {
+      forceOriginal: opts.forceOriginal
+    });
+    return !opts.forceOriginal && typeof (entry == null ? void 0 : entry.getPlasmicComponent) === "function" ? entry.getPlasmicComponent() : entry.default;
+  }
+  hasComponent(spec) {
+    const compMeta = getFirstCompMeta(this.bundle.components, spec);
+    if (compMeta) {
+      return this.registry.hasModule(compMeta.entry);
+    }
+    return false;
+  }
+  getGlobalContexts() {
+    const customGlobalMetas = this.bundle.globalGroups.filter(
+      (m) => m.type === "global-user-defined"
+    );
+    return customGlobalMetas.map((meta) => ({
+      meta,
+      context: this.registry.load(meta.contextFile).default
+    }));
+  }
+  getGlobalContextsProvider(spec) {
+    const compMeta = getFirstCompMeta(this.bundle.components, spec);
+    const projectMeta = compMeta ? this.bundle.projects.find((x) => x.id === compMeta.projectId) : void 0;
+    if (!projectMeta || !projectMeta.globalContextsProviderFileName || !this.registry.hasModule(projectMeta.globalContextsProviderFileName)) {
+      return void 0;
+    }
+    const entry = this.registry.load(
+      projectMeta.globalContextsProviderFileName
+    );
+    return typeof (entry == null ? void 0 : entry.getPlasmicComponent) === "function" ? entry.getPlasmicComponent() : entry.default;
+  }
+  getRootProvider() {
+    const entry = this.registry.load("root-provider.js");
+    return entry.default;
+  }
+  getCss() {
+    return this.bundle.modules.browser.filter(
+      (mod) => mod.type === "asset" && mod.fileName.endsWith("css")
+    );
+  }
+  getRemoteFonts() {
+    return this.bundle.projects.flatMap((p) => p.remoteFonts);
+  }
+};
+
+// src/variation.ts
+function getPlasmicCookieValues() {
+  return Object.fromEntries(
+    document.cookie.split("; ").filter((cookie) => cookie.includes("plasmic:")).map((cookie) => cookie.split("=")).map(([key, value]) => [key.split(":")[1], value])
+  );
+}
+function updatePlasmicCookieValue(key, value) {
+  document.cookie = `plasmic:${key}=${value}`;
+}
+var getGlobalVariantsFromSplits = (splits, variation) => {
+  const globalVariants = [];
+  Object.keys(variation).map((variationKey) => {
+    const [_type, splitId] = variationKey.split(".");
+    const sliceId = variation[variationKey];
+    const split = splits.find(
+      (s) => s.id === splitId || s.externalId === splitId
+    );
+    if (split) {
+      const slice = split.slices.find((s) => s.id === sliceId || s.externalId === sliceId);
+      if (slice) {
+        slice.contents.map((x) => {
+          globalVariants.push({
+            name: x.group,
+            value: x.variant,
+            projectId: x.projectId
+          });
+        });
+      }
+    }
+  });
+  return globalVariants;
+};
+var mergeGlobalVariantsSpec = (target, from) => {
+  let result = [...target];
+  const existingGlobalVariants = new Set(
+    target.map((t) => {
+      var _a2;
+      return `${t.name}-${(_a2 = t.projectId) != null ? _a2 : ""}`;
+    })
+  );
+  const newGlobals = from.filter(
+    (t) => {
+      var _a2;
+      return !existingGlobalVariants.has(`${t.name}-${(_a2 = t.projectId) != null ? _a2 : ""}`);
+    }
+  );
+  if (newGlobals.length > 0) {
+    result = [...result, ...newGlobals];
+  }
+  return result;
+};
+
+// src/loader-shared.ts
+var SUBSTITUTED_COMPONENTS = {};
+var REGISTERED_CODE_COMPONENT_HELPERS = {};
+var SUBSTITUTED_GLOBAL_VARIANT_HOOKS = {};
+var REGISTERED_CUSTOM_FUNCTIONS = {};
+function customFunctionImportAlias(meta) {
+  const customFunctionPrefix = `__fn_`;
+  return meta.namespace ? `${customFunctionPrefix}${meta.namespace}__${meta.name}` : `${customFunctionPrefix}${meta.name}`;
+}
+function parseFetchComponentDataArgs(...args) {
+  let specs;
+  let opts;
+  if (Array.isArray(args[0])) {
+    specs = args[0];
+    opts = args[1];
+  } else {
+    specs = args;
+    opts = void 0;
+  }
+  return { specs, opts };
+}
+var BaseInternalPlasmicComponentLoader = class {
   constructor(args) {
+    this.registry = new Registry();
+    this.globalVariants = [];
+    this.subs = [];
     this.bundle = {
       modules: {
         browser: [],
@@ -284,7 +465,6 @@ var ReactServerPlasmicComponentLoader = class {
       },
       components: [],
       globalGroups: [],
-      external: [],
       projects: [],
       activeSplits: [],
       bundleKey: null,
@@ -295,6 +475,7 @@ var ReactServerPlasmicComponentLoader = class {
     this.tracker = args.tracker;
     this.onBundleMerged = args.onBundleMerged;
     this.onBundleFetched = args.onBundleFetched;
+    this.registerModules(args.builtinModules);
   }
   maybeGetCompMetas(...specs) {
     const found = /* @__PURE__ */ new Set();
@@ -389,19 +570,58 @@ var ReactServerPlasmicComponentLoader = class {
   }
   fetchAllData() {
     return __async(this, null, function* () {
-      var _a;
+      var _a2;
       const bundle = yield this.fetcher.fetchAllData();
       this.tracker.trackFetch();
       this.mergeBundle(bundle);
-      (_a = this.onBundleFetched) == null ? void 0 : _a.call(this);
+      (_a2 = this.onBundleFetched) == null ? void 0 : _a2.call(this);
       return bundle;
     });
   }
-  mergeBundle(bundle) {
-    var _a, _b;
-    this.bundle = bundle;
-    this.bundle.bundleKey = (_a = this.bundle.bundleKey) != null ? _a : null;
-    (_b = this.onBundleMerged) == null ? void 0 : _b.call(this);
+  mergeBundle(newBundle) {
+    var _a2, _b, _c, _d, _e;
+    newBundle.bundleKey = (_a2 = newBundle.bundleKey) != null ? _a2 : null;
+    if (newBundle.bundleKey && this.bundle.bundleKey && newBundle.bundleKey !== this.bundle.bundleKey) {
+      console.warn(
+        `Plasmic Error: Different code export hashes. This can happen if your app is using different loaders with different project IDs or project versions.
+Conflicting values:
+${newBundle.bundleKey}
+${this.bundle.bundleKey}`
+      );
+    }
+    const bundles = [this.bundle, newBundle];
+    this.bundle = {
+      activeSplits: uniqBy(
+        bundles.flatMap((bundle) => bundle.activeSplits),
+        (split) => split.id
+      ),
+      components: uniqBy(
+        bundles.flatMap((bundle) => bundle.components),
+        (c) => c.id
+      ),
+      globalGroups: uniqBy(
+        bundles.flatMap((bundle) => bundle.globalGroups),
+        (g) => g.id
+      ),
+      modules: {
+        browser: uniqBy(
+          bundles.flatMap((bundle) => bundle.modules.browser),
+          (m) => m.fileName
+        ),
+        server: uniqBy(
+          bundles.flatMap((bundle) => bundle.modules.server),
+          (m) => m.fileName
+        )
+      },
+      projects: uniqBy(
+        bundles.flatMap((bundle) => bundle.projects),
+        (p) => p.id
+      ),
+      // Avoid `undefined` as it cannot be serialized as JSON
+      bundleKey: (_c = (_b = newBundle.bundleKey) != null ? _b : this.bundle.bundleKey) != null ? _c : null,
+      deferChunksByDefault: (_d = newBundle.deferChunksByDefault) != null ? _d : false
+    };
+    (_e = this.onBundleMerged) == null ? void 0 : _e.call(this);
   }
   getBundle() {
     return this.bundle;
@@ -414,41 +634,872 @@ var ReactServerPlasmicComponentLoader = class {
       },
       components: [],
       globalGroups: [],
-      external: [],
       projects: [],
       activeSplits: [],
       bundleKey: null,
       deferChunksByDefault: false
     };
+    this.registry.clear();
+  }
+  registerModules(modules) {
+    if (Object.keys(modules).some(
+      (name) => this.registry.getRegisteredModule(name) !== modules[name]
+    )) {
+      if (!this.registry.isEmpty()) {
+        console.warn(
+          "Calling PlasmicComponentLoader.registerModules() after Plasmic component has rendered; starting over."
+        );
+        this.registry.clear();
+      }
+      for (const key of Object.keys(modules)) {
+        this.registry.register(key, modules[key]);
+      }
+    }
+  }
+  substituteComponent(component, name) {
+    this.internalSubstituteComponent(component, name, void 0);
+  }
+  internalSubstituteComponent(component, name, codeComponentHelpers) {
+    if (!this.isRegistryEmpty()) {
+      console.warn(
+        "Calling PlasmicComponentLoader.registerSubstitution() after Plasmic component has rendered; starting over."
+      );
+      this.clearRegistry();
+    }
+    this.subs.push({ lookup: name, component, codeComponentHelpers });
+  }
+  refreshRegistry() {
+    for (const sub of this.subs) {
+      const metas = getCompMetas(this.getBundle().components, sub.lookup);
+      metas.forEach((meta) => {
+        SUBSTITUTED_COMPONENTS[meta.id] = sub.component;
+        if (sub.codeComponentHelpers) {
+          REGISTERED_CODE_COMPONENT_HELPERS[meta.id] = sub.codeComponentHelpers;
+        }
+      });
+    }
+    this.registry.updateModules(this.getBundle());
+  }
+  isRegistryEmpty() {
+    return this.registry.isEmpty();
+  }
+  clearRegistry() {
+    this.registry.clear();
+  }
+  setGlobalVariants(globalVariants) {
+    this.globalVariants = globalVariants;
+  }
+  getGlobalVariants() {
+    return this.globalVariants;
+  }
+  registerPrefetchedBundle(bundle) {
+    if (!isBrowser) {
+      const cachedBundle = internal_getCachedBundleInNodeServer(this.opts);
+      if (cachedBundle) {
+        this.mergeBundle(cachedBundle);
+      }
+    }
+    this.mergeBundle(bundle);
+  }
+  getLookup() {
+    return new ComponentLookup(this.getBundle(), this.registry);
+  }
+  trackConversion(value = 0) {
+    this.tracker.trackConversion(value);
+  }
+  getActiveVariation(opts) {
+    return __async(this, null, function* () {
+      yield this.fetchComponents();
+      return getActiveVariation(__spreadProps(__spreadValues({}, opts), {
+        splits: this.getBundle().activeSplits
+      }));
+    });
+  }
+  getTeamIds() {
+    return uniq(
+      this.getBundle().projects.map(
+        (p) => p.teamId ? `${p.teamId}${p.indirect ? "@indirect" : ""}` : null
+      ).filter((x) => !!x)
+    );
+  }
+  getProjectIds() {
+    return uniq(
+      this.getBundle().projects.map(
+        (p) => `${p.id}${p.indirect ? "@indirect" : ""}`
+      )
+    );
+  }
+  trackRender(opts) {
+    this.tracker.trackRender(opts);
   }
 };
-function parseFetchComponentDataArgs(...args) {
-  let specs;
-  let opts;
-  if (Array.isArray(args[0])) {
-    specs = args[0];
-    opts = args[1];
+var PlasmicComponentLoader = class {
+  constructor(internal) {
+    this.warnedRegisterComponent = false;
+    this.__internal = internal;
+  }
+  /**
+   * Sets global variants to be used for all components.  Note that
+   * this is not reactive, and will not re-render all components
+   * already mounted; instead, it should be used to activate global
+   * variants that should always be activated for the lifetime of this
+   * app.  If you'd like to reactively change the global variants,
+   * you should specify them via <PlasmicRootProvider />
+   */
+  setGlobalVariants(globalVariants) {
+    this.__internal.setGlobalVariants(globalVariants);
+  }
+  registerModules(modules) {
+    this.__internal.registerModules(modules);
+  }
+  /**
+   * Register custom components that should be swapped in for
+   * components defined in your project.  You can use this to
+   * swap in / substitute a Plasmic component with a "real" component.
+   */
+  substituteComponent(component, name) {
+    this.__internal.substituteComponent(component, name);
+  }
+  registerComponent(component, metaOrName) {
+    if (metaOrName && typeof metaOrName === "object" && "props" in metaOrName) {
+      this.__internal.registerComponent(component, metaOrName);
+    } else {
+      if (process.env.NODE_ENV === "development" && !this.warnedRegisterComponent) {
+        console.warn(
+          `PlasmicLoader: Using deprecated method \`registerComponent\` for component substitution. Please consider using \`substituteComponent\` instead.`
+        );
+        this.warnedRegisterComponent = true;
+      }
+      this.substituteComponent(component, metaOrName);
+    }
+  }
+  registerFunction(fn, meta) {
+    this.__internal.registerFunction(fn, meta);
+  }
+  registerGlobalContext(context, meta) {
+    this.__internal.registerGlobalContext(context, meta);
+  }
+  registerTrait(trait, meta) {
+    this.__internal.registerTrait(trait, meta);
+  }
+  registerToken(token) {
+    this.__internal.registerToken(token);
+  }
+  fetchComponentData(...args) {
+    return this.__internal.fetchComponentData(...args);
+  }
+  maybeFetchComponentData(...args) {
+    return __async(this, null, function* () {
+      return this.__internal.maybeFetchComponentData(...args);
+    });
+  }
+  /**
+   * Returns all the page component metadata for these projects.
+   */
+  fetchPages(opts) {
+    return __async(this, null, function* () {
+      return this.__internal.fetchPages(opts);
+    });
+  }
+  /**
+   * Returns all components metadata for these projects.
+   */
+  fetchComponents() {
+    return __async(this, null, function* () {
+      return this.__internal.fetchComponents();
+    });
+  }
+  _getActiveVariation(opts) {
+    return __async(this, null, function* () {
+      return this.__internal.getActiveVariation(opts);
+    });
+  }
+  getActiveVariation(opts) {
+    return __async(this, null, function* () {
+      return this._getActiveVariation({
+        traits: opts.traits,
+        getKnownValue: (key) => {
+          if (opts.known) {
+            return opts.known[key];
+          } else {
+            const cookies = getPlasmicCookieValues();
+            return cookies[key];
+          }
+        },
+        updateKnownValue: (key, value) => {
+          if (!opts.known) {
+            updatePlasmicCookieValue(key, value);
+          }
+        }
+      });
+    });
+  }
+  getChunksUrl(bundle, modules) {
+    return this.__internal.getChunksUrl(bundle, modules);
+  }
+  getExternalVariation(variation, filters) {
+    return getExternalIds(this.getActiveSplits(), variation, filters);
+  }
+  getActiveSplits() {
+    return this.__internal.getActiveSplits();
+  }
+  trackConversion(value = 0) {
+    this.__internal.trackConversion(value);
+  }
+  clearCache() {
+    return this.__internal.clearCache();
+  }
+};
+
+// src/swr-util.ts
+function swrSerialize(key) {
+  if (typeof key === "function") {
+    try {
+      key = key();
+    } catch (err) {
+      key = "";
+    }
+  }
+  const args = [].concat(key);
+  key = typeof key == "string" ? key : (Array.isArray(key) ? key.length : key) ? stableHash(key) : "";
+  return [key, args];
+}
+var table = /* @__PURE__ */ new WeakMap();
+var counter = 0;
+function stableHash(arg) {
+  const type = typeof arg;
+  const constructor = arg && arg.constructor;
+  const isDate = constructor == Date;
+  let result;
+  let index;
+  if (Object(arg) === arg && !isDate && constructor != RegExp) {
+    result = table.get(arg);
+    if (result)
+      return result;
+    result = ++counter + "~";
+    table.set(arg, result);
+    if (constructor == Array) {
+      result = "@";
+      for (index = 0; index < arg.length; index++) {
+        result += stableHash(arg[index]) + ",";
+      }
+      table.set(arg, result);
+    }
+    if (constructor == Object) {
+      result = "#";
+      const keys = Object.keys(arg).sort();
+      while ((index = keys.pop()) !== void 0) {
+        if (arg[index] !== void 0) {
+          result += index + ":" + stableHash(arg[index]) + ",";
+        }
+      }
+      table.set(arg, result);
+    }
   } else {
-    specs = args;
-    opts = void 0;
+    result = isDate ? arg.toJSON() : type == "symbol" ? arg.toString() : type == "string" ? JSON.stringify(arg) : "" + arg;
   }
-  return { specs, opts };
+  return result;
+}
+
+// src/loader-server.tsx
+var noop = () => {
+};
+var identity = (x) => x;
+var unreachable = () => {
+  debugger;
+  throw new Error("Unreachable code");
+};
+var REACT_PROVIDER_TYPE = typeof Symbol === "function" && Symbol.for ? Symbol.for("react.provider") : 60109;
+var FakeRootProviderContext = {
+  _currentValue: void 0
+  // default value
+};
+var FakeDataContext = {
+  _currentValue: void 0
+  // default value
+};
+var FakePlasmicComponentContext = {
+  _currentValue: false
+  // default value
+};
+var FakePlasmicPrepassContext = {
+  _currentValue: void 0
+};
+var mkMetaName = (name) => `__plasmic_meta_${name}`;
+function FakeDataCtxReader({ children }) {
+  const $ctx = getPrepassContextEnv().readContextValue(FakeDataContext);
+  return children($ctx);
+}
+function FakeDataProvider({
+  name,
+  data,
+  hidden,
+  advanced,
+  label,
+  children
+}) {
+  var _a2;
+  const { readContextValue, setContextValue } = getPrepassContextEnv();
+  const existingEnv = (_a2 = readContextValue(FakeDataContext)) != null ? _a2 : {};
+  if (!name) {
+    return /* @__PURE__ */ React2.createElement(React2.Fragment, null, children);
+  } else {
+    setContextValue(FakeDataContext, __spreadProps(__spreadValues({}, existingEnv), {
+      [name]: data,
+      [mkMetaName(name)]: { hidden, advanced, label }
+    }));
+    return /* @__PURE__ */ React2.createElement(React2.Fragment, null, children);
+  }
+}
+var fakeApplySelector = (rawData, selector) => {
+  if (!selector) {
+    return void 0;
+  }
+  let curData = rawData;
+  for (const key of selector.split(".")) {
+    curData = curData == null ? void 0 : curData[key];
+  }
+  return curData;
+};
+function fakeUseSelector(selector) {
+  const rawData = getPrepassContextEnv().readContextValue(FakeDataContext);
+  return fakeApplySelector(rawData, selector);
+}
+function fakeUseSelectors(selectors = {}) {
+  const rawData = getPrepassContextEnv().readContextValue(FakeDataContext);
+  return Object.fromEntries(
+    Object.entries(selectors).filter(([key, selector]) => !!key && !!selector).map(([key, selector]) => [
+      key,
+      fakeApplySelector(rawData, selector)
+    ])
+  );
+}
+function fakeUsePlasmicDataConfig() {
+  const cache = getPrepassContextEnv().readContextValue(
+    FakePlasmicPrepassContext
+  );
+  return { cache };
+}
+var fakeUseMutablePlasmicQueryData = (unserializedKey, fetcher) => {
+  const [key, args] = swrSerialize(unserializedKey);
+  if (!key) {
+    return {
+      isValidating: false,
+      mutate: () => __async(void 0, null, function* () {
+      }),
+      data: void 0
+    };
+  }
+  const cache = fakeUsePlasmicDataConfig().cache;
+  if (cache.has(key)) {
+    return {
+      isValidating: false,
+      mutate: () => __async(void 0, null, function* () {
+      }),
+      data: cache.get(key)
+    };
+  }
+  const response = fetcher(...args);
+  if (response && typeof response.then == "function") {
+    throw response.then((data) => cache.set(key, data));
+  } else {
+    cache.set(key, response);
+    return {
+      isValidating: false,
+      mutate: () => __async(void 0, null, function* () {
+      }),
+      data: cache.get(key)
+    };
+  }
+};
+var _a;
+var FakeReactComponent = (_a = class {
+  constructor() {
+    this.context = void 0;
+    this.props = {};
+    this.setState = (v) => void (this.state = v);
+    this.forceUpdate = noop;
+    this.render = () => null;
+    this.state = {};
+    this.refs = {};
+  }
+  initRender(props) {
+    this.props = props;
+    const dispatcher = React2.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentDispatcher.current;
+    const [state, setState] = dispatcher.useState({});
+    this.state = state;
+    this.setState = setState;
+    if (this.constructor.contextType) {
+      this.context = dispatcher.useContext(
+        this.constructor.contextType
+      );
+    }
+  }
+}, _a.contextType = void 0, _a);
+var fakeCreateElement = (originalCreateElement) => (type, ...args) => {
+  if (Object.prototype.isPrototypeOf.call(FakeReactComponent, type)) {
+    return originalCreateElement((props) => {
+      const instance = new type();
+      instance.initRender(props);
+      return instance.render();
+    }, ...args);
+  }
+  return originalCreateElement(type, ...args);
+};
+var InternalPrepassPlasmicLoader = class extends BaseInternalPlasmicComponentLoader {
+  constructor(opts) {
+    super({
+      opts,
+      tracker: new PlasmicTracker2({
+        projectIds: opts.projects.map((p) => p.id),
+        platform: opts.platform,
+        preview: opts.preview,
+        nativeFetch: opts.nativeFetch
+      }),
+      onBundleMerged: () => {
+        this.refreshRegistry();
+      },
+      fetcher: new PlasmicModulesFetcher2(opts),
+      builtinModules: {
+        react: __spreadProps(__spreadValues(__spreadProps(__spreadValues(__spreadValues({}, React2), { isRSC: true }), {
+          createContext: (defaultValue) => {
+            const context = {
+              _currentValue: defaultValue,
+              displayName: "FakeContext",
+              Provider: ({ value, children }) => {
+                getPrepassContextEnv().setContextValue(context, value);
+                return /* @__PURE__ */ React2.createElement(React2.Fragment, null, children);
+              },
+              Consumer: ({ children }) => children(getPrepassContextEnv().readContextValue(context))
+            };
+            return context;
+          }
+        }), Object.fromEntries(
+          [
+            "useCallback",
+            "useContext",
+            "useEffect",
+            "useImperativeHandle",
+            "useDebugValue",
+            "useInsertionEffect",
+            "useLayoutEffect",
+            "useMemo",
+            "useSyncExternalStore",
+            "useReducer",
+            "useRef",
+            "useState"
+          ].map((hook) => [
+            hook,
+            (...args) => {
+              const dispatcher = React2.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED.ReactCurrentDispatcher.current;
+              return dispatcher[hook](...args);
+            }
+          ])
+        )), {
+          useDeferredValue: (v) => v,
+          useTransition: () => [
+            false,
+            (f) => {
+              f();
+            }
+          ],
+          createFactory: (type) => React2.createElement.bind(null, type),
+          Component: FakeReactComponent,
+          PureComponent: FakeReactComponent,
+          createElement: fakeCreateElement(React2.createElement)
+        }),
+        "react-dom": ReactDOM,
+        "react/jsx-runtime": __spreadValues(__spreadValues(__spreadValues(__spreadValues({}, jsxRuntime), jsxRuntime.jsx ? { jsx: fakeCreateElement(jsxRuntime.jsx) } : {}), jsxRuntime.jsxs ? { jsxs: fakeCreateElement(jsxRuntime.jsxs) } : {}), jsxRuntime.jsxDEV ? { jsxDEV: fakeCreateElement(jsxRuntime.jsxDEV) } : {}),
+        "react/jsx-dev-runtime": __spreadValues(__spreadValues(__spreadValues(__spreadValues({}, jsxDevRuntime), jsxDevRuntime.jsx ? { jsx: fakeCreateElement(jsxDevRuntime.jsx) } : {}), jsxDevRuntime.jsxs ? { jsxs: fakeCreateElement(jsxDevRuntime.jsxs) } : {}), jsxDevRuntime.jsxDEV ? { jsxDEV: fakeCreateElement(jsxDevRuntime.jsxDEV) } : {}),
+        "@plasmicapp/query": {
+          addLoadingStateListener: () => noop,
+          isPlasmicPrepass: () => true,
+          PlasmicPrepassContext: {},
+          PlasmicQueryDataProvider: ({ children }) => /* @__PURE__ */ React2.createElement(React2.Fragment, null, children),
+          useMutablePlasmicQueryData: fakeUseMutablePlasmicQueryData,
+          usePlasmicDataConfig: fakeUsePlasmicDataConfig,
+          usePlasmicQueryData: fakeUseMutablePlasmicQueryData,
+          useSWRConfig: unreachable,
+          wrapLoadingFetcher: identity
+        },
+        "@plasmicapp/data-sources-context": (() => {
+          const FakePlasmicDataSourceContext = {
+            _currentValue: void 0
+            // default value
+          };
+          return {
+            PlasmicDataSourceContextProvider: Object.assign(
+              ({ children, value }) => {
+                const { setContextValue } = getPrepassContextEnv();
+                setContextValue(FakePlasmicDataSourceContext, value);
+                return /* @__PURE__ */ React2.createElement(React2.Fragment, null, children);
+              },
+              {
+                $$typeof: REACT_PROVIDER_TYPE,
+                _context: FakePlasmicDataSourceContext
+              }
+            ),
+            useCurrentUser: () => {
+              var _a2;
+              const { readContextValue } = getPrepassContextEnv();
+              const ctx = readContextValue(FakePlasmicDataSourceContext);
+              return (_a2 = ctx == null ? void 0 : ctx.user) != null ? _a2 : {
+                isLoggedIn: false
+              };
+            },
+            usePlasmicDataSourceContext: () => {
+              const { readContextValue } = getPrepassContextEnv();
+              return readContextValue(FakePlasmicDataSourceContext);
+            }
+          };
+        })(),
+        "@plasmicapp/host": (() => {
+          return {
+            applySelector: fakeApplySelector,
+            DataContext: FakeDataContext,
+            DataCtxReader: FakeDataCtxReader,
+            DataProvider: FakeDataProvider,
+            GlobalActionsContext: {
+              _currentValue: void 0
+              // default value
+            },
+            GlobalActionsProvider: ({ children }) => /* @__PURE__ */ React2.createElement(React2.Fragment, null, children),
+            mkMetaName,
+            mkMetaValue: identity,
+            PageParamsProvider: ({ children }) => /* @__PURE__ */ React2.createElement(React2.Fragment, null, children),
+            PlasmicCanvasContext: { _currentValue: false },
+            PlasmicCanvasHost: () => null,
+            PlasmicLinkProvider: ({ children }) => /* @__PURE__ */ React2.createElement(React2.Fragment, null, children),
+            registerComponent: noop,
+            registerFunction: noop,
+            registerGlobalContext: noop,
+            registerToken: noop,
+            registerTrait: noop,
+            repeatedElement: unreachable,
+            stateHelpersKeys: ["initFunc", "onChangeArgsToValue", "onMutate"],
+            unstable_registerFetcher: noop,
+            useDataEnv: () => getPrepassContextEnv().readContextValue(FakeDataContext),
+            useGlobalActions: () => new Proxy(
+              {},
+              {
+                get: () => noop
+              }
+            ),
+            usePlasmicCanvasContext: () => false,
+            usePlasmicLink: () => (props) => /* @__PURE__ */ React2.createElement("a", __spreadValues({}, props)),
+            usePlasmicLinkMaybe: () => void 0,
+            useSelector: fakeUseSelector,
+            useSelectors: fakeUseSelectors
+          };
+        })(),
+        "@plasmicapp/loader-runtime-registry": {
+          components: SUBSTITUTED_COMPONENTS,
+          globalVariantHooks: SUBSTITUTED_GLOBAL_VARIANT_HOOKS,
+          codeComponentHelpers: REGISTERED_CODE_COMPONENT_HELPERS,
+          functions: REGISTERED_CUSTOM_FUNCTIONS
+        }
+      }
+    });
+    this.registerTrait = noop;
+    this.registerToken = noop;
+  }
+  registerComponent(component, meta) {
+    var _a2;
+    const stateHelpers = Object.fromEntries(
+      Object.entries((_a2 = meta.states) != null ? _a2 : {}).filter(
+        // eslint-disable-next-line @typescript-eslint/no-unused-vars
+        ([_, stateSpec]) => (
+          // `initFunc` is the only helper function used in RSC phase
+          "initFunc" in stateSpec
+        )
+      ).map(([stateName, stateSpec]) => [
+        stateName,
+        { initFunc: stateSpec.initFunc }
+      ])
+    );
+    const helpers = { states: stateHelpers };
+    this.internalSubstituteComponent(
+      meta.getServerInfo ? (props) => {
+        var _a3;
+        const { readContextValue } = getPrepassContextEnv();
+        const serverInfo = (_a3 = meta.getServerInfo) == null ? void 0 : _a3.call(meta, props, {
+          readContext: readContextValue,
+          readDataEnv: () => readContextValue(FakeDataContext),
+          readDataSelector: fakeUseSelector,
+          readDataSelectors: fakeUseSelectors,
+          fetchData: fakeUseMutablePlasmicQueryData
+        });
+        if (serverInfo && serverInfo.children) {
+          const contents = [];
+          const children = Array.isArray(serverInfo.children) ? serverInfo.children : [serverInfo.children];
+          children.forEach((childData) => {
+            contents.push(
+              /* @__PURE__ */ React2.createElement(ContextAndDataProviderWrapper, { contextAndData: childData }, childData.node)
+            );
+          });
+          return /* @__PURE__ */ React2.createElement(ContextAndDataProviderWrapper, { contextAndData: serverInfo }, contents);
+        } else {
+          return /* @__PURE__ */ React2.createElement(
+            ContextAndDataProviderWrapper,
+            {
+              contextAndData: serverInfo != null ? serverInfo : {}
+            },
+            Object.values(props).flat(Infinity).filter(
+              (v) => v && typeof v == "object" && v.$$typeof && React2.isValidElement(v)
+            )
+          );
+        }
+      } : component,
+      { name: meta.name, isCode: true },
+      Object.keys(stateHelpers).length > 0 ? helpers : void 0
+    );
+  }
+  registerFunction(fn, meta) {
+    REGISTERED_CUSTOM_FUNCTIONS[customFunctionImportAlias(meta)] = fn;
+  }
+  registerGlobalContext(context, meta) {
+    this.substituteComponent(context, { name: meta.name, isCode: true });
+  }
+  refreshRegistry() {
+    for (const globalGroup of this.getBundle().globalGroups) {
+      if (globalGroup.type !== "global-screen") {
+        SUBSTITUTED_GLOBAL_VARIANT_HOOKS[globalGroup.id] = () => {
+          var _a2;
+          const rootContext = getPrepassContextEnv().readContextValue(
+            FakeRootProviderContext
+          );
+          const loader = this;
+          const { name, projectId } = globalGroup;
+          const spec = [
+            ...loader.getGlobalVariants(),
+            ...(_a2 = rootContext.globalVariants) != null ? _a2 : []
+          ].find(
+            (s) => s.name === name && (!s.projectId || s.projectId === projectId)
+          );
+          return spec ? spec.value : void 0;
+        };
+      }
+    }
+    super.refreshRegistry();
+  }
+};
+function handlePrepassPlasmicRootComponent(props) {
+  var _a2;
+  const {
+    globalVariants,
+    globalContextsProps,
+    variation,
+    translator,
+    Head,
+    Link,
+    pageRoute,
+    pageParams,
+    pageQuery,
+    suspenseFallback,
+    disableLoadingBoundary,
+    user,
+    userAuthToken,
+    isUserLoading,
+    authRedirectUri
+  } = props;
+  const loader = props.loader.__internal;
+  const splits = loader.getActiveSplits();
+  const value = {
+    globalVariants: mergeGlobalVariantsSpec(
+      globalVariants != null ? globalVariants : [],
+      getGlobalVariantsFromSplits(splits, variation != null ? variation : {})
+    ),
+    globalContextsProps,
+    loader,
+    variation,
+    translator,
+    Head,
+    Link,
+    user,
+    userAuthToken,
+    isUserLoading,
+    authRedirectUri,
+    suspenseFallback,
+    disableLoadingBoundary
+  };
+  const { setContextValue, readContextValue } = getPrepassContextEnv();
+  setContextValue(FakeRootProviderContext, value);
+  const existingEnv = (_a2 = readContextValue(FakeDataContext)) != null ? _a2 : {};
+  const fixCatchallParams = (params) => {
+    const newParams = {};
+    for (const [key, val] of Object.entries(params)) {
+      if (!val) {
+        continue;
+      }
+      if (key.startsWith("...")) {
+        newParams[key.slice(3)] = typeof val === "string" ? val.replace(/^\/|\/$/g, "").split("/") : val;
+      } else {
+        newParams[key] = val;
+      }
+    }
+    return newParams;
+  };
+  const mkPathFromRouteAndParams = (route, params) => {
+    if (!params) {
+      return route;
+    }
+    let path = route;
+    for (const [key, val] of Object.entries(params)) {
+      if (typeof val === "string") {
+        path = path.replace(`[${key}]`, val);
+      } else if (Array.isArray(val)) {
+        if (path.includes(`[[...${key}]]`)) {
+          path = path.replace(`[[...${key}]]`, val.join("/"));
+        } else if (path.includes(`[...${key}]`)) {
+          path = path.replace(`[...${key}]`, val.join("/"));
+        }
+      }
+    }
+    return path;
+  };
+  const fixedParams = fixCatchallParams(pageParams != null ? pageParams : {});
+  setContextValue(FakeDataContext, __spreadProps(__spreadValues({}, existingEnv), {
+    ["pageRoute"]: pageRoute,
+    [mkMetaName("pageRoute")]: { advanced: true, label: "Page route" },
+    ["pagePath"]: pageRoute ? mkPathFromRouteAndParams(pageRoute, fixedParams) : void 0,
+    [mkMetaName("pagePath")]: { label: "Page path" },
+    ["params"]: __spreadValues(__spreadValues({}, existingEnv.params), fixedParams),
+    [mkMetaName("params")]: { label: "Page URL path params" },
+    ["query"]: __spreadValues(__spreadValues({}, existingEnv.query), pageQuery),
+    [mkMetaName("query")]: { label: "Page URL query params" }
+  }));
+}
+function handlePrepassPlasmicComponent(props) {
+  var _b;
+  const { component, projectId, componentProps, forceOriginal } = props;
+  const { setContextValue, readContextValue } = getPrepassContextEnv();
+  const rootContext = readContextValue(
+    FakeRootProviderContext
+  );
+  const isRootLoader = !readContextValue(FakePlasmicComponentContext);
+  if (!rootContext) {
+    throw new Error(
+      `You must use <PlasmicRootProvider/> at the root of your app`
+    );
+  }
+  const _a2 = rootContext, {
+    loader,
+    globalContextsProps,
+    userAuthToken,
+    isUserLoading,
+    authRedirectUri,
+    translator
+  } = _a2, rest = __objRest(_a2, [
+    "loader",
+    "globalContextsProps",
+    "userAuthToken",
+    "isUserLoading",
+    "authRedirectUri",
+    "translator"
+  ]);
+  const spec = { name: component, projectId, isCode: false };
+  const opts = { forceOriginal };
+  const lookup = loader.getLookup();
+  if (!lookup.hasComponent(spec)) {
+    return null;
+  }
+  const Component = lookup.getComponent(spec, opts);
+  let element = /* @__PURE__ */ React2.createElement(Component, __spreadValues({}, componentProps));
+  if (isRootLoader) {
+    const ReactWebRootProvider = lookup.getRootProvider();
+    const GlobalContextsProvider = lookup.getGlobalContextsProvider({
+      name: component,
+      projectId
+    });
+    setContextValue(FakePlasmicComponentContext, true);
+    element = /* @__PURE__ */ React2.createElement(
+      ReactWebRootProvider,
+      __spreadProps(__spreadValues({}, rest), {
+        userAuthToken,
+        isUserLoading,
+        authRedirectUri,
+        i18n: {
+          translator,
+          tagPrefix: (_b = loader.opts.i18n) == null ? void 0 : _b.tagPrefix
+        }
+      }),
+      element
+    );
+    if (GlobalContextsProvider) {
+      element = /* @__PURE__ */ React2.createElement(GlobalContextsProvider, __spreadValues({}, globalContextsProps), element);
+    }
+  }
+  return element;
+}
+function handlePlasmicPrepassContext({
+  cache
+}) {
+  getPrepassContextEnv().setContextValue(FakePlasmicPrepassContext, cache);
+}
+function getPrepassContextEnv() {
+  return globalThis.__ssrPrepassEnv;
+}
+function ContextAndDataProviderWrapper({
+  children,
+  contextAndData
+}) {
+  var _a2;
+  const { setContextValue, readContextValue } = getPrepassContextEnv();
+  const contexts = contextAndData.providedContexts ? Array.isArray(contextAndData.providedContexts) ? contextAndData.providedContexts : [contextAndData.providedContexts] : [];
+  const providedData = contextAndData.providedData ? Array.isArray(contextAndData.providedData) ? contextAndData.providedData : [contextAndData.providedData] : [];
+  contexts.forEach((context) => {
+    setContextValue(context.contextKey, context.value);
+  });
+  let $ctx = (_a2 = readContextValue(FakeDataContext)) != null ? _a2 : {};
+  providedData.forEach(({ name, data }) => {
+    $ctx = __spreadProps(__spreadValues({}, $ctx), {
+      [name]: data
+    });
+  });
+  setContextValue(FakeDataContext, $ctx);
+  return /* @__PURE__ */ React2.createElement(React2.Fragment, null, children);
+}
+
+// src/prepass-server.ts
+import { extractPlasmicQueryData as internalExtractQueryData } from "@plasmicapp/prepass";
+function extractPlasmicQueryData(element, loader) {
+  return __async(this, null, function* () {
+    return yield internalExtractQueryData(
+      element,
+      (elt) => handleClientComponentRef(elt, loader, element)
+    );
+  });
+}
+function handleClientComponentRef(elt, loader, rootElement) {
+  var _a2, _b;
+  try {
+    const refId = elt.type.$$id;
+    if (refId.includes("PlasmicRootProvider") || elt === rootElement) {
+      const props = elt.props;
+      if (props.prefetchedData) {
+        handlePrepassPlasmicRootComponent(__spreadProps(__spreadValues({}, props), { loader }));
+      }
+      return;
+    } else if (refId.includes("PlasmicComponent") && ((_a2 = elt.props) == null ? void 0 : _a2.component) != null) {
+      return handlePrepassPlasmicComponent(elt.props);
+    } else if (refId.includes("PlasmicPrepassContext") && ((_b = elt.props) == null ? void 0 : _b.cache) != null) {
+      return handlePlasmicPrepassContext(elt.props);
+    }
+  } catch (err) {
+    console.warn("Error processing client reference: ", err);
+  }
+  return;
 }
 
 // src/react-server.ts
 function initPlasmicLoader(opts) {
-  return new ReactServerPlasmicComponentLoader({
-    opts,
-    fetcher: new PlasmicModulesFetcher(opts),
-    tracker: new PlasmicTracker({
-      projectIds: opts.projects.map((p) => p.id),
-      platform: opts.platform,
-      preview: opts.preview
-    })
-  });
+  const internal = new InternalPrepassPlasmicLoader(opts);
+  return new PlasmicComponentLoader(internal);
 }
 export {
-  ReactServerPlasmicComponentLoader,
+  InternalPrepassPlasmicLoader as InternalPlasmicComponentLoader,
+  PlasmicComponentLoader,
+  extractPlasmicQueryData as __EXPERMIENTAL__extractPlasmicQueryData,
   convertBundlesToComponentRenderData,
   initPlasmicLoader,
   matchesPagePath