fontdue-js 2.19.1 → 2.20.0

package/dist/components/ConsentBanner/consent.js

@@ -0,0 +1,93 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.activateScripts = activateScripts;
+exports.getClientAnonymousId = getClientAnonymousId;
+exports.hasConsent = hasConsent;
+exports.onConsent = onConsent;
+exports.setClientAnonymousId = setClientAnonymousId;
+exports.setConsent = setConsent;
+const CONSENT_COOKIE = '_fontdue_cc';
+const CONSENT_EVENT = 'fontdue:consent';
+const MAX_AGE = 60 * 60 * 24 * 365; // 1 year
+
+/** Store the client-generated anonymous_id so it can be sent with consent events. */
+let clientAnonymousId;
+function setClientAnonymousId(id) {
+  clientAnonymousId = id;
+}
+function getClientAnonymousId() {
+  return clientAnonymousId;
+}
+
+/** Parse the _fontdue_cc cookie and check if it contains the given category. */
+function hasConsent(category) {
+  const match = document.cookie.match(new RegExp('(?:^|;\\s*)' + CONSENT_COOKIE + '=([^;]*)'));
+  if (!match) return false;
+  return match[1].split(',').includes(category);
+}
+
+/** Set the _fontdue_cc cookie with the given categories. */
+function setConsent(categories) {
+  document.cookie = CONSENT_COOKIE + '=' + categories.join(',') + ';path=/;max-age=' + MAX_AGE + ';SameSite=Lax;Secure';
+  window.dispatchEvent(new CustomEvent(CONSENT_EVENT, {
+    detail: {
+      categories
+    }
+  }));
+}
+
+/**
+ * Call callback when the given consent category is granted.
+ * If already granted, calls immediately. Otherwise polls (500ms) and
+ * listens for the fontdue:consent event. Returns a cleanup function.
+ */
+function onConsent(category, callback) {
+  if (hasConsent(category)) {
+    callback();
+    return () => {};
+  }
+  let called = false;
+  const check = () => {
+    if (!called && hasConsent(category)) {
+      called = true;
+      callback();
+      cleanup();
+    }
+  };
+  const interval = setInterval(check, 500);
+  window.addEventListener(CONSENT_EVENT, check);
+  const cleanup = () => {
+    clearInterval(interval);
+    window.removeEventListener(CONSENT_EVENT, check);
+  };
+  return cleanup;
+}
+
+/**
+ * Activate blocked scripts for the given consent category.
+ * Finds all <script type="text/plain" data-consent-category="<category>">
+ * elements and replaces them with executable copies.
+ */
+function activateScripts(category) {
+  const scripts = document.querySelectorAll(`script[type="text/plain"][data-consent-category="${category}"]`);
+  scripts.forEach(blocked => {
+    var _blocked$parentNode;
+    const script = document.createElement('script');
+
+    // Copy all attributes except type and data-consent-category
+    for (const attr of Array.from(blocked.attributes)) {
+      if (attr.name !== 'type' && attr.name !== 'data-consent-category') {
+        script.setAttribute(attr.name, attr.value);
+      }
+    }
+
+    // Copy inline content
+    if (blocked.textContent) {
+      script.textContent = blocked.textContent;
+    }
+    (_blocked$parentNode = blocked.parentNode) === null || _blocked$parentNode === void 0 ? void 0 : _blocked$parentNode.replaceChild(script, blocked);
+  });
+}

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

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const ConsentBanner: () => React.JSX.Element | null;
+export default ConsentBanner;

package/dist/components/ConsentBanner/index.js

