fontdue-js 2.21.0 → 2.22.0

package/CHANGELOG.md

@@ -1,3 +1,9 @@
+## 2.22.0
+
+- **`features="*"` wildcard on `<TypeTester>` and `<TypeTesters>`** to expose every OpenType feature each font supports without curating a list. Custom *stylistic set* names defined by the foundry are picked up automatically. Works on both the standalone `<fontdue-type-tester>` HTML element and the React `<TypeTester>` / `<TypeTesters>` components.
+- **`features` prop on `<TypeTesters>`** — the plural now accepts a `features` prop (or `features` HTML attribute on `<fontdue-type-testers>`) that overrides `collection.typeTesterFeatures`, matching the singular API. Useful for setting `features="*"` per-embed without changing the collection's saved settings.
+- The `features` prop on both singular and plural now accepts the literal string `"*"` as a scalar in addition to `["*"]`, so React consumers can write `features="*"` instead of `features={['*']}`.
+
 ## 2.21.0
 
 - Fixed `CharacterViewer` silently dropping characters from supplementary-plane Unicode blocks (e.g. Latin Extended-F, Enclosed Alphanumeric Supplement). Range expansion now uses `codePointAt` / `String.fromCodePoint` so characters above U+FFFF render correctly instead of getting filtered out as unpaired surrogates

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

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

package/dist/components/FontdueProvider/useAuxUIOwner.js

@@ -0,0 +1,28 @@
+'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/TypeTesterFeatures.js

