fontdue-js 3.0.0-alpha6 → 3.0.0-alpha7

package/dist/__generated__/orderTrackingUpdateOrderTrackingMutation.graphql.d.ts

@@ -0,0 +1,27 @@
+/**
+ * @generated SignedSource<<017a8a724b3a0fd0918153ce04d07f68>>
+ * @lightSyntaxTransform
+ * @nogrep
+ */
+import { ConcreteRequest } from 'relay-runtime';
+export type UpdateOrderTrackingInput = {
+    analyticsConsent?: boolean | null;
+    anonymousId?: string | null;
+    fbc?: string | null;
+    fbp?: string | null;
+    url?: string | null;
+};
+export type orderTrackingUpdateOrderTrackingMutation$variables = {
+    input: UpdateOrderTrackingInput;
+};
+export type orderTrackingUpdateOrderTrackingMutation$data = {
+    readonly updateOrderTracking: {
+        readonly success: boolean | null;
+    } | null;
+};
+export type orderTrackingUpdateOrderTrackingMutation = {
+    response: orderTrackingUpdateOrderTrackingMutation$data;
+    variables: orderTrackingUpdateOrderTrackingMutation$variables;
+};
+declare const node: ConcreteRequest;
+export default node;

package/dist/__generated__/orderTrackingUpdateOrderTrackingMutation.graphql.js

@@ -0,0 +1,72 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+/**
+ * @generated SignedSource<<017a8a724b3a0fd0918153ce04d07f68>>
+ * @lightSyntaxTransform
+ * @nogrep
+ */
+
+/* tslint:disable */
+/* eslint-disable */
+// @ts-nocheck
+
+const node = function () {
+  var v0 = [{
+      "defaultValue": null,
+      "kind": "LocalArgument",
+      "name": "input"
+    }],
+    v1 = [{
+      "alias": null,
+      "args": [{
+        "kind": "Variable",
+        "name": "input",
+        "variableName": "input"
+      }],
+      "concreteType": "UpdateOrderTrackingPayload",
+      "kind": "LinkedField",
+      "name": "updateOrderTracking",
+      "plural": false,
+      "selections": [{
+        "alias": null,
+        "args": null,
+        "kind": "ScalarField",
+        "name": "success",
+        "storageKey": null
+      }],
+      "storageKey": null
+    }];
+  return {
+    "fragment": {
+      "argumentDefinitions": v0 /*: any*/,
+      "kind": "Fragment",
+      "metadata": null,
+      "name": "orderTrackingUpdateOrderTrackingMutation",
+      "selections": v1 /*: any*/,
+      "type": "RootMutationType",
+      "abstractKey": null
+    },
+    "kind": "Request",
+    "operation": {
+      "argumentDefinitions": v0 /*: any*/,
+      "kind": "Operation",
+      "name": "orderTrackingUpdateOrderTrackingMutation",
+      "selections": v1 /*: any*/
+    },
+    "params": {
+      "cacheID": "c6d6059215c6ed30315c881dff80e9a7",
+      "id": null,
+      "metadata": {},
+      "name": "orderTrackingUpdateOrderTrackingMutation",
+      "operationKind": "mutation",
+      "text": "mutation orderTrackingUpdateOrderTrackingMutation(\n  $input: UpdateOrderTrackingInput!\n) {\n  updateOrderTracking(input: $input) {\n    success\n  }\n}\n"
+    }
+  };
+}();
+node.hash = "d59a127a7f140424f507ae549731bac7";
+var _default = node;
+exports.default = _default;

package/dist/components/BuyButton/index.js

@@ -85,7 +85,10 @@ export function BuyButtonPreloadedIDQueryRenderer(_ref3) {
     preloadedQuery,
     ...rest
   } = _ref3;
-  const queryRef = useSerializablePreloadedQuery(preloadedQuery);
+  // The query node lets the hook commit the payload into the store, so
+  // usePreloadedQuery resolves synchronously during SSR instead of
+  // refetching (the response cache only exists in the browser).
+  const queryRef = useSerializablePreloadedQuery(preloadedQuery, 'store-or-network', idQuery);
   const data = usePreloadedQuery(idQuery, queryRef);
   return /*#__PURE__*/React.createElement(BuyButtonComponent, _extends({}, rest, data));
 }
@@ -108,7 +111,10 @@ export function BuyButtonPreloadedSlugQueryRenderer(_ref5) {
     preloadedQuery,
     ...rest
   } = _ref5;
