fontdue-js 2.22.4 → 3.0.0-alpha2

package/dist/components/StripeProvider/index.js

@@ -1,20 +1,11 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _StripeProviderCreateCheckoutSessionMutation2 = _interopRequireDefault(require("../../__generated__/StripeProviderCreateCheckoutSessionMutation.graphql"));
-var _StripeProvider_viewer2 = _interopRequireDefault(require("../../__generated__/StripeProvider_viewer.graphql"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactRelay = require("react-relay");
-var _reactStripeJs = require("@stripe/react-stripe-js");
-var _stripeJs = require("@stripe/stripe-js");
-var _utils = require("../../utils");
-var _ConfigContext = _interopRequireDefault(require("../ConfigContext"));
-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); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+import _StripeProviderCreateCheckoutSessionMutation from "../../__generated__/StripeProviderCreateCheckoutSessionMutation.graphql.js";
+import _StripeProvider_viewer from "../../__generated__/StripeProvider_viewer.graphql.js";
+import React, { useCallback, useContext, useRef } from 'react';
+import { commitMutation, graphql, useFragment, useRelayEnvironment } from 'react-relay';
+import { Elements, EmbeddedCheckoutProvider } from '@stripe/react-stripe-js';
+import { loadStripe } from '@stripe/stripe-js';
+import { parseCustomProperties } from '../../utils.js';
+import ConfigContext from '../ConfigContext.js';
 const StripeProvider = _ref => {
   var _data$currentOrder, _data$settings, _data$settings$uiFont, _data$settings$uiFont2, _data$settings$uiFont3, _data$settings2, _data$currentOrder2, _data$currentOrder2$s, _data$themeConfig;
   let {
@@ -22,19 +13,19 @@ const StripeProvider = _ref => {
     providerType,
     children
   } = _ref;
-  const data = (0, _reactRelay.useFragment)((_StripeProvider_viewer2.default.hash && _StripeProvider_viewer2.default.hash !== "96a569166948f6d2956bdf12dbd2820f" && console.error("The definition of 'StripeProvider_viewer' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _StripeProvider_viewer2.default), viewer);
+  const data = useFragment((_StripeProvider_viewer.hash && _StripeProvider_viewer.hash !== "96a569166948f6d2956bdf12dbd2820f" && console.error("The definition of 'StripeProvider_viewer' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _StripeProvider_viewer), viewer);
   const stripeKey = data.stripePublishableKey;
   // Use order's stripeAccountId if available (handles case where tenant changed accounts mid-checkout)
   const stripeAccount = ((_data$currentOrder = data.currentOrder) === null || _data$currentOrder === void 0 ? void 0 : _data$currentOrder.stripeAccountId) || data.stripeAccountId;
-  const stripePromiseRef = (0, _react.useRef)(stripeKey && stripeAccount ? (0, _stripeJs.loadStripe)(stripeKey, {
+  const stripePromiseRef = useRef(stripeKey && stripeAccount ? loadStripe(stripeKey, {
     stripeAccount
   }) : null);
 
   // All hooks must be called before any conditional returns (React rules of hooks)
-  const environment = (0, _reactRelay.useRelayEnvironment)();
+  const environment = useRelayEnvironment();
   const {
     stripe: config
-  } = (0, _react.useContext)(_ConfigContext.default);
+  } = useContext(ConfigContext);
   let customFontSource;
   const woffSrc = (_data$settings = data.settings) === null || _data$settings === void 0 ? void 0 : (_data$settings$uiFont = _data$settings.uiFontStyle) === null || _data$settings$uiFont === void 0 ? void 0 : (_data$settings$uiFont2 = _data$settings$uiFont.webfontSources) === null || _data$settings$uiFont2 === void 0 ? void 0 : (_data$settings$uiFont3 = _data$settings$uiFont2.find(source => (source === null || source === void 0 ? void 0 : source.format) === 'woff2')) === null || _data$settings$uiFont3 === void 0 ? void 0 : _data$settings$uiFont3.url;
   let fontFamily = (_data$settings2 = data.settings) !== null && _data$settings2 !== void 0 && _data$settings2.uiFontStyle ? `${data.settings.uiFontStyle.cssFamily} ${data.settings.uiFontStyle.name}` : undefined;
@@ -53,11 +44,11 @@ const StripeProvider = _ref => {
     };
   }
   const clientSecret = ((_data$currentOrder2 = data.currentOrder) === null || _data$currentOrder2 === void 0 ? void 0 : (_data$currentOrder2$s = _data$currentOrder2.stripePaymentIntent) === null || _data$currentOrder2$s === void 0 ? void 0 : _data$currentOrder2$s.clientSecret) ?? undefined;
-  const customProperties = (0, _utils.parseCustomProperties)((_data$themeConfig = data.themeConfig) === null || _data$themeConfig === void 0 ? void 0 : _data$themeConfig.customProperties);
-  const fetchClientSecret = (0, _react.useCallback)(() => {
+  const customProperties = parseCustomProperties((_data$themeConfig = data.themeConfig) === null || _data$themeConfig === void 0 ? void 0 : _data$themeConfig.customProperties);
+  const fetchClientSecret = useCallback(() => {
     return new Promise((resolve, reject) => {
-      (0, _reactRelay.commitMutation)(environment, {
-        mutation: (_StripeProviderCreateCheckoutSessionMutation2.default.hash && _StripeProviderCreateCheckoutSessionMutation2.default.hash !== "2ca9a7fcfed1292117e3cd6d0d95cca6" && console.error("The definition of 'StripeProviderCreateCheckoutSessionMutation' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _StripeProviderCreateCheckoutSessionMutation2.default),
+      commitMutation(environment, {
+        mutation: (_StripeProviderCreateCheckoutSessionMutation.hash && _StripeProviderCreateCheckoutSessionMutation.hash !== "2ca9a7fcfed1292117e3cd6d0d95cca6" && console.error("The definition of 'StripeProviderCreateCheckoutSessionMutation' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _StripeProviderCreateCheckoutSessionMutation),
         variables: {},
         onCompleted: response => {
           var _response$createOrder, _response$createOrder2, _response$createOrder3;
@@ -156,7 +147,7 @@ const StripeProvider = _ref => {
     syncAddressCheckbox: 'none'
   };
   if (providerType === 'checkout') {
-    return /*#__PURE__*/_react.default.createElement(_reactStripeJs.EmbeddedCheckoutProvider, {
+    return /*#__PURE__*/React.createElement(EmbeddedCheckoutProvider, {
       stripe: stripePromiseRef.current,
       options: {
         fetchClientSecret
@@ -164,12 +155,11 @@ const StripeProvider = _ref => {
     }, children);
   }
   if (providerType === 'elements') {
-    return /*#__PURE__*/_react.default.createElement(_reactStripeJs.Elements, {
+    return /*#__PURE__*/React.createElement(Elements, {
       stripe: stripePromiseRef.current,
       options: options
     }, children);
   }
   return null;
 };
-var _default = StripeProvider;
-exports.default = _default;
+export default StripeProvider;

package/dist/components/Switch/index.js

@@ -1,7 +1 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = Switch;
-function Switch() {}
+export default function Switch() {}

package/dist/components/TestFontsForm/TestFontsFormElement.js

@@ -1,15 +1,7 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _ = _interopRequireDefault(require("."));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 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); }
-const TestFontsFormElement = props => /*#__PURE__*/_react.default.createElement(_.default, _extends({}, props, {
+import React from 'react';
+import TestFontsFormFetcher from './index.js';
+const TestFontsFormElement = props => /*#__PURE__*/React.createElement(TestFontsFormFetcher, _extends({}, props, {
   newsletterCheckboxChecked: props.newsletterCheckboxChecked === 'true' ? true : false
 }));
-var _default = TestFontsFormElement;
-exports.default = _default;
+export default TestFontsFormElement;

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

@@ -1,12 +1,17 @@
 import React from 'react';
-import { TestFontsForm_Query } from '../../__generated__/TestFontsForm_Query.graphql';
-import { SerializablePreloadedQuery } from '../../relay/loadSerializableQuery';
+import { TestFontsForm_Query } from '../../__generated__/TestFontsForm_Query.graphql.js';
+import { LoadSerializableQueryOptions, SerializablePreloadedQuery } from '../../relay/loadSerializableQuery.js';
 export interface TestFontsForm_props {
     agreementLabel?: string;
     downloadLabel?: string;
     newsletterCheckboxChecked?: boolean;
 }
+export type TestFontsFormPreloadedQuery = SerializablePreloadedQuery<TestFontsForm_Query>;
+export declare function loadTestFontsFormQuery(options?: LoadSerializableQueryOptions): Promise<TestFontsFormPreloadedQuery>;
 export declare function TestFontsFormPreloadedQueryRenderer({ preloadedQuery, ...rest }: TestFontsForm_props & {
-    preloadedQuery: SerializablePreloadedQuery<TestFontsForm_Query>;
+    preloadedQuery: TestFontsFormPreloadedQuery;
 }): React.JSX.Element;
-export default function TestFontsForm(props: TestFontsForm_props): React.JSX.Element;
+export type TestFontsForm_unifiedProps = TestFontsForm_props & {
+    preloadedQuery?: TestFontsFormPreloadedQuery;
+};
+export default function TestFontsForm(props: TestFontsForm_unifiedProps): React.JSX.Element;

package/dist/components/TestFontsForm/index.js

@@ -1,34 +1,28 @@
-"use strict";
 'use client';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TestFontsFormPreloadedQueryRenderer = TestFontsFormPreloadedQueryRenderer;
-exports.default = TestFontsForm;
-var _TestFontsForm_Query2 = _interopRequireDefault(require("../../__generated__/TestFontsForm_Query.graphql"));
-var _TestFontsFormUpdateCustomerMutation2 = _interopRequireDefault(require("../../__generated__/TestFontsFormUpdateCustomerMutation.graphql"));
-var _react = _interopRequireWildcard(require("react"));
-var _reactRelay = require("react-relay");
-var _reactGoogleRecaptcha = _interopRequireDefault(require("react-google-recaptcha"));
-var _TextField = _interopRequireDefault(require("../TextField"));
-var _Icons = require("../Icons");
-var _Checkbox = _interopRequireDefault(require("../Checkbox"));
-var _useSerializablePreloadedQuery = _interopRequireDefault(require("../../relay/useSerializablePreloadedQuery"));
-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); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 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); }
-const updateCustomerMutation = (_TestFontsFormUpdateCustomerMutation2.default.hash && _TestFontsFormUpdateCustomerMutation2.default.hash !== "ba56958399f0893bd667ff02c33a6975" && console.error("The definition of 'TestFontsFormUpdateCustomerMutation' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TestFontsFormUpdateCustomerMutation2.default);
+import _TestFontsForm_Query from "../../__generated__/TestFontsForm_Query.graphql.js";
+import _TestFontsFormUpdateCustomerMutation from "../../__generated__/TestFontsFormUpdateCustomerMutation.graphql.js";
+import React, { useState, useRef, useCallback } from 'react';
+import { commitMutation, graphql, useRelayEnvironment, useLazyLoadQuery, usePreloadedQuery } from 'react-relay';
+import { ReCAPTCHA } from 'react-google-recaptcha';
+import TextField from '../TextField/index.js';
+import { DownloadFonts } from '../Icons/index.js';
+import TestFontsFormQueryNode from '../../__generated__/TestFontsForm_Query.graphql.js';
+import Checkbox from '../Checkbox/index.js';
+import loadSerializableQuery from '../../relay/loadSerializableQuery.js';
+import useSerializablePreloadedQuery from '../../relay/useSerializablePreloadedQuery.js';
+import { EnsureFontdueContext } from '../FontdueContextProvider/index.js';
+const updateCustomerMutation = (_TestFontsFormUpdateCustomerMutation.hash && _TestFontsFormUpdateCustomerMutation.hash !== "ba56958399f0893bd667ff02c33a6975" && console.error("The definition of 'TestFontsFormUpdateCustomerMutation' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TestFontsFormUpdateCustomerMutation);
 const TestFontsDownloading = _ref => {
   let {
     archiveUrl
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", {
     className: "test-fonts__downloading"
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     className: "test-fonts__downloading__icon"
-  }, /*#__PURE__*/_react.default.createElement(_Icons.DownloadFonts, null)), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("p", null, "The download will start automatically."), /*#__PURE__*/_react.default.createElement("p", null, "If it didn\u2019t start, click ", /*#__PURE__*/_react.default.createElement("a", {
+  }, /*#__PURE__*/React.createElement(DownloadFonts, null)), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("p", null, "The download will start automatically."), /*#__PURE__*/React.createElement("p", null, "If it didn\u2019t start, click ", /*#__PURE__*/React.createElement("a", {
     href: archiveUrl
   }, "here"), ".")));
 };
@@ -40,27 +34,27 @@ const TestFontsFormComponent = _ref2 => {
     downloadLabel = 'Download test fonts',
     newsletterCheckboxChecked = false
   } = _ref2;
-  const [email, setEmail] = (0, _react.useState)('');
-  const [name, setName] = (0, _react.useState)('');
-  const [newsletterOptIn, setNewsletterOptIn] = (0, _react.useState)(newsletterCheckboxChecked);
-  const [error, setError] = (0, _react.useState)(null);
-  const [eulaAgreed, setEulaAgreed] = (0, _react.useState)(false);
-  const [eulaFail, setEulaFail] = (0, _react.useState)(false);
-  const [submitting, setSubmitting] = (0, _react.useState)(false);
-  const [submitted, setSubmitted] = (0, _react.useState)(false);
-  const [recaptchaToken, setRecaptchaToken] = (0, _react.useState)(null);
-  const [pendingSubmit, setPendingSubmit] = (0, _react.useState)(false);
-  const downloadForm = (0, _react.useRef)(null);
-  const recaptchaRef = (0, _react.useRef)(null);
-  const environment = (0, _reactRelay.useRelayEnvironment)();
+  const [email, setEmail] = useState('');
+  const [name, setName] = useState('');
+  const [newsletterOptIn, setNewsletterOptIn] = useState(newsletterCheckboxChecked);
+  const [error, setError] = useState(null);
+  const [eulaAgreed, setEulaAgreed] = useState(false);
+  const [eulaFail, setEulaFail] = useState(false);
+  const [submitting, setSubmitting] = useState(false);
+  const [submitted, setSubmitted] = useState(false);
+  const [recaptchaToken, setRecaptchaToken] = useState(null);
+  const [pendingSubmit, setPendingSubmit] = useState(false);
+  const downloadForm = useRef(null);
+  const recaptchaRef = useRef(null);
+  const environment = useRelayEnvironment();
   if (!data.viewer) return null;
   const recaptchaEnabled = ((_data$viewer$settings = data.viewer.settings) === null || _data$viewer$settings === void 0 ? void 0 : _data$viewer$settings.recaptchaEnabled) ?? false;
   const recaptchaSiteKey = (_data$viewer$settings2 = data.viewer.settings) === null || _data$viewer$settings2 === void 0 ? void 0 : _data$viewer$settings2.recaptchaSiteKey;
-  const submitForm = (0, _react.useCallback)(token => {
+  const submitForm = useCallback(token => {
     setSubmitting(true);
     setPendingSubmit(false);
     setError(null);
-    (0, _reactRelay.commitMutation)(environment, {
+    commitMutation(environment, {
       mutation: updateCustomerMutation,
       variables: {
         input: {
@@ -99,14 +93,14 @@ const TestFontsFormComponent = _ref2 => {
       }
     });
   }, [environment, name, email, newsletterOptIn]);
-  const handleRecaptchaChange = (0, _react.useCallback)(token => {
+  const handleRecaptchaChange = useCallback(token => {
     setRecaptchaToken(token);
     // If we were waiting for a token to submit, do it now
     if (token && pendingSubmit) {
       submitForm(token);
     }
   }, [pendingSubmit, submitForm]);
-  const handleRecaptchaExpired = (0, _react.useCallback)(() => {
+  const handleRecaptchaExpired = useCallback(() => {
     setRecaptchaToken(null);
   }, []);
   const handleSubmit = e => {
@@ -133,87 +127,99 @@ const TestFontsFormComponent = _ref2 => {
   const newsletterOptInLabel = settings === null || settings === void 0 ? void 0 : settings.newsletterOptInLabel;
   const eulaAgreementLabel = settings === null || settings === void 0 ? void 0 : settings.eulaAgreementLabel;
   const archiveUrl = (_data$viewer$testFont = data.viewer.testFonts) === null || _data$viewer$testFont === void 0 ? void 0 : _data$viewer$testFont.archiveUrl;
-  return /*#__PURE__*/_react.default.createElement("div", {
+  return /*#__PURE__*/React.createElement("div", {
     className: "test-fonts"
-  }, error && /*#__PURE__*/_react.default.createElement("div", {
+  }, error && /*#__PURE__*/React.createElement("div", {
     className: "test-fonts__errors"
-  }, error), submitted ? /*#__PURE__*/_react.default.createElement(TestFontsDownloading, {
+  }, error), submitted ? /*#__PURE__*/React.createElement(TestFontsDownloading, {
     archiveUrl: archiveUrl
-  }) : /*#__PURE__*/_react.default.createElement("form", {
+  }) : /*#__PURE__*/React.createElement("form", {
     className: "test-fonts__form",
     onSubmit: handleSubmit
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     className: "test-fonts__section"
-  }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
+  }, /*#__PURE__*/React.createElement(TextField, {
     label: "Name *",
     value: name,
     onChange: value => setName(value),
     autocomplete: "name",
     placeholder: "Your name"
-  })), /*#__PURE__*/_react.default.createElement("div", {
+  })), /*#__PURE__*/React.createElement("div", {
     className: "test-fonts__section"
-  }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
+  }, /*#__PURE__*/React.createElement(TextField, {
     label: "Email *",
     type: "email",
     value: email,
     onChange: value => setEmail(value),
     autocomplete: "email",
     placeholder: "Your email"
-  })), /*#__PURE__*/_react.default.createElement("div", {
+  })), /*#__PURE__*/React.createElement("div", {
     className: "test-fonts__agreement test-fonts__checkbox-field",
     "data-highlighted": eulaFail && !eulaAgreed
-  }, /*#__PURE__*/_react.default.createElement(_Checkbox.default, {
+  }, /*#__PURE__*/React.createElement(Checkbox, {
     id: "test-fonts-eula-agreement",
     checked: eulaAgreed,
     onChange: event => setEulaAgreed(event.target.checked)
-  }), /*#__PURE__*/_react.default.createElement("label", {
+  }), /*#__PURE__*/React.createElement("label", {
     htmlFor: "test-fonts-eula-agreement",
     dangerouslySetInnerHTML: {
       __html: (agreementLabel || eulaAgreementLabel) ?? ''
     }
-  })), newsletterOptInLabel && /*#__PURE__*/_react.default.createElement("div", {
+  })), newsletterOptInLabel && /*#__PURE__*/React.createElement("div", {
     className: "test-fonts__newsletter-opt-in test-fonts__checkbox-field"
-  }, /*#__PURE__*/_react.default.createElement(_Checkbox.default, {
+  }, /*#__PURE__*/React.createElement(Checkbox, {
     id: "newsletter-opt-in",
     checked: newsletterOptIn,
     onChange: event => setNewsletterOptIn(event.target.checked)
-  }), /*#__PURE__*/_react.default.createElement("label", {
+  }), /*#__PURE__*/React.createElement("label", {
     htmlFor: "newsletter-opt-in",
     dangerouslySetInnerHTML: {
       __html: newsletterOptInLabel
     }
-  })), recaptchaEnabled && recaptchaSiteKey && /*#__PURE__*/_react.default.createElement(_reactGoogleRecaptcha.default, {
+  })), recaptchaEnabled && recaptchaSiteKey && /*#__PURE__*/React.createElement(ReCAPTCHA, {
     ref: recaptchaRef,
     sitekey: recaptchaSiteKey,
     size: "invisible",
     onChange: handleRecaptchaChange,
     onExpired: handleRecaptchaExpired
-  }), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("button", {
+  }), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("button", {
     className: "submit-button",
     type: "submit",
     disabled: submitting || pendingSubmit || disabled
-  }, submitting || pendingSubmit ? 'Submitting...' : downloadLabel, /*#__PURE__*/_react.default.createElement("span", {
+  }, submitting || pendingSubmit ? 'Submitting...' : downloadLabel, /*#__PURE__*/React.createElement("span", {
     className: "submit-button__arrow"
-  }, " \u2192")))), /*#__PURE__*/_react.default.createElement("form", {
+  }, " \u2192")))), /*#__PURE__*/React.createElement("form", {
     action: archiveUrl ?? undefined,
     ref: downloadForm
   }));
 };
-const query = (_TestFontsForm_Query2.default.hash && _TestFontsForm_Query2.default.hash !== "cd43f0cacc4dcf01cf94fb1ff97197ca" && console.error("The definition of 'TestFontsForm_Query' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TestFontsForm_Query2.default);
-function TestFontsFormPreloadedQueryRenderer(_ref4) {
+const query = (_TestFontsForm_Query.hash && _TestFontsForm_Query.hash !== "cd43f0cacc4dcf01cf94fb1ff97197ca" && console.error("The definition of 'TestFontsForm_Query' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TestFontsForm_Query);
+export async function loadTestFontsFormQuery(options) {
+  return loadSerializableQuery(TestFontsFormQueryNode, {}, options);
+}
+export function TestFontsFormPreloadedQueryRenderer(_ref4) {
   let {
     preloadedQuery,
     ...rest
   } = _ref4;
-  const queryRef = (0, _useSerializablePreloadedQuery.default)(preloadedQuery);
-  const data = (0, _reactRelay.usePreloadedQuery)(query, queryRef);
-  return /*#__PURE__*/_react.default.createElement(TestFontsFormComponent, _extends({
+  const queryRef = useSerializablePreloadedQuery(preloadedQuery);
+  const data = usePreloadedQuery(query, queryRef);
+  return /*#__PURE__*/React.createElement(TestFontsFormComponent, _extends({
     data: data
   }, rest));
 }
-function TestFontsForm(props) {
-  const data = (0, _reactRelay.useLazyLoadQuery)(query, {});
-  return /*#__PURE__*/_react.default.createElement(TestFontsFormComponent, _extends({
+function TestFontsFormLazyQueryRenderer(props) {
+  const data = useLazyLoadQuery(query, {});
+  return /*#__PURE__*/React.createElement(TestFontsFormComponent, _extends({
     data: data
   }, props));
+}
+// Unified TestFontsForm entry. Accepts an optional preloaded query
+// (server-side preload path) or fetches lazily on mount. `EnsureFontdueContext`
+// only self-wraps with `FontdueContextProvider` when no parent Fontdue
+// context is present.
+export default function TestFontsForm(props) {
+  return /*#__PURE__*/React.createElement(EnsureFontdueContext, null, props.preloadedQuery ? /*#__PURE__*/React.createElement(TestFontsFormPreloadedQueryRenderer, _extends({}, props, {
+    preloadedQuery: props.preloadedQuery
+  })) : /*#__PURE__*/React.createElement(TestFontsFormLazyQueryRenderer, props));
 }

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

@@ -1,3 +1,3 @@
 import React from 'react';
-import { TestFontsForm_props } from './index';
+import { TestFontsForm_props } from './index.js';
 export default function TestFontsForm(props: TestFontsForm_props): Promise<React.JSX.Element>;

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

@@ -1,18 +1,16 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = TestFontsForm;
-var _react = _interopRequireDefault(require("react"));
-var _loadSerializableQuery = _interopRequireDefault(require("../../relay/loadSerializableQuery"));
-var _index = require("./index");
-var _TestFontsForm_Query = _interopRequireDefault(require("../../__generated__/TestFontsForm_Query.graphql"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 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); }
-async function TestFontsForm(props) {
-  const preloadedQuery = await (0, _loadSerializableQuery.default)(_TestFontsForm_Query.default, {});
-  return /*#__PURE__*/_react.default.createElement(_index.TestFontsFormPreloadedQueryRenderer, _extends({
+import React from 'react';
+import loadSerializableQuery from '../../relay/loadSerializableQuery.js';
+import { TestFontsFormPreloadedQueryRenderer } from './index.js';
+import TestFontsFormQueryNode from '../../__generated__/TestFontsForm_Query.graphql.js';
+
+// Next RSC variant: awaits the query on the server and hands the response to
+// the client `TestFontsFormPreloadedQueryRenderer`. Lets pages just write
+// `<TestFontsForm />` in an RSC without manually invoking
+// `loadTestFontsFormQuery` + threading `preloadedQuery` through props.
+export default async function TestFontsForm(props) {
+  const preloadedQuery = await loadSerializableQuery(TestFontsFormQueryNode, {});
+  return /*#__PURE__*/React.createElement(TestFontsFormPreloadedQueryRenderer, _extends({
     preloadedQuery: preloadedQuery
   }, props));
 }

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

@@ -1,2 +1,5 @@
 import React from 'react';
-export default function TestModeBanner(): React.JSX.Element;
+import type { TestModeBanner_viewer$key } from '../../__generated__/TestModeBanner_viewer.graphql.js';
+export default function TestModeBanner({ viewer }: {
+    viewer: TestModeBanner_viewer$key;
+}): React.JSX.Element | null;

package/dist/components/TestModeBanner/index.js

@@ -1,36 +1,22 @@
-"use strict";
 'use client';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = TestModeBanner;
-var _TestModeBannerQuery2 = _interopRequireDefault(require("../../__generated__/TestModeBannerQuery.graphql"));
-var _react = _interopRequireDefault(require("react"));
-var _reactRelay = require("react-relay");
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-function TestModeBannerComponent(_ref) {
-  var _data$viewer, _data$viewer$testMode;
+import _TestModeBanner_viewer from "../../__generated__/TestModeBanner_viewer.graphql.js";
+import React from 'react';
+import { graphql, useFragment } from 'react-relay';
+const fragment = (_TestModeBanner_viewer.hash && _TestModeBanner_viewer.hash !== "f6b2f851466be9599d63ebf8f39e1a96" && console.error("The definition of 'TestModeBanner_viewer' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TestModeBanner_viewer);
+export default function TestModeBanner(_ref) {
+  var _data$testMode;
   let {
-    data
+    viewer
   } = _ref;
-  const isActive = data === null || data === void 0 ? void 0 : (_data$viewer = data.viewer) === null || _data$viewer === void 0 ? void 0 : (_data$viewer$testMode = _data$viewer.testMode) === null || _data$viewer$testMode === void 0 ? void 0 : _data$viewer$testMode.isActive;
-
-  // hide the banner completely if we're in live mode
-  if (!isActive) return null;
-  return /*#__PURE__*/_react.default.createElement("div", {
+  const data = useFragment(fragment, viewer);
+  if (!((_data$testMode = data.testMode) !== null && _data$testMode !== void 0 && _data$testMode.isActive)) return null;
+  return /*#__PURE__*/React.createElement("div", {
     className: "test-mode-banner__banner",
-    "data-test-mode": isActive
-  }, /*#__PURE__*/_react.default.createElement("div", {
+    "data-test-mode": true
+  }, /*#__PURE__*/React.createElement("div", {
     className: "test-mode-banner__content"
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     className: "test-mode-banner__title"
   }, "Viewing test data")));
-}
-const query = (_TestModeBannerQuery2.default.hash && _TestModeBannerQuery2.default.hash !== "60ad67ee88ec6b74dd04bdf5572e7faf" && console.error("The definition of 'TestModeBannerQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _TestModeBannerQuery2.default);
-function TestModeBanner() {
-  const data = (0, _reactRelay.useLazyLoadQuery)(query, {});
-  return /*#__PURE__*/_react.default.createElement(TestModeBannerComponent, {
-    data: data
-  });
 }

package/dist/components/TextField/index.js

@@ -1,12 +1,5 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 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 React from 'react';
 const TextField = _ref => {
   let {
     Component = 'input',
@@ -19,27 +12,26 @@ const TextField = _ref => {
     prefix,
     ...rest
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement("label", {
+  return /*#__PURE__*/React.createElement("label", {
     className: "text-field__label",
     "data-has-error": errors ? true : undefined
-  }, /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/React.createElement("div", {
     className: "text-field__label-wrapper"
-  }, label), /*#__PURE__*/_react.default.createElement("div", {
+  }, label), /*#__PURE__*/React.createElement("div", {
     className: "text-field__input-wrapper"
-  }, /*#__PURE__*/_react.default.createElement("span", {
+  }, /*#__PURE__*/React.createElement("span", {
     className: "text-field__prefix"
-  }, prefix), Component === 'input' && /*#__PURE__*/_react.default.createElement("input", _extends({}, rest, {
+  }, prefix), Component === 'input' && /*#__PURE__*/React.createElement("input", _extends({}, rest, {
     type: type,
     onChange: e => onChange(e.target.value),
     className: "text-field__input",
     autoComplete: autocomplete
-  })), Component === 'textarea' && /*#__PURE__*/_react.default.createElement("textarea", _extends({}, rest, {
+  })), Component === 'textarea' && /*#__PURE__*/React.createElement("textarea", _extends({}, rest, {
     onChange: e => onChange(e.target.value),
     className: "text-field__input",
     autoComplete: autocomplete
-  }))), errors && errors.length > 0 && /*#__PURE__*/_react.default.createElement("p", {
+  }))), errors && errors.length > 0 && /*#__PURE__*/React.createElement("p", {
     className: "text-field__error"
   }, errors[0]));
 };
-var _default = TextField;
-exports.default = _default;
+export default TextField;

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

@@ -1,7 +1,5 @@
 import React from 'react';
-import { ThemeConfigQuery } from '../../__generated__/ThemeConfigQuery.graphql';
-import { SerializablePreloadedQuery } from '../../relay/loadSerializableQuery';
-export declare function ThemeConfigPreloadedQueryRenderer({ preloadedQuery, }: {
-    preloadedQuery: SerializablePreloadedQuery<ThemeConfigQuery>;
+import type { ThemeConfig_viewer$key } from '../../__generated__/ThemeConfig_viewer.graphql.js';
+export default function ThemeConfig({ viewer }: {
+    viewer: ThemeConfig_viewer$key;
 }): React.JSX.Element;
-export default function ThemeConfig(): React.JSX.Element;

package/dist/components/ThemeConfig/index.js

@@ -1,44 +1,20 @@
-"use strict";
 'use client';
 
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.ThemeConfigPreloadedQueryRenderer = ThemeConfigPreloadedQueryRenderer;
-exports.default = ThemeConfig;
-var _ThemeConfigQuery2 = _interopRequireDefault(require("../../__generated__/ThemeConfigQuery.graphql"));
-var _react = _interopRequireDefault(require("react"));
-var _reactRelay = require("react-relay");
-var _useSerializablePreloadedQuery = _interopRequireDefault(require("../../relay/useSerializablePreloadedQuery"));
-function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
-// gets the custom properties entered by users in the admin panel,
-// which also includes default values. we put the defaults there instead of
-// every call to var() so that we have defaults all in one place
+import _ThemeConfig_viewer from "../../__generated__/ThemeConfig_viewer.graphql.js";
+import React from 'react';
+import { graphql, useFragment } from 'react-relay';
+const fragment = (_ThemeConfig_viewer.hash && _ThemeConfig_viewer.hash !== "191db4fda0651cd596efa7f91699f895" && console.error("The definition of 'ThemeConfig_viewer' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _ThemeConfig_viewer);
 
-function ThemeConfigComponent(_ref) {
-  var _data$viewer$themeCon;
+// Renders custom properties entered by tenant admins (with library defaults)
+// as a single :root style block so var(...) lookups resolve everywhere.
+export default function ThemeConfig(_ref) {
+  var _data$themeConfig;
   let {
-    data
+    viewer
   } = _ref;
-  const props = ((_data$viewer$themeCon = data.viewer.themeConfig) === null || _data$viewer$themeCon === void 0 ? void 0 : _data$viewer$themeCon.customProperties) ?? [];
-  return /*#__PURE__*/_react.default.createElement("style", {
+  const data = useFragment(fragment, viewer);
+  const props = ((_data$themeConfig = data.themeConfig) === null || _data$themeConfig === void 0 ? void 0 : _data$themeConfig.customProperties) ?? [];
+  return /*#__PURE__*/React.createElement("style", {
     type: "text/css"
   }, `:root { ${props.join(';')} }`);
-}
-const query = (_ThemeConfigQuery2.default.hash && _ThemeConfigQuery2.default.hash !== "c259bee038c4d2ea14c758fba3381f57" && console.error("The definition of 'ThemeConfigQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _ThemeConfigQuery2.default);
-function ThemeConfigPreloadedQueryRenderer(_ref2) {
-  let {
-    preloadedQuery
-  } = _ref2;
-  const queryRef = (0, _useSerializablePreloadedQuery.default)(preloadedQuery);
-  const data = (0, _reactRelay.usePreloadedQuery)(query, queryRef);
-  return /*#__PURE__*/_react.default.createElement(ThemeConfigComponent, {
-    data: data
-  });
-}
-function ThemeConfig() {
-  const data = (0, _reactRelay.useLazyLoadQuery)(query, {});
-  return /*#__PURE__*/_react.default.createElement(ThemeConfigComponent, {
-    data: data
-  });
 }