@@ -108,7 +108,8 @@ function TypeTesterFeatures(_ref) {
       }
     }, columnConfig.features.filter(feature => shouldIncludeFeature(fontFeatures === null || fontFeatures === void 0 ? void 0 : fontFeatures.supportedFeatures, typeof feature === 'string' ? feature : feature.code)).map(renderFeature))));
   } else {
-    featuresColumns = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, showFeatures === null || showFeatures === void 0 ? void 0 : showFeatures.filter(feature => shouldIncludeFeature(fontFeatures === null || fontFeatures === void 0 ? void 0 : fontFeatures.supportedFeatures, feature)).map(renderFeature));
+    const expanded = showFeatures !== null && showFeatures !== void 0 && showFeatures.includes('*') ? (fontFeatures === null || fontFeatures === void 0 ? void 0 : fontFeatures.supportedFeatures) ?? [] : (showFeatures ?? []).filter(feature => shouldIncludeFeature(fontFeatures === null || fontFeatures === void 0 ? void 0 : fontFeatures.supportedFeatures, feature));
+    featuresColumns = /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, expanded.map(renderFeature));
   }
   const {
     height: featuresHeight,

package/dist/components/TypeTester/TypeTesterFeaturesButton.js

@@ -37,10 +37,12 @@ const TypeTesterFeaturesButton = _ref => {
   const selectedFeature = features[0];
   const fontStyle = (0, _reactRelay.useFragment)((_TypeTesterFeaturesButton_fontStyle2.default.hash && _TypeTesterFeaturesButton_fontStyle2.default.hash !== "bfda99c867db0b614314fc774911c4b0" && console.error("The definition of 'TypeTesterFeaturesButton_fontStyle' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TypeTesterFeaturesButton_fontStyle2.default), fontStyleKey);
   const {
-    featureNames
+    featureNames,
+    fontFeatures
   } = (0, _useFeaturesData.default)({
     fontStyle
   });
+  const effectiveFeatures = showFeatures !== null && showFeatures !== void 0 && showFeatures.includes('*') ? (fontFeatures === null || fontFeatures === void 0 ? void 0 : fontFeatures.supportedFeatures) ?? [] : showFeatures;
   if (config.openTypeFeatures.interactionStyle === 'panel') {
     return /*#__PURE__*/_react.default.createElement("div", {
       className: "type-tester__features-button",
@@ -55,7 +57,7 @@ const TypeTesterFeaturesButton = _ref => {
     }, config.openTypeFeatures.buttonLabel), ' ', featuresOpen ? /*#__PURE__*/_react.default.createElement(_CarrotUp.default, null) : /*#__PURE__*/_react.default.createElement(_CarrotDown.default, null)));
   }
   if (config.openTypeFeatures.interactionStyle === 'select') {
-    if (!showFeatures || showFeatures.length === 0) return null;
+    if (!effectiveFeatures || effectiveFeatures.length === 0) return null;
     return /*#__PURE__*/_react.default.createElement("div", {
       className: "type-tester__features-select"
     }, /*#__PURE__*/_react.default.createElement(_Select.default, {
@@ -63,7 +65,7 @@ const TypeTesterFeaturesButton = _ref => {
       options: [{
         value: '',
         text: 'OT Features'
-      }].concat(showFeatures.map(feature => ({
+      }].concat(effectiveFeatures.map(feature => ({
         value: feature,
         text: featureNames[feature]
       }))),

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

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Alignment, Direction } from './types';
+import { Alignment, Direction, FeaturesProp } from './types';
 import { SerializablePreloadedQuery } from '../../relay/loadSerializableQuery';
 import { TypeTesterStandaloneQuery } from '__generated__/TypeTesterStandaloneQuery.graphql';
 interface TypeTesterStandaloneComponent_props {
@@ -7,7 +7,7 @@ interface TypeTesterStandaloneComponent_props {
     letterSpacing?: number | null;
     fontSize?: number | null;
     axes?: string[] | null;
-    features?: string[] | null;
+    features?: FeaturesProp;
     featuresSelected?: string[] | null;
     featureSettings?: {
         feature: string;

package/dist/components/TypeTester/TypeTesterStandalone.js

@@ -12,6 +12,7 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactRelay = require("react-relay");
 var _index = _interopRequireDefault(require("./index"));
 var _TypeTesterContext = _interopRequireDefault(require("./TypeTesterContext"));
+var _types = require("./types");
 var _useSerializablePreloadedQuery = _interopRequireDefault(require("../../relay/useSerializablePreloadedQuery"));
 var _ConfigContext = _interopRequireDefault(require("../ConfigContext"));
 var _useLicenseAndOrderVariables = require("../../hooks/useLicenseAndOrderVariables");
@@ -98,7 +99,7 @@ function TypeTesterStandaloneComponent(_ref) {
     fontStyle: changedStyle ? changedStylesData.node : (_data$viewer = data.viewer) === null || _data$viewer === void 0 ? void 0 : _data$viewer.fontStyle,
     onStyleSelect: handleStyleSelect,
     axes: axes,
-    features: features,
+    features: (0, _types.normalizeFeaturesProp)(features),
     productId: ((_data$viewer2 = data.viewer) === null || _data$viewer2 === void 0 ? void 0 : (_data$viewer2$fontSty = _data$viewer2.fontStyle) === null || _data$viewer2$fontSty === void 0 ? void 0 : (_data$viewer2$fontSty2 = _data$viewer2$fontSty.family) === null || _data$viewer2$fontSty2 === void 0 ? void 0 : (_data$viewer2$fontSty3 = _data$viewer2$fontSty2.parent) === null || _data$viewer2$fontSty3 === void 0 ? void 0 : _data$viewer2$fontSty3.id) ?? ((_data$viewer3 = data.viewer) === null || _data$viewer3 === void 0 ? void 0 : (_data$viewer3$fontSty = _data$viewer3.fontStyle) === null || _data$viewer3$fontSty === void 0 ? void 0 : (_data$viewer3$fontSty2 = _data$viewer3$fontSty.family) === null || _data$viewer3$fontSty2 === void 0 ? void 0 : _data$viewer3$fontSty2.id),
     groupEdit: false,
     onFocus: onFocus,

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

@@ -0,0 +1,14 @@
+import React from 'react';
+import { LoadSerializableQueryOptions, SerializablePreloadedQuery } from '../../relay/loadSerializableQuery';
+import { TypeTesterStandaloneQuery } from '../../__generated__/TypeTesterStandaloneQuery.graphql';
+import { TypeTesterStandalonePreloadedQueryRenderer } from './TypeTesterStandalone';
+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

@@ -0,0 +1,19 @@
+import React from 'react';
+import loadSerializableQuery from '../../relay/loadSerializableQuery';
+import TypeTesterStandaloneQueryNode from '../../__generated__/TypeTesterStandaloneQuery.graphql';
+import FontdueProvider from '../FontdueProvider';
+import { TypeTesterStandalonePreloadedQueryRenderer } from './TypeTesterStandalone';
+export async function loadTypeTesterQuery(variables, options) {
+  return loadSerializableQuery(TypeTesterStandaloneQueryNode, {
+    familyName: variables.familyName,
+    styleName: variables.styleName,
+    selectable: variables.selectable ?? true
+  }, options);
+}
+// Self-wraps with FontdueProvider so consumers don't need to. The provider
+// state is a module-level singleton under the hood, so multiple
+// TypeTesterPreloaded (or other *Preloaded) components on a page all share
+// one Relay env + Redux store + auxiliary UI.
+export function TypeTesterPreloaded(props) {
+  return /*#__PURE__*/React.createElement(FontdueProvider, null, /*#__PURE__*/React.createElement(TypeTesterStandalonePreloadedQueryRenderer, props));
+}

package/dist/components/TypeTester/types.d.ts

@@ -3,6 +3,8 @@ export type Content = EditorState;
 export type Size = number;
 export type LineHeight = number;
 export type Features = string[];
+export type FeaturesProp = ReadonlyArray<string> | '*' | null | undefined;
+export declare const normalizeFeaturesProp: (features: FeaturesProp) => ReadonlyArray<string> | null;
 export type Alignment = 'left' | 'center' | 'right';
 export type Direction = 'ltr' | 'rtl';
 export type TypeTesterAxesPosition = 'auto' | 'features-panel' | 'inline' | 'above';

package/dist/components/TypeTester/types.js

@@ -2,4 +2,13 @@
 
 Object.defineProperty(exports, "__esModule", {
   value: true
-});
+});
+exports.normalizeFeaturesProp = void 0;
+// Public-API feature prop. Accepts an array of feature codes, or the literal
+// string '*' to expose every feature the font supports.
+
+const normalizeFeaturesProp = features => features === '*' ? ['*'] : features ?? null;
+
+// controls whether the type tester editing should apply to all of the
+// testers within a group
+exports.normalizeFeaturesProp = normalizeFeaturesProp;

package/dist/components/TypeTesters/TypeTestersElement.d.ts

@@ -4,8 +4,9 @@ interface TypeTestersElementProps {
     collectionSlug?: string;
     defaultMode?: string;
     autofit?: string;
+    features?: string;
     tags?: string;
     excludeTags?: string;
 }
-declare function TypeTestersElement({ autofit, tags, excludeTags, defaultMode, ...rest }: TypeTestersElementProps): React.JSX.Element;
+declare function TypeTestersElement({ autofit, tags, excludeTags, defaultMode, features, ...rest }: TypeTestersElementProps): React.JSX.Element;
 export default TypeTestersElement;

package/dist/components/TypeTesters/TypeTestersElement.js

@@ -19,13 +19,15 @@ function TypeTestersElement(_ref) {
     tags,
     excludeTags,
     defaultMode,
+    features,
     ...rest
   } = _ref;
   return /*#__PURE__*/_react.default.createElement(_index.default, _extends({
     tags: tags === null || tags === void 0 ? void 0 : tags.split(','),
     excludeTags: excludeTags === null || excludeTags === void 0 ? void 0 : excludeTags.split(','),
     autofit: autofit ? autofit === 'true' : undefined,
-    defaultMode: getDefaultMode(defaultMode, autofit === 'true')
+    defaultMode: getDefaultMode(defaultMode, autofit === 'true'),
+    features: features === null || features === void 0 ? void 0 : features.split(',')
   }, rest));
 }
 var _default = TypeTestersElement;

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

@@ -1,12 +1,14 @@
 import React from 'react';
 import { TypeTestersIDQuery } from '../../__generated__/TypeTestersIDQuery.graphql';
 import { TypeTestersSlugQuery } from '../../__generated__/TypeTestersSlugQuery.graphql';
+import { FeaturesProp } from '../TypeTester/types';
 import { SerializablePreloadedQuery } from '../../relay/loadSerializableQuery';
 export interface TypeTesters_props {
     collectionId?: string;
     collectionSlug?: string;
     defaultMode?: 'group' | 'local';
     autofit?: boolean;
+    features?: FeaturesProp;
     tags?: string[] | null;
     excludeTags?: string[] | null;
     onFocus?: () => void;

package/dist/components/TypeTesters/index.js

@@ -23,6 +23,7 @@ var _useRefetchOnLicenseChanges = require("../../hooks/useRefetchOnLicenseChange
 var _TypeTestersRefetchQuery = _interopRequireDefault(require("../../__generated__/TypeTestersRefetchQuery.graphql"));
 var _TypeTester = _interopRequireDefault(require("../TypeTester"));
 var _TypeTesterFloatingToolbar = _interopRequireDefault(require("../TypeTester/TypeTesterFloatingToolbar"));
+var _types = require("../TypeTester/types");
 var _useSerializablePreloadedQuery = _interopRequireDefault(require("../../relay/useSerializablePreloadedQuery"));
 var _useLicenseAndOrderVariables = require("../../hooks/useLicenseAndOrderVariables");
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -63,6 +64,7 @@ function TypeTestersComponent(_ref) {
     viewer: viewerKey,
     defaultMode,
     autofit,
+    features: featuresOverride,
     onFocus,
     onBlur,
     onToolbarOpenClose,
@@ -146,13 +148,14 @@ function TypeTestersComponent(_ref) {
     return acc;
   }, {});
   if (!testers) return null;
+  const features = (0, _types.normalizeFeaturesProp)(featuresOverride) ?? collection.typeTesterFeatures;
   return /*#__PURE__*/_react.default.createElement(_TypeTesterContext.default, {
     key: collection.id,
     defaultMode: defaultMode ?? (autofit ? 'local' : 'group'),
     testers: testers
   }, config.toolsPosition === 'floating' && /*#__PURE__*/_react.default.createElement(_TypeTesterFloatingToolbar.default, {
     testers: ((_collection$typeTeste4 = collection.typeTesters) === null || _collection$typeTeste4 === void 0 ? void 0 : (_collection$typeTeste5 = _collection$typeTeste4.edges) === null || _collection$typeTeste5 === void 0 ? void 0 : _collection$typeTeste5.map(edge => edge.node)) ?? [],
-    features: collection.typeTesterFeatures,
+    features: features,
     axes: collection.typeTesterAxes,
     onToolbarOpenClose: onToolbarOpenClose
   }), getTypeTesterGroups(collection).map((typeTesterGroup, i) => {
@@ -179,7 +182,7 @@ function TypeTestersComponent(_ref) {
         onStyleSelect: fontStyleId => handleStyleSelect(node.id, fontStyleId),
         key: j,
         productId: productId,
-        features: collection.typeTesterFeatures,
+        features: features,
         axes: collection.typeTesterAxes,
         viewer: viewer,
         tags: node.tags

package/dist/config.d.ts

@@ -0,0 +1,6 @@
+export interface FontdueConfig {
+    url?: string;
+    stripeIntegration?: 'card-element' | 'dynamic';
+}
+export declare function configure(opts: Partial<FontdueConfig>): void;
+export declare function getConfig(): Readonly<FontdueConfig>;

package/dist/config.js

@@ -0,0 +1,20 @@
+// Module-level global configuration. Consumers call `configure()` once at
+// app startup (e.g. Astro middleware, Next layout, Vite entry) and every
+// fontdue-js entry point reads defaults from here. Explicit options passed
+// to loadSerializableQuery / FontdueProvider still override.
+//
+// Per-request isolation note: `configure` sets module-level state. That's
+// fine for single-tenant apps (one URL for the whole site). Multi-tenant
+// servers that switch URL per request should pass `url` explicitly to
+// loadSerializableQuery rather than rely on configure().
+
+let current = {};
+export function configure(opts) {
+  current = {
+    ...current,
+    ...opts
+  };
+}
+export function getConfig() {
+  return current;
+}

package/dist/index.d.ts

@@ -0,0 +1,2 @@
+export { configure, getConfig } from './config';
+export type { FontdueConfig } from './config';

package/dist/index.js

@@ -0,0 +1 @@
+export { configure, getConfig } from './config';

package/dist-bundle/FontdueProvider.js

@@ -0,0 +1,6 @@
+'use client';
+import './chunks/ComponentsContext-CmkN9J4X.js';
+import 'react';
+export { F as default } from './chunks/index-C4ak9qTL.js';
+import './index.js';
+//# sourceMappingURL=FontdueProvider.js.map

package/dist-bundle/FontdueProvider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"FontdueProvider.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist-bundle/TypeTester.js

@@ -0,0 +1,7 @@
+'use client';
+import './chunks/ComponentsContext-CmkN9J4X.js';
+export { T as TypeTesterStandalonePreloadedQueryRenderer, a as default } from './chunks/TypeTesterStandalone-BMWuv8Ca.js';
+import 'react';
+import './index.js';
+import 'react-dom';
+//# sourceMappingURL=TypeTester.js.map

package/dist-bundle/TypeTester.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TypeTester.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/dist-bundle/TypeTester.preload.js

@@ -0,0 +1,75 @@
+import React__default from 'react';
+import { c as createNetworkFetch } from './chunks/ComponentsContext-CmkN9J4X.js';
+import { T as TypeTesterStandalonePreloadedQueryRenderer, n as node } from './chunks/TypeTesterStandalone-BMWuv8Ca.js';
+import { F as FontdueProvider } from './chunks/index-C4ak9qTL.js';
+import './index.js';
+import 'react-dom';
+
+/**
+ * RELAY CACHE KEY NORMALIZATION
+ *
+ * This type transformation is required to fix a cache key inconsistency issue in Relay.
+ *
+ * THE PROBLEM:
+ * Relay's `getOperationVariables()` function always includes ALL argumentDefinitions
+ * from the GraphQL operation, even optional ones, setting them to their defaultValue
+ * (typically null). This means when Relay generates cache keys, it creates entries like:
+ *
+ * Cache Key A: { collectionId: "123", tags: null, excludeTags: null, selectable: true }
+ * Cache Key B: { collectionId: "123", selectable: true }  // when optional vars omitted
+ *
+ * Even though these represent the same logical query, they produce different cache keys
+ * because `JSON.stringify(stableCopy(variables))` serializes them differently.
+ *
+ *  (This is possibly caused by NextJS RSC data serialization and hydration)
+ *
+ * THE ROOT CAUSE:
+ * - GraphQL schema defines: `$tags: [String!], $excludeTags: [String!]` (optional)
+ * - TypeScript generates: `tags?: ReadonlyArray<string> | null`
+ * - Relay's argumentDefinitions include: `{ name: "tags", defaultValue: null }`
+ * - getOperationVariables() always sets: `operationVariables[def.name] = def.defaultValue`
+ *
+ * THE SOLUTION:
+ * RequireAllWithNull<T> transforms optional properties to required properties with
+ * explicit null values, forcing callers to be consistent. This ensures server-side
+ * preloaded queries and client-side cache lookups use identical variable structures.
+ *
+ * USAGE:
+ * Instead of: { tags, excludeTags } // undefined values
+ * Use:        { tags: tags ?? null, excludeTags: excludeTags ?? null } // explicit nulls
+ *
+ * This eliminates cache misses caused by variable structure inconsistencies between
+ * server-side rendering and client-side Relay operations.
+ */
+
+// 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.
+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(options);
+  const response = await fetcher(query.params, variables);
+  return {
+    params: query.params,
+    variables,
+    response
+  };
+}
+
+async function loadTypeTesterQuery(variables, options) {
+  return loadSerializableQuery(node, {
+    familyName: variables.familyName,
+    styleName: variables.styleName,
+    selectable: variables.selectable ?? true
+  }, options);
+}
+// Self-wraps with FontdueProvider so consumers don't need to. The provider
+// state is a module-level singleton under the hood, so multiple
+// TypeTesterPreloaded (or other *Preloaded) components on a page all share
+// one Relay env + Redux store + auxiliary UI.
+function TypeTesterPreloaded(props) {
+  return /*#__PURE__*/React__default.createElement(FontdueProvider, null, /*#__PURE__*/React__default.createElement(TypeTesterStandalonePreloadedQueryRenderer, props));
+}
+
+export { TypeTesterPreloaded, loadTypeTesterQuery };
+//# sourceMappingURL=TypeTester.preload.js.map

package/dist-bundle/TypeTester.preload.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TypeTester.preload.js","sources":["../src/relay/loadSerializableQuery.ts","../src/components/TypeTester/TypeTesterStandalone.preload.tsx"],"sourcesContent":["import {\n  GraphQLResponse,\n  GraphQLTaggedNode,\n  OperationType,\n  RequestParameters,\n  VariablesOf,\n} from 'relay-runtime';\nimport { createNetworkFetch } from './environment';\n\nexport interface SerializablePreloadedQuery<TQuery extends OperationType> {\n  params: RequestParameters;\n  variables: VariablesOf<TQuery>;\n  response: GraphQLResponse;\n}\n\n/**\n * RELAY CACHE KEY NORMALIZATION\n *\n * This type transformation is required to fix a cache key inconsistency issue in Relay.\n *\n * THE PROBLEM:\n * Relay's `getOperationVariables()` function always includes ALL argumentDefinitions\n * from the GraphQL operation, even optional ones, setting them to their defaultValue\n * (typically null). This means when Relay generates cache keys, it creates entries like:\n *\n * Cache Key A: { collectionId: \"123\", tags: null, excludeTags: null, selectable: true }\n * Cache Key B: { collectionId: \"123\", selectable: true }  // when optional vars omitted\n *\n * Even though these represent the same logical query, they produce different cache keys\n * because `JSON.stringify(stableCopy(variables))` serializes them differently.\n *\n *  (This is possibly caused by NextJS RSC data serialization and hydration)\n *\n * THE ROOT CAUSE:\n * - GraphQL schema defines: `$tags: [String!], $excludeTags: [String!]` (optional)\n * - TypeScript generates: `tags?: ReadonlyArray<string> | null`\n * - Relay's argumentDefinitions include: `{ name: \"tags\", defaultValue: null }`\n * - getOperationVariables() always sets: `operationVariables[def.name] = def.defaultValue`\n *\n * THE SOLUTION:\n * RequireAllWithNull<T> transforms optional properties to required properties with\n * explicit null values, forcing callers to be consistent. This ensures server-side\n * preloaded queries and client-side cache lookups use identical variable structures.\n *\n * USAGE:\n * Instead of: { tags, excludeTags } // undefined values\n * Use:        { tags: tags ?? null, excludeTags: excludeTags ?? null } // explicit nulls\n *\n * This eliminates cache misses caused by variable structure inconsistencies between\n * server-side rendering and client-side Relay operations.\n */\ntype RequireAllWithNull<T> = {\n  [K in keyof T]-?: T[K] | null;\n};\n\nexport interface LoadSerializableQueryOptions {\n  url?: string;\n  stripeIntegration?: 'card-element' | 'dynamic';\n}\n\n// Call into raw network fetch to get serializable GraphQL query response\n// This response will be sent to the client to \"warm\" the QueryResponseCache\n// to avoid the client fetches.\nexport default async function loadSerializableQuery<TQuery extends OperationType>(\n  query: GraphQLTaggedNode,\n  variables: RequireAllWithNull<VariablesOf<TQuery>>,\n  options?: LoadSerializableQueryOptions,\n): Promise<SerializablePreloadedQuery<TQuery>> {\n  if (!('params' in query))\n    throw new Error('Params not found in query, is it a fragment instead of a query?');\n  const fetcher = createNetworkFetch(options);\n  const response = await fetcher(query.params, variables);\n\n  return {\n    params: query.params,\n    variables,\n    response,\n  };\n}\n","import React from 'react';\nimport loadSerializableQuery, {\n  LoadSerializableQueryOptions,\n  SerializablePreloadedQuery,\n} from '../../relay/loadSerializableQuery';\nimport TypeTesterStandaloneQueryNode, {\n  TypeTesterStandaloneQuery,\n} from '../../__generated__/TypeTesterStandaloneQuery.graphql';\nimport FontdueProvider from '../FontdueProvider';\nimport { TypeTesterStandalonePreloadedQueryRenderer } from './TypeTesterStandalone';\n\nexport type TypeTesterPreloadedQuery =\n  SerializablePreloadedQuery<TypeTesterStandaloneQuery>;\n\nexport interface LoadTypeTesterQueryVariables {\n  familyName: string;\n  styleName: string;\n  selectable?: boolean;\n}\n\nexport async function loadTypeTesterQuery(\n  variables: LoadTypeTesterQueryVariables,\n  options?: LoadSerializableQueryOptions,\n): Promise<TypeTesterPreloadedQuery> {\n  return loadSerializableQuery<TypeTesterStandaloneQuery>(\n    TypeTesterStandaloneQueryNode,\n    {\n      familyName: variables.familyName,\n      styleName: variables.styleName,\n      selectable: variables.selectable ?? true,\n    },\n    options,\n  );\n}\n\ntype RendererProps = React.ComponentProps<typeof TypeTesterStandalonePreloadedQueryRenderer>;\n\n// Self-wraps with FontdueProvider so consumers don't need to. The provider\n// state is a module-level singleton under the hood, so multiple\n// TypeTesterPreloaded (or other *Preloaded) components on a page all share\n// one Relay env + Redux store + auxiliary UI.\nexport function TypeTesterPreloaded(props: RendererProps) {\n  return (\n    <FontdueProvider>\n      <TypeTesterStandalonePreloadedQueryRenderer {...props} />\n    </FontdueProvider>\n  );\n}\n"],"names":["loadSerializableQuery","query","variables","options","Error","fetcher","createNetworkFetch","response","params","loadTypeTesterQuery","TypeTesterStandaloneQueryNode","familyName","styleName","selectable","TypeTesterPreloaded","props","React","createElement","FontdueProvider","TypeTesterStandalonePreloadedQueryRenderer"],"mappings":";;;;;;;AAeA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAUA;AACA;AACA;AACe,eAAeA,qBAAqBA,CACjDC,KAAwB,EACxBC,SAAkD,EAClDC,OAAsC,EACO;EAC7C,IAAI,EAAE,QAAQ,IAAIF,KAAK,CAAC,EACtB,MAAM,IAAIG,KAAK,CAAC,iEAAiE,CAAC;AACpF,EAAA,MAAMC,OAAO,GAAGC,kBAAkB,CAACH,OAAO,CAAC;EAC3C,MAAMI,QAAQ,GAAG,MAAMF,OAAO,CAACJ,KAAK,CAACO,MAAM,EAAEN,SAAS,CAAC;EAEvD,OAAO;IACLM,MAAM,EAAEP,KAAK,CAACO,MAAM;IACpBN,SAAS;AACTK,IAAAA;GACD;AACH;;AC1DO,eAAeE,mBAAmBA,CACvCP,SAAuC,EACvCC,OAAsC,EACH;EACnC,OAAOH,qBAAqB,CAC1BU,IAA6B,EAC7B;IACEC,UAAU,EAAET,SAAS,CAACS,UAAU;IAChCC,SAAS,EAAEV,SAAS,CAACU,SAAS;AAC9BC,IAAAA,UAAU,EAAEX,SAAS,CAACW,UAAU,IAAI;GACrC,EACDV,OACF,CAAC;AACH;AAIA;AACA;AACA;AACA;AACO,SAASW,mBAAmBA,CAACC,KAAoB,EAAE;AACxD,EAAA,oBACEC,cAAA,CAAAC,aAAA,CAACC,eAAe,EAAA,IAAA,eACdF,cAAA,CAAAC,aAAA,CAACE,0CAA0C,EAAKJ,KAAQ,CACzC,CAAC;AAEtB;;;;"}