-  const queryRef = useSerializablePreloadedQuery(preloadedQuery);
+  // The query node lets the hook commit the payload into the store, so
+  // usePreloadedQuery resolves synchronously during SSR instead of
+  // refetching (the response cache only exists in the browser).
+  const queryRef = useSerializablePreloadedQuery(preloadedQuery, 'store-or-network', slugQuery);
   const data = usePreloadedQuery(slugQuery, queryRef);
   return /*#__PURE__*/React.createElement(BuyButtonComponent, _extends({}, rest, {
     collection: ((_data$viewer2 = data.viewer) === null || _data$viewer2 === void 0 ? void 0 : (_data$viewer2$slug = _data$viewer2.slug) === null || _data$viewer2$slug === void 0 ? void 0 : _data$viewer2$slug.collection) ?? null

package/dist/components/Cart/orderTracking.d.ts

@@ -0,0 +1,10 @@
+import { Environment } from 'relay-runtime';
+/**
+ * Stores the buyer's analytics context (cookie consent, Meta browser IDs,
+ * checkout page URL) on the current order. The server emits the purchase
+ * event from a Stripe webhook — outside the browser — so this is how that
+ * event respects the consent banner and carries attribution.
+ *
+ * Fire-and-forget: tracking must never break checkout.
+ */
+export declare function sendOrderTracking(environment: Environment): void;

package/dist/components/Cart/orderTracking.js

@@ -0,0 +1,43 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.sendOrderTracking = sendOrderTracking;
+var _orderTrackingUpdateOrderTrackingMutation2 = _interopRequireDefault(require("../../__generated__/orderTrackingUpdateOrderTrackingMutation.graphql"));
+var _reactRelay = require("react-relay");
+var _consent = require("../ConsentBanner/consent");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+function readCookie(name) {
+  const match = document.cookie.match(new RegExp('(?:^|;\\s*)' + name + '=([^;]*)'));
+  return match ? decodeURIComponent(match[1]) : undefined;
+}
+
+/**
+ * Stores the buyer's analytics context (cookie consent, Meta browser IDs,
+ * checkout page URL) on the current order. The server emits the purchase
+ * event from a Stripe webhook — outside the browser — so this is how that
+ * event respects the consent banner and carries attribution.
+ *
+ * Fire-and-forget: tracking must never break checkout.
+ */
+function sendOrderTracking(environment) {
+  try {
+    (0, _reactRelay.commitMutation)(environment, {
+      mutation: (_orderTrackingUpdateOrderTrackingMutation2.default.hash && _orderTrackingUpdateOrderTrackingMutation2.default.hash !== "d59a127a7f140424f507ae549731bac7" && console.error("The definition of 'orderTrackingUpdateOrderTrackingMutation' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _orderTrackingUpdateOrderTrackingMutation2.default),
+      variables: {
+        input: {
+          analyticsConsent: (0, _consent.hasConsent)('analytics'),
+          anonymousId: (0, _consent.getClientAnonymousId)(),
+          fbp: readCookie('_fbp'),
+          fbc: readCookie('_fbc'),
+          url: window.location.href
+        }
+      },
+      onCompleted: () => undefined,
+      onError: () => undefined
+    });
+  } catch {
+    // Ignore — see above.
+  }
+}

package/dist/components/CartButton/index.js

@@ -3,7 +3,7 @@
 function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
 import _CartButtonQuery from "../../__generated__/CartButtonQuery.graphql.js";
 import _CartButton_order from "../../__generated__/CartButton_order.graphql.js";
-import React, { useEffect, useCallback, useContext, useState } from 'react';
+import React, { Suspense, useEffect, useCallback, useContext, useState } from 'react';
 import { useDispatch } from 'react-redux';
 import { graphql, useFragment, useLazyLoadQuery } from 'react-relay';
 import ComponentsContext from '../ComponentsContext.js';
@@ -101,14 +101,26 @@ function CartButtonLazyQueryRenderer(props) {
 }
 // Cart contents are per-customer-session, so a server-side preload from a
 // CDN-cached SSG/prerender environment (no session cookies) just caches an
-// empty cart and delays the real one. CartButton always lazy-fetches on
-// hydration — same pattern as StoreModal.
+// empty cart and delays the real one. CartButton lazy-fetches on hydration —
+// and only after mount: useLazyLoadQuery would otherwise also run during the
+// SSR pass, where the fetch is sessionless (and in multi-tenant setups may
+// have no resolvable GraphQL URL at all). Until mount it renders the empty
+// cart state, which is also the Suspense fallback while the real fetch runs,
+// so server HTML and first client render agree.
 export default function CartButton(_ref2) {
   let {
     config,
     ...props
   } = _ref2;
+  const [mounted, setMounted] = useState(false);
+  useEffect(() => setMounted(true), []);
   return /*#__PURE__*/React.createElement(EnsureFontdueContext, {
     config: config
-  }, /*#__PURE__*/React.createElement(CartButtonLazyQueryRenderer, props));
+  }, mounted ? /*#__PURE__*/React.createElement(Suspense, {
+    fallback: /*#__PURE__*/React.createElement(CartButtonComponent, _extends({}, props, {
+      order: null
+    }))
+  }, /*#__PURE__*/React.createElement(CartButtonLazyQueryRenderer, props)) : /*#__PURE__*/React.createElement(CartButtonComponent, _extends({}, props, {
+    order: null
+  })));
 }

package/dist/components/CharacterViewer/index.js

@@ -446,7 +446,10 @@ export function CharacterViewerPreloadedIDQueryRenderer(_ref8) {
     preloadedQuery,
     ...rest
   } = _ref8;
-  const queryRef = useSerializablePreloadedQuery(preloadedQuery);
+  // The query node lets the hook commit the payload into the store, so
+  // usePreloadedQuery resolves synchronously during SSR instead of
+  // refetching (the response cache only exists in the browser).
+  const queryRef = useSerializablePreloadedQuery(preloadedQuery, 'store-or-network', idQuery);
   const data = usePreloadedQuery(idQuery, queryRef);
   if (!data.node) return null;
   return /*#__PURE__*/React.createElement(CharacterViewerComponent, _extends({}, rest, {
@@ -473,7 +476,10 @@ export function CharacterViewerPreloadedSlugQueryRenderer(_ref10) {
     preloadedQuery,
     ...rest
   } = _ref10;
-  const queryRef = useSerializablePreloadedQuery(preloadedQuery);
+  // The query node lets the hook commit the payload into the store, so
+  // usePreloadedQuery resolves synchronously during SSR instead of
+  // refetching (the response cache only exists in the browser).
+  const queryRef = useSerializablePreloadedQuery(preloadedQuery, 'store-or-network', slugQuery);
   const data = usePreloadedQuery(slugQuery, queryRef);
   const collection = data === null || data === void 0 ? void 0 : (_data$viewer2 = data.viewer) === null || _data$viewer2 === void 0 ? void 0 : (_data$viewer2$slug = _data$viewer2.slug) === null || _data$viewer2$slug === void 0 ? void 0 : _data$viewer2$slug.fontCollection;
   if (!collection) return null;

package/dist/components/CustomerLoginForm/index.js

@@ -9,7 +9,6 @@ const loginMutation = (_CustomerLoginFormLoginMutation.hash && _CustomerLoginFor
 const query = (_CustomerLoginFormQuery.hash && _CustomerLoginFormQuery.hash !== "f32c7b0b485a2b2a02ddf2cbc5b87a3c" && console.error("The definition of 'CustomerLoginFormQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _CustomerLoginFormQuery);
 const DEFAULT_SUBMITTED_LABEL = '<p>Submitted!</p><p>Please check your email inbox for a link to log in.</p><p>If you don\u2019t receive an email, please contact us to retrieve your order information.</p>';
 const CustomerLoginForm = _ref => {
-  var _data$viewer, _data$viewer$settings;
   let {
     submitLabel = 'Submit'
   } = _ref;
@@ -18,8 +17,6 @@ const CustomerLoginForm = _ref => {
   const [submitting, setSubmitting] = useState(false);
   const [submitted, setSubmitted] = useState(false);
   const environment = useRelayEnvironment();
-  const data = useLazyLoadQuery(query, {});
-  const submittedLabel = ((_data$viewer = data.viewer) === null || _data$viewer === void 0 ? void 0 : (_data$viewer$settings = _data$viewer.settings) === null || _data$viewer$settings === void 0 ? void 0 : _data$viewer$settings.customerLoginSubmittedLabel) || DEFAULT_SUBMITTED_LABEL;
   const handleSubmit = e => {
     e.preventDefault();
     setSubmitting(true);
@@ -54,12 +51,7 @@ const CustomerLoginForm = _ref => {
     className: "login-form"
   }, error && /*#__PURE__*/React.createElement("div", {
     className: "login-form__errors"
-  }, error), submitted ? /*#__PURE__*/React.createElement("div", {
-    className: "login-form__submitted",
-    dangerouslySetInnerHTML: {
-      __html: submittedLabel
-    }
-  }) : /*#__PURE__*/React.createElement("form", {
+  }, error), submitted ? /*#__PURE__*/React.createElement(SubmittedMessage, null) : /*#__PURE__*/React.createElement("form", {
     className: "login-form__form",
     onSubmit: handleSubmit
   }, /*#__PURE__*/React.createElement("div", {
@@ -79,4 +71,20 @@ const CustomerLoginForm = _ref => {
     className: "submit-button__arrow"
   }, " \u2192")))));
 };
+
+// The settings label is only shown after a submit, which can only happen in
+// the browser — fetching it here (not in the form component) keeps the lazy
+// query out of the SSR pass, where it has no session and, in multi-tenant
+// setups, possibly no resolvable GraphQL URL.
+function SubmittedMessage() {
+  var _data$viewer, _data$viewer$settings;
+  const data = useLazyLoadQuery(query, {});
+  const submittedLabel = ((_data$viewer = data.viewer) === null || _data$viewer === void 0 ? void 0 : (_data$viewer$settings = _data$viewer.settings) === null || _data$viewer$settings === void 0 ? void 0 : _data$viewer$settings.customerLoginSubmittedLabel) || DEFAULT_SUBMITTED_LABEL;
+  return /*#__PURE__*/React.createElement("div", {
+    className: "login-form__submitted",
+    dangerouslySetInnerHTML: {
+      __html: submittedLabel
+    }
+  });
+}
 export default CustomerLoginForm;

package/dist/components/FontdueProvider/index.d.ts

@@ -2,11 +2,20 @@ import React from 'react';
 export { default as loadFontdueProviderQuery } from '../../loadFontdueProviderQuery.js';
 import type { FontdueContextProvider_props } from '../FontdueContextProvider/index.js';
 import { SerializablePreloadedQuery } from '../../relay/loadSerializableQuery.js';
+import type { FontdueServerConfig } from '../../relay/serverConfig.js';
 import { FontdueProviderQuery } from '../../__generated__/FontdueProviderQuery.graphql.js';
 export declare const fontdueProviderQuery: import("react-relay").GraphQLTaggedNode;
 export type FontdueProviderPreloadedQuery = SerializablePreloadedQuery<FontdueProviderQuery>;
 export interface FontdueProvider_props extends FontdueContextProvider_props {
     preloadedQuery?: FontdueProviderPreloadedQuery;
+    /**
+     * Per-render config for server-side fetches (url, headers, cacheTags).
+     * Only honoured by the React Server Components entrypoint, which writes it
+     * to the render-scoped config store and strips it before this client
+     * component — it may carry internal headers that must never reach the
+     * browser. Ignored when the client provider is used directly.
+     */
+    serverConfig?: FontdueServerConfig;
 }
-declare const FontdueProvider: ({ children, preloadedQuery, ...rest }: FontdueProvider_props) => React.JSX.Element;
+declare const FontdueProvider: ({ children, preloadedQuery, serverConfig: _serverConfig, ...rest }: FontdueProvider_props) => React.JSX.Element;
 export default FontdueProvider;

package/dist/components/FontdueProvider/index.js

@@ -22,6 +22,7 @@ const FontdueProvider = _ref => {
   let {
     children,
     preloadedQuery,
+    serverConfig: _serverConfig,
     ...rest
   } = _ref;
   return /*#__PURE__*/React.createElement(FontdueContextProvider, rest, /*#__PURE__*/React.createElement(ErrorBoundary, {

package/dist/components/FontdueProvider/index.server.d.ts

@@ -2,5 +2,6 @@ import React from 'react';
 import type { FontdueProvider_props } from './index.js';
 export type { FontdueProvider_props } from './index.js';
 export type { FontdueProviderPreloadedQuery } from '../../loadFontdueProviderQuery.js';
+export type { FontdueServerConfig } from '../../relay/serverConfig.js';
 export declare function loadFontdueProviderQuery(): never;
-export default function FontdueProviderServer({ preloadedQuery, ...rest }: FontdueProvider_props): Promise<React.JSX.Element>;
+export default function FontdueProviderServer({ preloadedQuery, serverConfig, ...rest }: FontdueProvider_props): Promise<React.JSX.Element>;

package/dist/components/FontdueProvider/index.server.js

@@ -2,6 +2,7 @@ function _extends() { return _extends = Object.assign ? Object.assign.bind() : f
 import React from 'react';
 import FontdueProvider from './index.js';
 import loadFontdueProviderQueryImpl from '../../loadFontdueProviderQuery.js';
+import { setFontdueServerConfig } from '../../relay/serverConfig.js';
 // Stub for the RSC export condition. The default `<FontdueProvider>` server
 // entrypoint (this file) awaits the query for consumers, so RSC users should
 // never call it manually. Re-exporting a throwing stub makes the mistake
@@ -14,11 +15,26 @@ export function loadFontdueProviderQuery() {
 
 // RSC entry. When no preloadedQuery is passed, fetch one server-side so the
 // Next.js App Router path stays "drop the provider in your layout, done."
+//
+// `serverConfig` (and, as a shorthand, the `url` prop) is written to the
+// per-render server config store before anything fetches, so every Fontdue
+// server component below the provider — and the provider's own query —
+// fetches against it. It is intentionally NOT forwarded to the client
+// component: it can carry internal headers (e.g. proxy auth) that must not
+// be serialized into the RSC payload. Note a soft navigation re-renders only
+// the page segment, not a layout-hosted provider — pages that contain
+// Fontdue components should call setFontdueServerConfig themselves.
 export default async function FontdueProviderServer(_ref) {
   let {
     preloadedQuery,
+    serverConfig,
     ...rest
   } = _ref;
+  if (serverConfig || rest.url) {
+    setFontdueServerConfig(serverConfig ?? {
+      url: rest.url
+    });
+  }
   const resolved = preloadedQuery ?? (await loadFontdueProviderQueryImpl());
   return /*#__PURE__*/React.createElement(FontdueProvider, _extends({}, rest, {
     preloadedQuery: resolved

package/dist/components/NewsletterSignup/index.js

@@ -182,7 +182,10 @@ export function NewsletterSignupPreloadedQueryRenderer(_ref3) {
     preloadedQuery,
     ...props
   } = _ref3;
-  const queryRef = useSerializablePreloadedQuery(preloadedQuery);
+  // The query node lets the hook commit the payload into the store, so
+  // usePreloadedQuery resolves synchronously during SSR instead of
+  // refetching (the response cache only exists in the browser).
+  const queryRef = useSerializablePreloadedQuery(preloadedQuery, 'store-or-network', query);
   const data = usePreloadedQuery(query, queryRef);
   return /*#__PURE__*/React.createElement(NewsletterSignupComponent, _extends({
     data: data

package/dist/components/TestFontsForm/index.js

@@ -202,7 +202,10 @@ export function TestFontsFormPreloadedQueryRenderer(_ref4) {
     preloadedQuery,
     ...rest
   } = _ref4;
-  const queryRef = useSerializablePreloadedQuery(preloadedQuery);
+  // The query node lets the hook commit the payload into the store, so
+  // usePreloadedQuery resolves synchronously during SSR instead of
+  // refetching (the response cache only exists in the browser).
+  const queryRef = useSerializablePreloadedQuery(preloadedQuery, 'store-or-network', query);
   const data = usePreloadedQuery(query, queryRef);
   return /*#__PURE__*/React.createElement(TestFontsFormComponent, _extends({
     data: data

package/dist/components/TypeTesters/index.js

@@ -191,7 +191,10 @@ export function TypeTestersPreloadedIDQueryRenderer(_ref3) {
     preloadedQuery,
     ...rest
   } = _ref3;
-  const queryRef = useSerializablePreloadedQuery(preloadedQuery);
+  // The query node lets the hook commit the payload into the store, so
+  // usePreloadedQuery resolves synchronously during SSR instead of
+  // refetching (the response cache only exists in the browser).
+  const queryRef = useSerializablePreloadedQuery(preloadedQuery, 'store-or-network', idQuery);
   const data = usePreloadedQuery(idQuery, queryRef);
   return /*#__PURE__*/React.createElement(TypeTestersComponent, _extends({}, data, rest));
 }
@@ -219,7 +222,10 @@ export function TypeTestersPreloadedSlugQueryRenderer(_ref5) {
     preloadedQuery,
     ...rest
   } = _ref5;
-  const queryRef = useSerializablePreloadedQuery(preloadedQuery);
+  // The query node lets the hook commit the payload into the store, so
+  // usePreloadedQuery resolves synchronously during SSR instead of
+  // refetching (the response cache only exists in the browser).
+  const queryRef = useSerializablePreloadedQuery(preloadedQuery, 'store-or-network', slugQuery);
   const data = usePreloadedQuery(slugQuery, queryRef);
   return /*#__PURE__*/React.createElement(TypeTestersComponent, _extends({
     collection: ((_data$viewer$slug = data.viewer.slug) === null || _data$viewer$slug === void 0 ? void 0 : _data$viewer$slug.collection) ?? null

package/dist/relay/environment.js

@@ -1,9 +1,10 @@
 import { Environment, Network, RecordSource, Store, QueryResponseCache } from 'relay-runtime';
 import { handlePossibleCorsError } from '../corsError.js';
+import { getFontdueServerConfig } from './serverConfig.js';
 
 // `__FONTDUE_JS_VERSION__` is replaced by an inline babel plugin
 // (defineVersionPlugin in .babelrc.cjs) with the literal package.json#version.
-const version = "3.0.0-alpha6";
+const version = "3.0.0-alpha7";
 const IS_SERVER = typeof window === typeof undefined;
 
 // Read env from either process.env (Node/Next.js) or import.meta.env (Vite/Astro).
@@ -37,9 +38,13 @@ const CACHE_TTL = 10 * 1000; // 10 seconds, to resolve preloaded results
 
 export function createNetworkFetch(options) {
   return async function networkFetch(request, variables) {
-    const base = (options === null || options === void 0 ? void 0 : options.url) ?? FONTDUE_URL;
+    // Per-render server config (set via setFontdueServerConfig or the
+    // FontdueProvider server entrypoint). Resolved per call, not per
+    // createNetworkFetch, because module-level fetchers outlive renders.
+    const serverConfig = IS_SERVER ? getFontdueServerConfig() : undefined;
+    const base = (options === null || options === void 0 ? void 0 : options.url) ?? (serverConfig === null || serverConfig === void 0 ? void 0 : serverConfig.url) ?? FONTDUE_URL;
     if (IS_SERVER && (base == null || base === '')) {
-      throw new Error('fontdue-js: no Fontdue URL configured for server-side fetch. ' + 'Set FONTDUE_URL / PUBLIC_FONTDUE_URL / VITE_FONTDUE_URL in your environment, ' + 'or pass `url` explicitly to loadSerializableQuery (or its component-level wrappers).');
+      throw new Error('fontdue-js: no Fontdue URL configured for server-side fetch. ' + 'Set FONTDUE_URL / PUBLIC_FONTDUE_URL / VITE_FONTDUE_URL in your environment, ' + 'pass `url` to loadSerializableQuery, or call setFontdueServerConfig ' + '(or render <FontdueProvider url=…>) earlier in the server render.');
     }
     const url = `${base ?? ''}/graphql`;
     for (let attempt = 0; attempt <= 2; attempt++) {
@@ -48,6 +53,7 @@ export function createNetworkFetch(options) {
           method: 'POST',
           credentials: 'include',
           headers: {
+            ...(serverConfig === null || serverConfig === void 0 ? void 0 : serverConfig.headers),
             Accept: 'application/json',
             'Content-Type': 'application/json',
             'fontdue-stripe-integration': (options === null || options === void 0 ? void 0 : options.stripeIntegration) ?? STRIPE_INTEGRATION ?? 'dynamic',
@@ -59,7 +65,7 @@ export function createNetworkFetch(options) {
           }),
           // @ts-ignore
           next: {
-            tags: ['graphql', `operation:${request.name}`]
+            tags: ['graphql', ...((serverConfig === null || serverConfig === void 0 ? void 0 : serverConfig.cacheTags) ?? []), `operation:${request.name}`]
           }
         });
         const json = await resp.json();

package/dist/relay/loadSerializableQuery.d.ts

@@ -43,5 +43,7 @@ export interface SerializablePreloadedQuery<TQuery extends OperationType> {
 type RequireAllWithNull<T> = {
     [K in keyof T]-?: T[K] | null;
 };
-export default function loadSerializableQuery<TQuery extends OperationType>(query: GraphQLTaggedNode, variables: RequireAllWithNull<VariablesOf<TQuery>>): Promise<SerializablePreloadedQuery<TQuery>>;
+export default function loadSerializableQuery<TQuery extends OperationType>(query: GraphQLTaggedNode, variables: RequireAllWithNull<VariablesOf<TQuery>>, options?: {
+    url?: string;
+}): Promise<SerializablePreloadedQuery<TQuery>>;
 export {};

package/dist/relay/loadSerializableQuery.js

@@ -40,9 +40,9 @@ import { createNetworkFetch } from './environment.js';
 // Call into raw network fetch to get serializable GraphQL query response
 // This response will be sent to the client to "warm" the QueryResponseCache
 // to avoid the client fetches.
-export default async function loadSerializableQuery(query, variables) {
+export default async function loadSerializableQuery(query, variables, options) {
   if (!('params' in query)) throw new Error('Params not found in query, is it a fragment instead of a query?');
-  const fetcher = createNetworkFetch();
+  const fetcher = createNetworkFetch(options);
   const response = await fetcher(query.params, variables);
   return {
     params: query.params,

package/dist/relay/serverConfig.d.ts

@@ -0,0 +1,10 @@
+export interface FontdueServerConfig {
+    /** Base URL for server-side GraphQL fetches, e.g. https://acme.fontdue.com */
+    url?: string;
+    /** Extra headers sent with every server-side GraphQL fetch. */
+    headers?: Record<string, string>;
+    /** Extra Next.js fetch cache tags applied to every server-side GraphQL fetch. */
+    cacheTags?: string[];
+}
+export declare function setFontdueServerConfig(config: FontdueServerConfig): void;
+export declare function getFontdueServerConfig(): FontdueServerConfig | undefined;

package/dist/relay/serverConfig.js

@@ -0,0 +1,38 @@
+// Per-render configuration for server-side GraphQL fetches.
+//
+// React Server Components have no context API, so a `<FontdueProvider url=…>`
+// prop cannot reach the nested server components that preload queries — the
+// prop historically only configured client-side fetches. What RSC does have
+// is React.cache(): a memoization store scoped to one server render pass and
+// shared by every server component in it. We use a single cache cell as a
+// render-scoped mutable slot: the host app (or the FontdueProvider server
+// entrypoint) writes the config early in the render, and every later
+// server-side fetch in the same pass reads it.
+//
+// Unlike AsyncLocalStorage-based approaches (e.g. Next's headers()), reading
+// this store does not opt the route into dynamic rendering, so static
+// generation and ISR keep working. Each render pass gets a fresh store, so
+// concurrent requests cannot leak config into each other.
+//
+// Caveat that callers must own: the write has to happen in the same render
+// pass, before the fetch. A provider in a layout covers full-page renders,
+// but an App Router soft navigation re-renders only the page segment — set
+// the config at the top of each page (or in a shared data helper every page
+// calls) when pages contain Fontdue components.
+//
+// Outside an RSC render (client bundles, SSR setups without React.cache
+// semantics) the slot degrades to a throwaway object: writes become no-ops
+// and the environment variables remain the configuration source.
+
+import * as React from 'react';
+const getSlot = typeof React.cache === 'function' ? React.cache(() => ({
+  current: undefined
+})) : () => ({
+  current: undefined
+});
+export function setFontdueServerConfig(config) {
+  getSlot().current = config;
+}
+export function getFontdueServerConfig() {
+  return getSlot().current;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fontdue-js",
-  "version": "3.0.0-alpha6",
+  "version": "3.0.0-alpha7",
   "type": "module",
   "scripts": {
     "build": "npm run relay && run-p build-js build-css build-ts",
@@ -82,6 +82,7 @@
   },
   "exports": {
     ".": "./dist/index.js",
+    "./server": "./dist/relay/serverConfig.js",
     "./fontdue.css": "./dist/fontdue.css",
     "./BuyButton": {
       "react-server": "./dist/components/BuyButton/index.server.js",

package/dist/__generated__/TypeTesterStyleSelectData_viewer.graphql.d.ts

@@ -1,42 +0,0 @@
-/**
- * @generated SignedSource<<de2a1d20c5692c0b9d1b3fb9726732b0>>
- * @lightSyntaxTransform
- * @nogrep
- */
-import { ReaderFragment } from 'relay-runtime';
-import { FragmentRefs } from "relay-runtime";
-export type TypeTesterStyleSelectData_viewer$data = {
-    readonly families?: {
-        readonly edges: ReadonlyArray<{
-            readonly node: {
-                readonly featureStyle: {
-                    readonly supportedLanguages: ReadonlyArray<string> | null;
-                } | null;
-                readonly fontStyles: ReadonlyArray<{
-                    readonly cssStretch: string | null;
-                    readonly cssStyle: string | null;
-                    readonly cssWeight: string | null;
-                    readonly id: string;
-                    readonly name: string;
-                    readonly variableInstances: ReadonlyArray<{
-                        readonly coordinates: ReadonlyArray<{
-                            readonly axis: string;
-                            readonly value: number;
-                        }>;
-                        readonly name: string;
-                    }> | null;
-                }>;
-                readonly id: string;
-                readonly isVariableFont: boolean;
-                readonly name: string;
-            } | null;
-        } | null> | null;
-    } | null;
-    readonly " $fragmentType": "TypeTesterStyleSelectData_viewer";
-};
-export type TypeTesterStyleSelectData_viewer$key = {
-    readonly " $data"?: TypeTesterStyleSelectData_viewer$data;
-    readonly " $fragmentSpreads": FragmentRefs<"TypeTesterStyleSelectData_viewer">;
-};
-declare const node: ReaderFragment;
-export default node;

package/dist/__generated__/TypeTesterStyleSelectData_viewer.graphql.js

@@ -1,166 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-/**
- * @generated SignedSource<<de2a1d20c5692c0b9d1b3fb9726732b0>>
- * @lightSyntaxTransform
- * @nogrep
- */
-
-/* tslint:disable */
-/* eslint-disable */
-// @ts-nocheck
-
-const node = function () {
-  var v0 = {
-      "alias": null,
-      "args": null,
-      "kind": "ScalarField",
-      "name": "id",
-      "storageKey": null
-    },
-    v1 = {
-      "alias": null,
-      "args": null,
-      "kind": "ScalarField",
-      "name": "name",
-      "storageKey": null
-    };
-  return {
-    "argumentDefinitions": [{
-      "defaultValue": true,
-      "kind": "LocalArgument",
-      "name": "selectable"
-    }],
-    "kind": "Fragment",
-    "metadata": null,
-    "name": "TypeTesterStyleSelectData_viewer",
-    "selections": [{
-      "condition": "selectable",
-      "kind": "Condition",
-      "passingValue": true,
-      "selections": [{
-        "alias": "families",
-        "args": [{
-          "kind": "Literal",
-          "name": "collectionTypes",
-          "value": ["FAMILY"]
-        }, {
-          "kind": "Literal",
-          "name": "first",
-          "value": 999
-        }],
-        "concreteType": "FontCollectionConnection",
-        "kind": "LinkedField",
-        "name": "fontCollections",
-        "plural": false,
-        "selections": [{
-          "alias": null,
-          "args": null,
-          "concreteType": "FontCollectionEdge",
-          "kind": "LinkedField",
-          "name": "edges",
-          "plural": true,
-          "selections": [{
-            "alias": null,
-            "args": null,
-            "concreteType": "FontCollection",
-            "kind": "LinkedField",
-            "name": "node",
-            "plural": false,
-            "selections": [v0 /*: any*/, v1 /*: any*/, {
-              "alias": null,
-              "args": null,
-              "kind": "ScalarField",
-              "name": "isVariableFont",
-              "storageKey": null
-            }, {
-              "alias": null,
-              "args": null,
-              "concreteType": "FontStyle",
-              "kind": "LinkedField",
-              "name": "featureStyle",
-              "plural": false,
-              "selections": [{
-                "alias": null,
-                "args": null,
-                "kind": "ScalarField",
-                "name": "supportedLanguages",
-                "storageKey": null
-              }],
-              "storageKey": null
-            }, {
-              "alias": null,
-              "args": null,
-              "concreteType": "FontStyle",
-              "kind": "LinkedField",
-              "name": "fontStyles",
-              "plural": true,
-              "selections": [v0 /*: any*/, v1 /*: any*/, {
-                "alias": null,
-                "args": null,
-                "kind": "ScalarField",
-                "name": "cssWeight",
-                "storageKey": null
-              }, {
-                "alias": null,
-                "args": null,
-                "kind": "ScalarField",
-                "name": "cssStyle",
-                "storageKey": null
-              }, {
-                "alias": null,
-                "args": null,
-                "kind": "ScalarField",
-                "name": "cssStretch",
-                "storageKey": null
-              }, {
-                "alias": null,
-                "args": null,
-                "concreteType": "VariableInstance",
-                "kind": "LinkedField",
-                "name": "variableInstances",
-                "plural": true,
-                "selections": [v1 /*: any*/, {
-                  "alias": null,
-                  "args": null,
-                  "concreteType": "VariableSetting",
-                  "kind": "LinkedField",
-                  "name": "coordinates",
-                  "plural": true,
-                  "selections": [{
-                    "alias": null,
-                    "args": null,
-                    "kind": "ScalarField",
-                    "name": "axis",
-                    "storageKey": null
-                  }, {
-                    "alias": null,
-                    "args": null,
-                    "kind": "ScalarField",
-                    "name": "value",
-                    "storageKey": null
-                  }],
-                  "storageKey": null
-                }],
-                "storageKey": null
-              }],
-              "storageKey": null
-            }],
-            "storageKey": null
-          }],
-          "storageKey": null
-        }],
-        "storageKey": "fontCollections(collectionTypes:[\"FAMILY\"],first:999)"
-      }]
-    }],
-    "type": "Viewer",
-    "abstractKey": null
-  };
-}();
-node.hash = "5e5834d9202f90bdde5a0a7db49e8639";
-var _default = node;
-exports.default = _default;

package/dist/__generated__/TypeTester_viewer.graphql.d.ts

@@ -1,17 +0,0 @@
-/**
- * @generated SignedSource<<abd37f03c566e5adecd035ce761cfe89>>
- * @lightSyntaxTransform
- * @nogrep
- */
-import { ReaderFragment } from 'relay-runtime';
-import { FragmentRefs } from "relay-runtime";
-export type TypeTester_viewer$data = {
-    readonly " $fragmentSpreads": FragmentRefs<"TypeTesterStyleSelectData_viewer">;
-    readonly " $fragmentType": "TypeTester_viewer";
-};
-export type TypeTester_viewer$key = {
-    readonly " $data"?: TypeTester_viewer$data;
-    readonly " $fragmentSpreads": FragmentRefs<"TypeTester_viewer">;
-};
-declare const node: ReaderFragment;
-export default node;

package/dist/__generated__/TypeTester_viewer.graphql.js

@@ -1,40 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-/**
- * @generated SignedSource<<abd37f03c566e5adecd035ce761cfe89>>
- * @lightSyntaxTransform
- * @nogrep
- */
-
-/* tslint:disable */
-/* eslint-disable */
-// @ts-nocheck
-
-const node = {
-  "argumentDefinitions": [{
-    "defaultValue": null,
-    "kind": "LocalArgument",
-    "name": "selectable"
-  }],
-  "kind": "Fragment",
-  "metadata": null,
-  "name": "TypeTester_viewer",
-  "selections": [{
-    "args": [{
-      "kind": "Variable",
-      "name": "selectable",
-      "variableName": "selectable"
-    }],
-    "kind": "FragmentSpread",
-    "name": "TypeTesterStyleSelectData_viewer"
-  }],
-  "type": "Viewer",
-  "abstractKey": null
-};
-node.hash = "26c2b3145462407675ab9b202b0d1b4c";
-var _default = node;
-exports.default = _default;

package/dist/__generated__/TypeTesters_viewer.graphql.d.ts

@@ -1,17 +0,0 @@
-/**
- * @generated SignedSource<<989cf2f044377f9f42d9f840f839af4b>>
- * @lightSyntaxTransform
- * @nogrep
- */
-import { ReaderFragment } from 'relay-runtime';
-import { FragmentRefs } from "relay-runtime";
-export type TypeTesters_viewer$data = {
-    readonly " $fragmentSpreads": FragmentRefs<"TypeTester_viewer">;
-    readonly " $fragmentType": "TypeTesters_viewer";
-};
-export type TypeTesters_viewer$key = {
-    readonly " $data"?: TypeTesters_viewer$data;
-    readonly " $fragmentSpreads": FragmentRefs<"TypeTesters_viewer">;
-};
-declare const node: ReaderFragment;
-export default node;

package/dist/__generated__/TypeTesters_viewer.graphql.js

@@ -1,40 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-/**
- * @generated SignedSource<<989cf2f044377f9f42d9f840f839af4b>>
- * @lightSyntaxTransform
- * @nogrep
- */
-
-/* tslint:disable */
-/* eslint-disable */
-// @ts-nocheck
-
-const node = {
-  "argumentDefinitions": [{
-    "defaultValue": null,
-    "kind": "LocalArgument",
-    "name": "selectable"
-  }],
-  "kind": "Fragment",
-  "metadata": null,
-  "name": "TypeTesters_viewer",
-  "selections": [{
-    "args": [{
-      "kind": "Variable",
-      "name": "selectable",
-      "variableName": "selectable"
-    }],
-    "kind": "FragmentSpread",
-    "name": "TypeTester_viewer"
-  }],
-  "type": "Viewer",
-  "abstractKey": null
-};
-node.hash = "8fbadb67d6506fee0f3ccc09624517c6";
-var _default = node;
-exports.default = _default;

package/dist/components/FontdueContextProvider/index.server.d.ts

@@ -1,4 +0,0 @@
-import React from 'react';
-import type { FontdueContextProvider_props } from './index.js';
-export type { FontdueContextProvider_props } from './index.js';
-export default function FontdueContextProviderServer(props: FontdueContextProvider_props): Promise<React.JSX.Element>;

package/dist/components/FontdueContextProvider/index.server.js

@@ -1,7 +0,0 @@
-import React from 'react';
-import FontdueContextProvider from './index.js';
-// RSC entry. The client component does the work; this exists so the
-// `react-server` export condition resolves to a server-renderable file.
-export default async function FontdueContextProviderServer(props) {
-  return /*#__PURE__*/React.createElement(FontdueContextProvider, props);
-}

package/dist/components/FontdueProvider/useAuxUIOwner.d.ts

@@ -1 +0,0 @@
-export default function useAuxUIOwner(): boolean;

package/dist/components/FontdueProvider/useAuxUIOwner.js

@@ -1,28 +0,0 @@
-'use client';
-
-import { useEffect, useState } from 'react';
-
-// Module-level claim: only one FontdueProvider on a page renders
-// auxiliary UI (TestModeBanner, ThemeConfig, Tracking, ConsentBanner,
-// ServerConfigProvider). Starts false on both server and client to avoid
-// hydration mismatch; the first provider to run `useEffect` wins and flips
-// its own state to true. Relinquishes the claim on unmount so HMR and
-// route changes don't leak.
-
-let ownerId = null;
-export default function useAuxUIOwner() {
-  const [isOwner, setIsOwner] = useState(false);
-  useEffect(() => {
-    const myId = {};
-    if (ownerId == null) {
-      ownerId = myId;
-      setIsOwner(true);
-    }
-    return () => {
-      if (ownerId === myId) {
-        ownerId = null;
-      }
-    };
-  }, []);
-  return isOwner;
-}

package/dist/components/TypeTester/TypeTesterStandalone.preload.d.ts

@@ -1,14 +0,0 @@
-import React from 'react';
-import { LoadSerializableQueryOptions, SerializablePreloadedQuery } from '../../relay/loadSerializableQuery.js';
-import { TypeTesterStandaloneQuery } from '../../__generated__/TypeTesterStandaloneQuery.graphql.js';
-import { TypeTesterStandalonePreloadedQueryRenderer } from './TypeTesterStandalone.js';
-export type TypeTesterPreloadedQuery = SerializablePreloadedQuery<TypeTesterStandaloneQuery>;
-export interface LoadTypeTesterQueryVariables {
-    familyName: string;
-    styleName: string;
-    selectable?: boolean;
-}
-export declare function loadTypeTesterQuery(variables: LoadTypeTesterQueryVariables, options?: LoadSerializableQueryOptions): Promise<TypeTesterPreloadedQuery>;
-type RendererProps = React.ComponentProps<typeof TypeTesterStandalonePreloadedQueryRenderer>;
-export declare function TypeTesterPreloaded(props: RendererProps): React.JSX.Element;
-export {};

package/dist/components/TypeTester/TypeTesterStandalone.preload.js

@@ -1,20 +0,0 @@
-import React from 'react';
-import loadSerializableQuery from '../../relay/loadSerializableQuery.js';
-import TypeTesterStandaloneQueryNode from '../../__generated__/TypeTesterStandaloneQuery.graphql.js';
-import FontdueContextProvider from '../FontdueContextProvider/index.js';
-import { TypeTesterStandalonePreloadedQueryRenderer } from './TypeTesterStandalone.js';
-export async function loadTypeTesterQuery(variables, options) {
-  return loadSerializableQuery(TypeTesterStandaloneQueryNode, {
-    familyName: variables.familyName,
-    styleName: variables.styleName,
-    selectable: variables.selectable ?? true
-  }, options);
-}
-// Self-wraps with FontdueContextProvider so consumers don't need to wire up
-// Relay env / Redux store / contexts at the call site. Aux UI (theme,
-// test-mode banner, consent, tracking) is NOT rendered here — that belongs
-// to a single layout-level `<FontdueProvider>` per page. State is shared
-// across multiple preloaded components on a page via module-level singletons.
-export function TypeTesterPreloaded(props) {
-  return /*#__PURE__*/React.createElement(FontdueContextProvider, null, /*#__PURE__*/React.createElement(TypeTesterStandalonePreloadedQueryRenderer, props));
-}

package/dist/config.d.ts

@@ -1,7 +0,0 @@
-import type { Config } from './components/ConfigContext.js';
-export interface FontdueConfig extends Config {
-    url?: string;
-    stripeIntegration?: 'card-element' | 'dynamic';
-}
-export declare function configure(opts: Partial<FontdueConfig>): void;
-export declare function getConfig(): Readonly<FontdueConfig>;

package/dist/config.js

@@ -1,31 +0,0 @@
-// Module-level global configuration. Consumers call `configure()` once at
-// app startup (Astro layout, Next layout, Vite entry) and every fontdue-js
-// entry point reads defaults from here.
-//
-// Precedence (low to high):
-//   1. Server admin config (from the tenant dashboard, fetched via Relay)
-//   2. configure({...})  — module-level code defaults
-//   3. <FontdueProvider config={...}>  — per-instance prop override
-//
-// Per-request isolation note: `configure` sets module-level state. That's
-// fine for single-tenant apps. Multi-tenant servers that switch URL per
-// request should pass `url` explicitly to loadSerializableQuery rather than
-// rely on configure().
-
-// Network-layer + UI config in one bag. UI fields come from `Config` (the
-// shape passed to ConfigContext); URL + stripeIntegration are network-layer.
-
-let current = {};
-
-// Shallow-merges with prior values. Calling `configure({tracking: {...}})`
-// replaces the whole `tracking` subtree; pass nested fields fully populated
-// when partial-updating.
-export function configure(opts) {
-  current = {
-    ...current,
-    ...opts
-  };
-}
-export function getConfig() {
-  return current;
-}