@@ -0,0 +1,84 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _ConfigContext = _interopRequireDefault(require("../ConfigContext"));
+var _UrlContext = require("../UrlContext");
+var _consent = require("./consent");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+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; }
+const DEFAULT_MESSAGE = 'We use cookies to analyze site usage and improve your\u00A0experience.';
+const ConsentBanner = () => {
+  const config = (0, _react.useContext)(_ConfigContext.default);
+  const url = (0, _UrlContext.useFontdueUrl)();
+
+  // Start dismissed to avoid hydration mismatch (server has no document.cookie).
+  // Check on the client in useEffect.
+  const [dismissed, setDismissed] = (0, _react.useState)(true);
+  (0, _react.useEffect)(() => {
+    if (!config.tracking.consentRequired) return;
+    if (!document.cookie.includes('_fontdue_cc=')) {
+      setDismissed(false);
+    }
+  }, [config.tracking.consentRequired]);
+  if (dismissed) return null;
+  const message = config.tracking.consentMessage || DEFAULT_MESSAGE;
+  const sendConsentEvent = categories => {
+    // Fire a tracking event so the server sets the _fontdue_state cookie
+    // on this response (rather than waiting for the next page load).
+    // Include the client anonymous_id so it gets synced to the cookie.
+    const body = {
+      event: 'Consent Granted',
+      properties: {
+        categories: categories.join(',')
+      }
+    };
+    const anonId = (0, _consent.getClientAnonymousId)();
+    if (anonId) body.anonymous_id = anonId;
+    fetch(`${url}/api/track`, {
+      method: 'POST',
+      headers: {
+        'Content-Type': 'application/json'
+      },
+      credentials: 'include',
+      body: JSON.stringify(body)
+    }).catch(() => {});
+  };
+  const handleAcceptAll = () => {
+    (0, _consent.setConsent)(['necessary', 'analytics']);
+    (0, _consent.activateScripts)('analytics');
+    if (config.tracking.enabled) {
+      sendConsentEvent(['necessary', 'analytics']);
+    }
+    setDismissed(true);
+  };
+  const handleReject = () => {
+    (0, _consent.setConsent)(['necessary']);
+    setDismissed(true);
+  };
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "fontdue-consent-banner",
+    role: "region",
+    "aria-label": "Cookie consent"
+  }, /*#__PURE__*/_react.default.createElement("div", {
+    className: "fontdue-consent-banner__container"
+  }, /*#__PURE__*/_react.default.createElement("p", {
+    className: "fontdue-consent-banner__message"
+  }, message), /*#__PURE__*/_react.default.createElement("div", {
+    className: "fontdue-consent-banner__actions"
+  }, /*#__PURE__*/_react.default.createElement("button", {
+    type: "button",
+    className: "fontdue-consent-banner__button fontdue-consent-banner__button--secondary",
+    onClick: handleReject
+  }, "Necessary only"), /*#__PURE__*/_react.default.createElement("button", {
+    type: "button",
+    className: "fontdue-consent-banner__button fontdue-consent-banner__button--primary",
+    onClick: handleAcceptAll
+  }, "Accept all"))));
+};
+var _default = ConsentBanner;
+exports.default = _default;

package/dist/components/Family/index.js

@@ -12,7 +12,6 @@ var _SelectButton = _interopRequireDefault(require("../SelectButton"));
 var _SKUPrice = _interopRequireDefault(require("../SKUPrice"));
 var _Price = require("../Price");
 var _FamilyList = _interopRequireDefault(require("./FamilyList"));
-var _Stylesheet = _interopRequireDefault(require("../Stylesheet"));
 var _reducer = require("../../reducer");
 var _utils = require("../../utils");
 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); }
@@ -24,7 +23,7 @@ function Family(_ref) {
     node: nodeKey,
     size
   } = _ref;
-  const node = (0, _reactRelay.useFragment)((_Family_node2.default.hash && _Family_node2.default.hash !== "da6c597ec8c8b1672cb1596281a7fc2a" && console.error("The definition of 'Family_node' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _Family_node2.default), nodeKey);
+  const node = (0, _reactRelay.useFragment)((_Family_node2.default.hash && _Family_node2.default.hash !== "5c49167e8bf2458ab72604ff960636b2" && console.error("The definition of 'Family_node' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _Family_node2.default), nodeKey);
   const precartOpen = (0, _reactRedux.useSelector)(state => state.precartOpen);
   const selector = node.sku ? (0, _reducer.isSelected)(node.sku.id) : () => false;
   const selected = (0, _reactRedux.useSelector)(selector);
@@ -35,9 +34,7 @@ function Family(_ref) {
     "data-size": size,
     "data-selected": selected,
     "data-buy-button-hovered": buyButtonIsHovered
-  }, /*#__PURE__*/_react.default.createElement(_Stylesheet.default, {
-    href: node.cssUrl
-  }), /*#__PURE__*/_react.default.createElement("div", {
+  }, /*#__PURE__*/_react.default.createElement("div", {
     className: "font-family-block__wrapper"
   }, node.sku && /*#__PURE__*/_react.default.createElement("div", {
     className: "font-family-block__select-button"

package/dist/components/FontStyle/index.js

@@ -17,18 +17,12 @@ function FontStyle(_ref) {
     children,
     ...rest
   } = _ref;
-  const fontStyle = (0, _reactRelay.useFragment)((_FontStyle_fontStyle2.default.hash && _FontStyle_fontStyle2.default.hash !== "c745ef2ecf5b7f3d0793bea2024d1e69" && console.error("The definition of 'FontStyle_fontStyle' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _FontStyle_fontStyle2.default), fontStyleKey);
-  const {
-    cssFamily,
-    name
-  } = fontStyle;
+  const fontStyle = (0, _reactRelay.useFragment)((_FontStyle_fontStyle2.default.hash && _FontStyle_fontStyle2.default.hash !== "7891603bea1a3e40f40297bf1697eb3c" && console.error("The definition of 'FontStyle_fontStyle' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _FontStyle_fontStyle2.default), fontStyleKey);
   const {
     style: fontStyleStyle,
     loaded
   } = (0, _useFontStyle.default)({
-    fontFamily: `${cssFamily} ${name}`,
-    fontWeight: '400',
-    fontStyle: 'normal'
+    fontStyle
   });
   const renderProps = {
     ...rest,

package/dist/components/FontdueProvider/FontdueProviderClientComponent.js

@@ -6,15 +6,20 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = FontdueProviderClientComponent;
 var _react = _interopRequireWildcard(require("react"));
+var _reactErrorBoundary = require("react-error-boundary");
 var _reactRedux = require("react-redux");
 var _reactRelay = require("react-relay");
 var _environment = require("../../relay/environment");
 var _ConfigContext = _interopRequireWildcard(require("../ConfigContext"));
 var _reducer = require("../../reducer");
 var _ComponentsContext = _interopRequireDefault(require("../ComponentsContext"));
+var _UrlContext = _interopRequireDefault(require("../UrlContext"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 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; }
+const ConsentBanner = /*#__PURE__*/(0, _react.lazy)(() => Promise.resolve().then(() => _interopRequireWildcard(require('../ConsentBanner'))));
+const Tracking = /*#__PURE__*/(0, _react.lazy)(() => Promise.resolve().then(() => _interopRequireWildcard(require('../Tracking'))));
+const ServerConfigProvider = /*#__PURE__*/(0, _react.lazy)(() => Promise.resolve().then(() => _interopRequireWildcard(require('../ServerConfigProvider'))));
 function FontdueProviderClientComponent(_ref) {
   let {
     children,
@@ -38,7 +43,15 @@ function FontdueProviderClientComponent(_ref) {
     fallback: null
   }, /*#__PURE__*/_react.default.createElement(_ConfigContext.default.Provider, {
     value: configValue
+  }, /*#__PURE__*/_react.default.createElement(_UrlContext.default.Provider, {
+    value: url ?? (typeof process !== 'undefined' ? process.env.NEXT_PUBLIC_FONTDUE_URL : undefined) ?? ''
   }, /*#__PURE__*/_react.default.createElement(_ComponentsContext.default.Provider, {
     value: components ?? {}
-  }, children)))));
+  }, children, /*#__PURE__*/_react.default.createElement(_reactErrorBoundary.ErrorBoundary, {
+    fallback: null
+  }, /*#__PURE__*/_react.default.createElement(_react.Suspense, {
+    fallback: null
+  }, /*#__PURE__*/_react.default.createElement(ServerConfigProvider, {
+    codeConfig: config
+  }, /*#__PURE__*/_react.default.createElement(ConsentBanner, null), /*#__PURE__*/_react.default.createElement(Tracking, null))))))))));
 }

package/dist/components/FontdueProvider/index.js

@@ -5,7 +5,6 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 var _react = _interopRequireDefault(require("react"));
-var _Stylesheet = require("../Stylesheet");
 var _TestModeBanner = _interopRequireDefault(require("../TestModeBanner"));
 var _ThemeConfig = _interopRequireDefault(require("../ThemeConfig"));
 var _FontdueProviderClientComponent = _interopRequireDefault(require("./FontdueProviderClientComponent"));
@@ -15,7 +14,7 @@ const FontdueProvider = _ref => {
     children,
     ...rest
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement(_FontdueProviderClientComponent.default, rest, /*#__PURE__*/_react.default.createElement(_Stylesheet.StylesheetContainer, null), /*#__PURE__*/_react.default.createElement(_TestModeBanner.default, null), /*#__PURE__*/_react.default.createElement(_ThemeConfig.default, null), children);
+  return /*#__PURE__*/_react.default.createElement(_FontdueProviderClientComponent.default, rest, /*#__PURE__*/_react.default.createElement(_TestModeBanner.default, null), /*#__PURE__*/_react.default.createElement(_ThemeConfig.default, null), children);
 };
 var _default = FontdueProvider;
 exports.default = _default;

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

@@ -11,7 +11,6 @@ Object.defineProperty(exports, "FontdueProvider_props", {
 });
 exports.default = FontdueProvider;
 var _react = _interopRequireDefault(require("react"));
-var _Stylesheet = require("../Stylesheet");
 var _TestModeBanner = _interopRequireDefault(require("../TestModeBanner"));
 var _index = _interopRequireDefault(require("../ThemeConfig/index.server"));
 var _FontdueProviderClientComponent = _interopRequireWildcard(require("./FontdueProviderClientComponent"));
@@ -23,5 +22,5 @@ async function FontdueProvider(_ref) {
     children,
     ...rest
   } = _ref;
-  return /*#__PURE__*/_react.default.createElement(_FontdueProviderClientComponent.default, rest, /*#__PURE__*/_react.default.createElement(_Stylesheet.StylesheetContainer, null), /*#__PURE__*/_react.default.createElement(_TestModeBanner.default, null), /*#__PURE__*/_react.default.createElement(_index.default, null), children);
+  return /*#__PURE__*/_react.default.createElement(_FontdueProviderClientComponent.default, rest, /*#__PURE__*/_react.default.createElement(_TestModeBanner.default, null), /*#__PURE__*/_react.default.createElement(_index.default, null), children);
 }

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

@@ -0,0 +1,8 @@
+import React from 'react';
+import { Config } from '../ConfigContext';
+interface Props {
+    codeConfig?: Config;
+    children: React.ReactNode;
+}
+declare const ServerConfigProvider: ({ codeConfig, children }: Props) => React.JSX.Element;
+export default ServerConfigProvider;

package/dist/components/ServerConfigProvider/index.js

@@ -0,0 +1,41 @@
+"use strict";
+'use client';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _ServerConfigProviderQuery2 = _interopRequireDefault(require("../../__generated__/ServerConfigProviderQuery.graphql"));
+var _react = _interopRequireDefault(require("react"));
+var _reactRelay = require("react-relay");
+var _ConfigContext = _interopRequireWildcard(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 }; }
+const query = (_ServerConfigProviderQuery2.default.hash && _ServerConfigProviderQuery2.default.hash !== "b20ad9bdada6a425ee660a8662a78840" && console.error("The definition of 'ServerConfigProviderQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _ServerConfigProviderQuery2.default);
+const ServerConfigProvider = _ref => {
+  var _data$viewer, _data$viewer$fontdueC;
+  let {
+    codeConfig,
+    children
+  } = _ref;
+  const data = (0, _reactRelay.useLazyLoadQuery)(query, {});
+  const tracking = (_data$viewer = data.viewer) === null || _data$viewer === void 0 ? void 0 : (_data$viewer$fontdueC = _data$viewer.fontdueConfig) === null || _data$viewer$fontdueC === void 0 ? void 0 : _data$viewer$fontdueC.tracking;
+
+  // Server config is the base; code config overrides.
+  const merged = {
+    ...codeConfig,
+    tracking: {
+      enabled: tracking === null || tracking === void 0 ? void 0 : tracking.enabled,
+      consentRequired: tracking === null || tracking === void 0 ? void 0 : tracking.consentRequired,
+      consentMessage: (tracking === null || tracking === void 0 ? void 0 : tracking.consentMessage) ?? undefined,
+      ...(codeConfig === null || codeConfig === void 0 ? void 0 : codeConfig.tracking)
+    }
+  };
+  const configValue = (0, _ConfigContext.makeConfig)(merged);
+  return /*#__PURE__*/_react.default.createElement(_ConfigContext.default.Provider, {
+    value: configValue
+  }, children);
+};
+var _default = ServerConfigProvider;
+exports.default = _default;

package/dist/components/StoreModal/StoreModalContainer.js

@@ -9,9 +9,9 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactRedux = require("react-redux");
 var _StoreModalContainer = _interopRequireDefault(require("../elements/StoreModalContainer"));
 var _reactRelay = require("react-relay");
-var _relayRuntime = require("relay-runtime");
 var _StoreModalCheckoutContext = _interopRequireDefault(require("./StoreModalCheckoutContext"));
 var _CheckoutSteps = _interopRequireDefault(require("../Cart/CheckoutSteps"));
+var _useFontStyle = _interopRequireDefault(require("../useFontStyle"));
 var _StoreModalLoadingScreen = _interopRequireDefault(require("../elements/StoreModalLoadingScreen"));
 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); }
@@ -37,24 +37,20 @@ const getBackLink = (history, currentRoute) => {
   if (!previous) return null;
   return getPageTitle(previous.name);
 };
-function getFontData(fontStyle) {
-  if (!fontStyle) return null;
-  const {
-    name,
-    cssFamily,
-    family
-  } = fontStyle;
-  return {
-    name: `${cssFamily} ${name}`,
-    cssUrl: (family === null || family === void 0 ? void 0 : family.cssUrl) ?? null
-  };
-}
 const StoreModalContainer = _ref => {
-  var _currentOrder, _currentOrder$orderIt, _settings, _settings2;
+  var _settings, _settings2, _currentOrder, _currentOrder$orderIt;
   let {
     children
   } = _ref;
-  const data = (0, _reactRelay.useLazyLoadQuery)((_StoreModalContainerQuery2.default.hash && _StoreModalContainerQuery2.default.hash !== "dd4757b9238f5ae8689c7191b4abe64c" && console.error("The definition of 'StoreModalContainerQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _StoreModalContainerQuery2.default), {});
+  const data = (0, _reactRelay.useLazyLoadQuery)((_StoreModalContainerQuery2.default.hash && _StoreModalContainerQuery2.default.hash !== "ae784b9ab1842dacc5857b045b399701" && console.error("The definition of 'StoreModalContainerQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _StoreModalContainerQuery2.default), {});
+  const uiFontStyle = (_settings = data.viewer.settings) === null || _settings === void 0 ? void 0 : _settings.uiFontStyle;
+  const uiFontStyleBold = (_settings2 = data.viewer.settings) === null || _settings2 === void 0 ? void 0 : _settings2.uiFontStyleBold;
+  (0, _useFontStyle.default)({
+    fontStyle: uiFontStyle
+  });
+  (0, _useFontStyle.default)({
+    fontStyle: uiFontStyleBold
+  });
   const dispatch = (0, _reactRedux.useDispatch)();
   const orderItemCount = ((_currentOrder = data.viewer.currentOrder) === null || _currentOrder === void 0 ? void 0 : (_currentOrder$orderIt = _currentOrder.orderItems) === null || _currentOrder$orderIt === void 0 ? void 0 : _currentOrder$orderIt.length) ?? 0;
   const showCartButton = orderItemCount > 0;
@@ -90,6 +86,8 @@ const StoreModalContainer = _ref => {
   };
   const [checkoutStep, setCheckoutStep] = (0, _react.useState)(_CheckoutSteps.default.Customer);
   const [checkoutError, setCheckoutError] = (0, _react.useState)(null);
+  const regularName = uiFontStyle ? `${uiFontStyle.cssFamily} ${uiFontStyle.name}` : null;
+  const boldName = uiFontStyleBold ? `${uiFontStyleBold.cssFamily} ${uiFontStyleBold.name}` : null;
   return /*#__PURE__*/_react.default.createElement(_StoreModalCheckoutContext.default.Provider, {
     value: {
       checkoutStep,
@@ -105,8 +103,8 @@ const StoreModalContainer = _ref => {
     showCartButton: showCartButton,
     orderItemCount: orderItemCount,
     fonts: {
-      regular: getFontData((_settings = data.viewer.settings) === null || _settings === void 0 ? void 0 : _settings.uiFontStyle),
-      bold: getFontData((_settings2 = data.viewer.settings) === null || _settings2 === void 0 ? void 0 : _settings2.uiFontStyleBold)
+      regular: regularName,
+      bold: boldName
     },
     routeName: currentRoute
   }, {

package/dist/components/StoreModal/StoreModalFamily.js

@@ -9,7 +9,6 @@ var _react = _interopRequireWildcard(require("react"));
 var _reactRelay = require("react-relay");
 var _StoreModalFamilyButton = _interopRequireDefault(require("./StoreModalFamilyButton"));
 var _StoreModalStyleButton = _interopRequireDefault(require("./StoreModalStyleButton"));
-var _Stylesheet = _interopRequireDefault(require("../Stylesheet"));
 var _StoreModalFamily = _interopRequireDefault(require("../elements/StoreModalFamily"));
 var _StoreModalBundleButton = _interopRequireDefault(require("./StoreModalBundleButton"));
 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); }
@@ -37,13 +36,10 @@ function StoreModalFamily(_ref) {
     onSelect,
     title
   } = _ref;
-  const collection = (0, _reactRelay.useFragment)((_StoreModalFamily_collection2.default.hash && _StoreModalFamily_collection2.default.hash !== "9c85d32d917e909af575bdda90949c0b" && console.error("The definition of 'StoreModalFamily_collection' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _StoreModalFamily_collection2.default), collectionKey);
+  const collection = (0, _reactRelay.useFragment)((_StoreModalFamily_collection2.default.hash && _StoreModalFamily_collection2.default.hash !== "73d00dd2b57a2b44a86ee085b4313d77" && console.error("The definition of 'StoreModalFamily_collection' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _StoreModalFamily_collection2.default), collectionKey);
   const fontStyles = (0, _react.useMemo)(() => stylesGrouped(collection), [collection]);
   if ((fontStyles === null || fontStyles === void 0 ? void 0 : fontStyles.length) === 0 && collection.collectionType === 'superfamily' && !collection.sku) return null;
   return /*#__PURE__*/_react.default.createElement(_StoreModalFamily.default, null, {
-    stylesheet: collection.cssUrl && /*#__PURE__*/_react.default.createElement(_Stylesheet.default, {
-      href: collection.cssUrl
-    }) || null,
     title,
     familyButton: /*#__PURE__*/_react.default.createElement(_StoreModalFamilyButton.default, {
       collection: collection,

package/dist/components/StoreModal/StoreModalIndexItem.js

@@ -11,21 +11,20 @@ var _reactRelay = require("react-relay");
 var _StoreModalIndexItem = _interopRequireDefault(require("../elements/StoreModalIndexItem"));
 var _ConfigContext = _interopRequireDefault(require("../ConfigContext"));
 var _FontStyle = _interopRequireDefault(require("../FontStyle"));
-var _Stylesheet = _interopRequireDefault(require("../Stylesheet"));
 var _useTotalStyles = _interopRequireDefault(require("../useTotalStyles"));
 var _utils = require("../../utils");
 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 }; }
 const StoreModalIndexItem = _ref => {
-  var _data$featureStyle$fa, _data$featureStyle, _data$featureStyle$fa2;
+  var _data$featureStyle;
   let {
     collection
   } = _ref;
   const {
     storeModal: config
   } = (0, _react.useContext)(_ConfigContext.default);
-  const data = (0, _reactRelay.useFragment)((_StoreModalIndexItem_fontCollection2.default.hash && _StoreModalIndexItem_fontCollection2.default.hash !== "c066b135c6b830ef95bfc0d307e46791" && console.error("The definition of 'StoreModalIndexItem_fontCollection' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _StoreModalIndexItem_fontCollection2.default), collection);
+  const data = (0, _reactRelay.useFragment)((_StoreModalIndexItem_fontCollection2.default.hash && _StoreModalIndexItem_fontCollection2.default.hash !== "8a990fad8dc50c9f00b391902e9bc482" && console.error("The definition of 'StoreModalIndexItem_fontCollection' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _StoreModalIndexItem_fontCollection2.default), collection);
   const dispatch = (0, _reactRedux.useDispatch)();
   const handleClickProduct = productId => {
     dispatch({
@@ -53,16 +52,12 @@ const StoreModalIndexItem = _ref => {
     key: data.id,
     onClick: handleClickProduct.bind(null, data.id)
   }, {
-    aa: config.indexLayout === 'styled-aa' && (data.featureStyle ? /*#__PURE__*/_react.default.createElement(_react.Fragment, null, ((_data$featureStyle$fa = data.featureStyle.family) === null || _data$featureStyle$fa === void 0 ? void 0 : _data$featureStyle$fa.cssUrl) && /*#__PURE__*/_react.default.createElement(_Stylesheet.default, {
-      href: data.featureStyle.family.cssUrl
-    }), /*#__PURE__*/_react.default.createElement(_FontStyle.default, {
+    aa: config.indexLayout === 'styled-aa' && (data.featureStyle ? /*#__PURE__*/_react.default.createElement(_FontStyle.default, {
       fontStyle: data.featureStyle
-    }, (0, _utils.getFeatureGlyphs)((_data$featureStyle = data.featureStyle) === null || _data$featureStyle === void 0 ? void 0 : _data$featureStyle.supportedLanguages))) : null),
-    name: config.indexLayout === 'styled-font-names' ? data.featureStyle && /*#__PURE__*/_react.default.createElement(_react.Fragment, null, ((_data$featureStyle$fa2 = data.featureStyle.family) === null || _data$featureStyle$fa2 === void 0 ? void 0 : _data$featureStyle$fa2.cssUrl) && /*#__PURE__*/_react.default.createElement(_Stylesheet.default, {
-      href: data.featureStyle.family.cssUrl
-    }), /*#__PURE__*/_react.default.createElement(_FontStyle.default, {
+    }, (0, _utils.getFeatureGlyphs)((_data$featureStyle = data.featureStyle) === null || _data$featureStyle === void 0 ? void 0 : _data$featureStyle.supportedLanguages)) : null),
+    name: config.indexLayout === 'styled-font-names' ? data.featureStyle && /*#__PURE__*/_react.default.createElement(_FontStyle.default, {
       fontStyle: data.featureStyle
-    }, data.name)) : data.name,
+    }, data.name) : data.name,
     label: label.join(', ')
   });
 };

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

@@ -0,0 +1,2 @@
+declare const Tracking: () => null;
+export default Tracking;