fontdue-js 1.12.4 → 2.0.0-alpha2

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

@@ -1,32 +1,12 @@
-import { ReaderFragment } from "relay-runtime";
+/**
+ * @generated SignedSource<<16db21a92f04b1740ade47ae7e17b7de>>
+ * @lightSyntaxTransform
+ * @nogrep
+ */
+import { ReaderFragment } from 'relay-runtime';
 import { FragmentRefs } from "relay-runtime";
-export declare type productState_node = {
-    readonly id: string;
-    readonly name: string;
-    readonly sku: {
-        readonly id: string;
-        readonly price: {
-            readonly amount: number;
-        };
-    } | null;
-    readonly fontStyles: ReadonlyArray<{
-        readonly id: string;
-        readonly sku: {
-            readonly id: string;
-            readonly price: {
-                readonly amount: number;
-            };
-        } | null;
-    }> | null;
+export type productState_node$data = {
     readonly bundles: ReadonlyArray<{
-        readonly id: string;
-        readonly name: string;
-        readonly sku: {
-            readonly id: string;
-            readonly price: {
-                readonly amount: number;
-            };
-        } | null;
         readonly fontStyles: ReadonlyArray<{
             readonly id: string;
             readonly sku: {
@@ -36,8 +16,6 @@ export declare type productState_node = {
                 };
             } | null;
         }> | null;
-    }> | null;
-    readonly children: ReadonlyArray<{
         readonly id: string;
         readonly name: string;
         readonly sku: {
@@ -46,8 +24,20 @@ export declare type productState_node = {
                 readonly amount: number;
             };
         } | null;
-        readonly fontStyles: ReadonlyArray<{
+    }> | null;
+    readonly children: ReadonlyArray<{
+        readonly bundles: ReadonlyArray<{
+            readonly fontStyles: ReadonlyArray<{
+                readonly id: string;
+                readonly sku: {
+                    readonly id: string;
+                    readonly price: {
+                        readonly amount: number;
+                    };
+                } | null;
+            }> | null;
             readonly id: string;
+            readonly name: string;
             readonly sku: {
                 readonly id: string;
                 readonly price: {
@@ -55,31 +45,45 @@ export declare type productState_node = {
                 };
             } | null;
         }> | null;
-        readonly bundles: ReadonlyArray<{
+        readonly fontStyles: ReadonlyArray<{
             readonly id: string;
-            readonly name: string;
             readonly sku: {
                 readonly id: string;
                 readonly price: {
                     readonly amount: number;
                 };
             } | null;
-            readonly fontStyles: ReadonlyArray<{
-                readonly id: string;
-                readonly sku: {
-                    readonly id: string;
-                    readonly price: {
-                        readonly amount: number;
-                    };
-                } | null;
-            }> | null;
         }> | null;
+        readonly id: string;
+        readonly name: string;
+        readonly sku: {
+            readonly id: string;
+            readonly price: {
+                readonly amount: number;
+            };
+        } | null;
     }> | null;
+    readonly fontStyles: ReadonlyArray<{
+        readonly id: string;
+        readonly sku: {
+            readonly id: string;
+            readonly price: {
+                readonly amount: number;
+            };
+        } | null;
+    }> | null;
+    readonly id: string;
+    readonly name: string;
+    readonly sku: {
+        readonly id: string;
+        readonly price: {
+            readonly amount: number;
+        };
+    } | null;
 };
-export declare type productState_node$data = productState_node;
-export declare type productState_node$key = {
+export type productState_node$key = {
     readonly " $data"?: productState_node$data;
-    readonly " $fragmentRefs": FragmentRefs<"productState_node">;
+    readonly " $fragmentSpreads": FragmentRefs<"productState_node">;
 };
 declare const node: ReaderFragment;
 export default node;

package/dist/__generated__/productState_node.graphql.js

@@ -4,6 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+/**
+ * @generated SignedSource<<16db21a92f04b1740ade47ae7e17b7de>>
+ * @lightSyntaxTransform
+ * @nogrep
+ */
+
 /* tslint:disable */
 /* eslint-disable */
 // @ts-nocheck
@@ -96,6 +102,6 @@ const node = function () {
     "abstractKey": null
   };
 }();
-node.hash = 'aab1ef07e0192a0d22a4c300084d9d05';
+node.hash = "aab1ef07e0192a0d22a4c300084d9d05";
 var _default = node;
 exports.default = _default;

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

@@ -1,15 +1,19 @@
-import { ReaderFragment } from "relay-runtime";
+/**
+ * @generated SignedSource<<94809b5e06ad14274735be94fc942f70>>
+ * @lightSyntaxTransform
+ * @nogrep
+ */
+import { ReaderFragment } from 'relay-runtime';
 import { FragmentRefs } from "relay-runtime";
-export declare type productState_sku = {
+export type productState_sku$data = {
     readonly id: string;
     readonly price: {
         readonly amount: number;
     };
 };
-export declare type productState_sku$data = productState_sku;
-export declare type productState_sku$key = {
+export type productState_sku$key = {
     readonly " $data"?: productState_sku$data;
-    readonly " $fragmentRefs": FragmentRefs<"productState_sku">;
+    readonly " $fragmentSpreads": FragmentRefs<"productState_sku">;
 };
 declare const node: ReaderFragment;
 export default node;

package/dist/__generated__/productState_sku.graphql.js

@@ -4,6 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+/**
+ * @generated SignedSource<<94809b5e06ad14274735be94fc942f70>>
+ * @lightSyntaxTransform
+ * @nogrep
+ */
+
 /* tslint:disable */
 /* eslint-disable */
 // @ts-nocheck
@@ -40,6 +46,6 @@ const node = {
   "type": "Sku",
   "abstractKey": null
 };
-node.hash = '2cee6ddddc85699f0c90e2607c0634ef';
+node.hash = "2cee6ddddc85699f0c90e2607c0634ef";
 var _default = node;
 exports.default = _default;

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

@@ -1,25 +1,29 @@
-import { ReaderFragment } from "relay-runtime";
+/**
+ * @generated SignedSource<<7d4999e57a7c997c4cbcbf4ed36e6c04>>
+ * @lightSyntaxTransform
+ * @nogrep
+ */
+import { ReaderFragment } from 'relay-runtime';
 import { FragmentRefs } from "relay-runtime";
-export declare type useFeaturesData_fontStyle = {
-    readonly variableAxes: ReadonlyArray<{
-        readonly axis: string;
-        readonly name: string;
-        readonly minValue: number;
-        readonly maxValue: number;
-    }> | null;
+export type useFeaturesData_fontStyle$data = {
     readonly fontFeatures: {
-        readonly supportedFeatures: ReadonlyArray<string>;
         readonly stylisticSetNames: ReadonlyArray<{
             readonly featureName: string;
             readonly humanName: string;
         }>;
+        readonly supportedFeatures: ReadonlyArray<string>;
     };
-    readonly " $refType": "useFeaturesData_fontStyle";
+    readonly variableAxes: ReadonlyArray<{
+        readonly axis: string;
+        readonly maxValue: number;
+        readonly minValue: number;
+        readonly name: string;
+    }> | null;
+    readonly " $fragmentType": "useFeaturesData_fontStyle";
 };
-export declare type useFeaturesData_fontStyle$data = useFeaturesData_fontStyle;
-export declare type useFeaturesData_fontStyle$key = {
+export type useFeaturesData_fontStyle$key = {
     readonly " $data"?: useFeaturesData_fontStyle$data;
-    readonly " $fragmentRefs": FragmentRefs<"useFeaturesData_fontStyle">;
+    readonly " $fragmentSpreads": FragmentRefs<"useFeaturesData_fontStyle">;
 };
 declare const node: ReaderFragment;
 export default node;

package/dist/__generated__/useFeaturesData_fontStyle.graphql.js

@@ -4,6 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+/**
+ * @generated SignedSource<<7d4999e57a7c997c4cbcbf4ed36e6c04>>
+ * @lightSyntaxTransform
+ * @nogrep
+ */
+
 /* tslint:disable */
 /* eslint-disable */
 // @ts-nocheck
@@ -86,6 +92,6 @@ const node = {
   "type": "FontStyle",
   "abstractKey": null
 };
-node.hash = 'f698c938cad6a351aaba65d33ce650d2';
+node.hash = "f698c938cad6a351aaba65d33ce650d2";
 var _default = node;
 exports.default = _default;

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

@@ -1,17 +1,21 @@
-import { ReaderFragment } from "relay-runtime";
+/**
+ * @generated SignedSource<<ebf8f2fd186cd3e32bee391ddebaf554>>
+ * @lightSyntaxTransform
+ * @nogrep
+ */
+import { ReaderFragment } from 'relay-runtime';
 import { FragmentRefs } from "relay-runtime";
-export declare type useTotalStyles_fontCollection = {
-    readonly totalStyles: number | null;
+export type useTotalStyles_fontCollection$data = {
     readonly children: ReadonlyArray<{
         readonly isVariableFont: boolean;
         readonly totalStyles: number | null;
     }> | null;
-    readonly " $refType": "useTotalStyles_fontCollection";
+    readonly totalStyles: number | null;
+    readonly " $fragmentType": "useTotalStyles_fontCollection";
 };
-export declare type useTotalStyles_fontCollection$data = useTotalStyles_fontCollection;
-export declare type useTotalStyles_fontCollection$key = {
+export type useTotalStyles_fontCollection$key = {
     readonly " $data"?: useTotalStyles_fontCollection$data;
-    readonly " $fragmentRefs": FragmentRefs<"useTotalStyles_fontCollection">;
+    readonly " $fragmentSpreads": FragmentRefs<"useTotalStyles_fontCollection">;
 };
 declare const node: ReaderFragment;
 export default node;

package/dist/__generated__/useTotalStyles_fontCollection.graphql.js

@@ -4,6 +4,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
+/**
+ * @generated SignedSource<<ebf8f2fd186cd3e32bee391ddebaf554>>
+ * @lightSyntaxTransform
+ * @nogrep
+ */
+
 /* tslint:disable */
 /* eslint-disable */
 // @ts-nocheck
@@ -46,6 +52,6 @@ const node = function () {
     "abstractKey": null
   };
 }();
-node.hash = '24cf564c6f5bf49e27a9a0d65c937882';
+node.hash = "24cf564c6f5bf49e27a9a0d65c937882";
 var _default = node;
 exports.default = _default;

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

@@ -0,0 +1,3 @@
+import React from 'react';
+declare function AddToCartBannerQueryRenderer(): React.JSX.Element;
+export default AddToCartBannerQueryRenderer;

package/dist/components/AddToCartBanner/index.js

@@ -4,109 +4,76 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
+var _react = _interopRequireWildcard(require("react"));
 var _reactRelay = require("react-relay");
-var _AddToCartBanner_order, _AddToCartBannerQuery;
+var _fastDeepEqual = _interopRequireDefault(require("fast-deep-equal"));
+var _AddToCartBanner_item, _AddToCartBanner_order, _AddToCartBannerQuery;
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-function getOrderCount(order) {
-  return order.orderItems ? order.orderItems.length : 0;
-}
-const cartButtonCount = order => {
-  if (!order) return 0;
-  return getOrderCount(order); // TODO: add a `count` field to schema
-};
-
-const getOrderItemIds = order => order.orderItems.map(item => item.id);
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 const getOrderItemName = item => {
-  const product = item.sku && item.sku.product;
+  var _item$sku;
+  const product = item === null || item === void 0 ? void 0 : (_item$sku = item.sku) === null || _item$sku === void 0 ? void 0 : _item$sku.product;
   if (!product) return null;
   if (product.__typename === 'FontStyle') {
-    return `${product.family.name} ${product.name}`;
+    var _product$family;
+    return `${(_product$family = product.family) === null || _product$family === void 0 ? void 0 : _product$family.name} ${product.name}`;
   }
-  return item.sku.product.name;
+  if ('name' in product) return product.name;
+  return null;
 };
-class AddToCartBannerBase extends _react.default.Component {
-  constructor(props) {
-    super(props);
-    this.state = {
-      active: false,
-      orderItems: []
-    };
-    this.setInactive = () => this.setState({
-      active: false
-    });
-  }
-  componentDidUpdate(prevProps, prevState) {
-    var _order$orderItems;
-    const {
-      order
-    } = this.props;
-    const {
-      order: prevOrder
-    } = prevProps;
-    if (!order) return;
-    const count = cartButtonCount(order);
-    const prevCount = cartButtonCount(prevOrder);
-    const prevOrderItemIds = getOrderItemIds(prevOrder);
-    const newOrderItems = (_order$orderItems = order.orderItems) === null || _order$orderItems === void 0 ? void 0 : _order$orderItems.filter(item => !prevOrderItemIds.includes(item.id));
-    if (!newOrderItems) return;
-    if (newOrderItems.length > 0) {
-      this.setState({
-        active: true,
-        orderItems: newOrderItems
-      });
-      clearTimeout(this._timeout);
-      this._timeout = setTimeout(this.setInactive, 2000);
+_AddToCartBanner_item !== void 0 ? _AddToCartBanner_item : (_AddToCartBanner_item = require("../../__generated__/AddToCartBanner_item.graphql"), _AddToCartBanner_item.hash && _AddToCartBanner_item.hash !== "ebcfac33759865770c15e1efe0777e91" && console.error("The definition of 'AddToCartBanner_item' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _AddToCartBanner_item);
+function AddToCartBanner(_ref) {
+  var _order$orderItems, _order$orderItems2;
+  let {
+    order: orderKey
+  } = _ref;
+  const order = (0, _reactRelay.useFragment)(_AddToCartBanner_order !== void 0 ? _AddToCartBanner_order : (_AddToCartBanner_order = require("../../__generated__/AddToCartBanner_order.graphql"), _AddToCartBanner_order.hash && _AddToCartBanner_order.hash !== "29516fe27686b4937b1856979f13d22b" && console.error("The definition of 'AddToCartBanner_order' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _AddToCartBanner_order), orderKey);
+  const [active, setActive] = (0, _react.useState)(false);
+  const prevOrderItemIds = (0, _react.useRef)(order === null || order === void 0 ? void 0 : (_order$orderItems = order.orderItems) === null || _order$orderItems === void 0 ? void 0 : _order$orderItems.map(item => item.id));
+  const newOrderItemIds = (0, _react.useRef)([]);
+  const newOrderItems = order === null || order === void 0 ? void 0 : (_order$orderItems2 = order.orderItems) === null || _order$orderItems2 === void 0 ? void 0 : _order$orderItems2.filter(item => {
+    var _newOrderItemIds$curr;
+    return (_newOrderItemIds$curr = newOrderItemIds.current) === null || _newOrderItemIds$curr === void 0 ? void 0 : _newOrderItemIds$curr.includes(item.id);
+  });
+  const timeoutRef = (0, _react.useRef)();
+  (0, _react.useEffect)(() => {
+    document.body.dataset.addToCartBannerOpen = `${active}`;
+  }, [active]);
+  (0, _react.useEffect)(() => {
+    var _order$orderItems3, _order$orderItems4, _prevOrderItemIds$cur;
+    function setInactive() {
+      setActive(false);
     }
-    if (this.state.active !== prevState.active) {
-      document.body.dataset.addToCartBannerOpen = this.state.active;
+    const orderItemIds = order === null || order === void 0 ? void 0 : (_order$orderItems3 = order.orderItems) === null || _order$orderItems3 === void 0 ? void 0 : _order$orderItems3.map(item => item.id);
+    if ((0, _fastDeepEqual.default)(orderItemIds, prevOrderItemIds.current)) return;
+    if (((order === null || order === void 0 ? void 0 : (_order$orderItems4 = order.orderItems) === null || _order$orderItems4 === void 0 ? void 0 : _order$orderItems4.length) ?? 0) > (((_prevOrderItemIds$cur = prevOrderItemIds.current) === null || _prevOrderItemIds$cur === void 0 ? void 0 : _prevOrderItemIds$cur.length) ?? 0)) {
+      setActive(true);
+      if (timeoutRef.current) clearTimeout(timeoutRef.current);
+      timeoutRef.current = setTimeout(setInactive, 2000);
+      newOrderItemIds.current = (orderItemIds === null || orderItemIds === void 0 ? void 0 : orderItemIds.filter(id => {
+        var _prevOrderItemIds$cur2;
+        return !((_prevOrderItemIds$cur2 = prevOrderItemIds.current) !== null && _prevOrderItemIds$cur2 !== void 0 && _prevOrderItemIds$cur2.includes(id));
+      })) ?? [];
     }
-  }
-  componentWillUnmount() {
-    clearTimeout(this._timeout);
-  }
-  render() {
-    const {
-      order
-    } = this.props;
-    const {
-      active,
-      orderItems
-    } = this.state;
-    if (!order) return null;
-    const itemText = orderItems.length === 1 ? getOrderItemName(orderItems[0]) : `${orderItems.length} items`;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: "add-to-cart-banner",
-      "data-active": active
-    }, "You added ", itemText, " to your cart");
-  }
+    prevOrderItemIds.current = orderItemIds;
+    return () => {
+      if (timeoutRef.current) clearTimeout(timeoutRef.current);
+    };
+  }, [order === null || order === void 0 ? void 0 : order.orderItems]);
+  const itemText = (newOrderItems === null || newOrderItems === void 0 ? void 0 : newOrderItems.length) === 1 ? getOrderItemName(newOrderItems[0]) : `${newOrderItems === null || newOrderItems === void 0 ? void 0 : newOrderItems.length} items`;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: "add-to-cart-banner",
+    "data-active": active
+  }, "You added ", itemText, " to your cart");
 }
-const AddToCartBanner = (0, _reactRelay.createFragmentContainer)(AddToCartBannerBase, {
-  order: _AddToCartBanner_order !== void 0 ? _AddToCartBanner_order : (_AddToCartBanner_order = require("../../__generated__/AddToCartBanner_order.graphql"), _AddToCartBanner_order.hash && _AddToCartBanner_order.hash !== "044abe5fe0f10944daa302e8849cb142" && console.error("The definition of 'AddToCartBanner_order' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _AddToCartBanner_order)
-});
-const AddToCartBannerQueryRenderer = params => {
-  const environment = (0, _reactRelay.useRelayEnvironment)();
-  return /*#__PURE__*/_react.default.createElement(_reactRelay.QueryRenderer, {
-    environment: environment,
-    query: _AddToCartBannerQuery !== void 0 ? _AddToCartBannerQuery : (_AddToCartBannerQuery = require("../../__generated__/AddToCartBannerQuery.graphql"), _AddToCartBannerQuery.hash && _AddToCartBannerQuery.hash !== "0ece6678652384f7938caf18b2a40be9" && console.error("The definition of 'AddToCartBannerQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _AddToCartBannerQuery),
-    render: _ref => {
-      let {
-        error,
-        props
-      } = _ref;
-      if (error) {
-        console.error(error);
-        return null;
-      }
-      if (props) {
-        return /*#__PURE__*/_react.default.createElement(AddToCartBanner, _extends({}, params, {
-          order: props.viewer.currentOrder
-        }));
-      }
-      return null;
-    }
+function AddToCartBannerQueryRenderer() {
+  const {
+    viewer
+  } = (0, _reactRelay.useLazyLoadQuery)(_AddToCartBannerQuery !== void 0 ? _AddToCartBannerQuery : (_AddToCartBannerQuery = require("../../__generated__/AddToCartBannerQuery.graphql"), _AddToCartBannerQuery.hash && _AddToCartBannerQuery.hash !== "0ece6678652384f7938caf18b2a40be9" && console.error("The definition of 'AddToCartBannerQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _AddToCartBannerQuery), {});
+  return /*#__PURE__*/_react.default.createElement(AddToCartBanner, {
+    order: viewer.currentOrder
   });
-};
+}
 var _default = AddToCartBannerQueryRenderer;
 exports.default = _default;

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

@@ -5,5 +5,5 @@ interface BuyButtonQueryRenderer_props {
     collectionName?: string;
     label?: string;
 }
-declare const BuyButtonQueryRenderer: React.FC<BuyButtonQueryRenderer_props>;
+declare function BuyButtonQueryRenderer({ collectionId, collectionSlug, ...rest }: BuyButtonQueryRenderer_props): React.JSX.Element;
 export default BuyButtonQueryRenderer;

package/dist/components/BuyButton/index.js

@@ -14,12 +14,13 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-const BuyButtonBase = _ref => {
+function BuyButton(_ref) {
   let {
-    collection,
+    collection: collectionKey,
     label,
     collectionName
   } = _ref;
+  const collection = (0, _reactRelay.useFragment)(_BuyButton_collection !== void 0 ? _BuyButton_collection : (_BuyButton_collection = require("../../__generated__/BuyButton_collection.graphql"), _BuyButton_collection.hash && _BuyButton_collection.hash !== "9c47030d7450494449d4aa5bda16e27e" && console.error("The definition of 'BuyButton_collection' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _BuyButton_collection), collectionKey);
   const store = (0, _reactRedux.useStore)();
   const components = (0, _react.useContext)(_ComponentsContext.default);
   const dispatch = (0, _reactRedux.useDispatch)();
@@ -39,7 +40,6 @@ const BuyButtonBase = _ref => {
   }, [dispatch, collection]);
   (0, _react.useEffect)(() => {
     if (!collection) return;
-    console.log(`Populating ${collection.id}`);
     // populate as soon as BuyButton mounts. this prepares the StoreModal
     // to be able to apply discounts as soon as the user clicks "BUY" on
     // a style. (this is necessary if the bundle price is <= single style price)
@@ -57,55 +57,47 @@ const BuyButtonBase = _ref => {
     onClick: handleClick,
     type: "button"
   }, label ? label : `Buy ${collectionName ?? ''}`);
-};
-const BuyButton = (0, _reactRelay.createFragmentContainer)(BuyButtonBase, {
-  collection: _BuyButton_collection !== void 0 ? _BuyButton_collection : (_BuyButton_collection = require("../../__generated__/BuyButton_collection.graphql"), _BuyButton_collection.hash && _BuyButton_collection.hash !== "9c47030d7450494449d4aa5bda16e27e" && console.error("The definition of 'BuyButton_collection' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _BuyButton_collection)
-});
-const BuyButtonQueryRenderer = _ref2 => {
+}
+function BuyButtonIDQueryRenderer(_ref2) {
   let {
     collectionId,
-    collectionSlug,
     ...rest
   } = _ref2;
-  const environment = (0, _reactRelay.useRelayEnvironment)();
+  const data = (0, _reactRelay.useLazyLoadQuery)(_BuyButtonIDQuery !== void 0 ? _BuyButtonIDQuery : (_BuyButtonIDQuery = require("../../__generated__/BuyButtonIDQuery.graphql"), _BuyButtonIDQuery.hash && _BuyButtonIDQuery.hash !== "239b8509e5cecdf8ba5d124f5f39ef5f" && console.error("The definition of 'BuyButtonIDQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _BuyButtonIDQuery), {
+    collectionId
+  });
+  return /*#__PURE__*/_react.default.createElement(BuyButton, _extends({}, rest, data));
+}
+function BuyButtonSlugQueryRenderer(_ref3) {
+  var _data$viewer, _data$viewer$slug;
+  let {
+    collectionSlug,
+    ...rest
+  } = _ref3;
+  const data = (0, _reactRelay.useLazyLoadQuery)(_BuyButtonSlugQuery !== void 0 ? _BuyButtonSlugQuery : (_BuyButtonSlugQuery = require("../../__generated__/BuyButtonSlugQuery.graphql"), _BuyButtonSlugQuery.hash && _BuyButtonSlugQuery.hash !== "465a1d1ddcd982c9f97e4c5daa5755d6" && console.error("The definition of 'BuyButtonSlugQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _BuyButtonSlugQuery), {
+    collectionSlug
+  });
+  return /*#__PURE__*/_react.default.createElement(BuyButton, _extends({}, rest, {
+    collection: ((_data$viewer = data.viewer) === null || _data$viewer === void 0 ? void 0 : (_data$viewer$slug = _data$viewer.slug) === null || _data$viewer$slug === void 0 ? void 0 : _data$viewer$slug.collection) ?? null
+  }));
+}
+function BuyButtonQueryRenderer(_ref4) {
+  let {
+    collectionId,
+    collectionSlug,
+    ...rest
+  } = _ref4;
   if (collectionId) {
-    return /*#__PURE__*/_react.default.createElement(_reactRelay.QueryRenderer, {
-      environment: environment,
-      query: _BuyButtonIDQuery !== void 0 ? _BuyButtonIDQuery : (_BuyButtonIDQuery = require("../../__generated__/BuyButtonIDQuery.graphql"), _BuyButtonIDQuery.hash && _BuyButtonIDQuery.hash !== "239b8509e5cecdf8ba5d124f5f39ef5f" && console.error("The definition of 'BuyButtonIDQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _BuyButtonIDQuery),
-      variables: {
-        collectionId
-      },
-      render: _ref3 => {
-        let {
-          error,
-          props
-        } = _ref3;
-        if (error || !props) return null;
-        return /*#__PURE__*/_react.default.createElement(BuyButton, _extends({}, rest, props));
-      }
-    });
+    return /*#__PURE__*/_react.default.createElement(BuyButtonIDQueryRenderer, _extends({
+      collectionId: collectionId
+    }, rest));
   }
   if (collectionSlug) {
-    return /*#__PURE__*/_react.default.createElement(_reactRelay.QueryRenderer, {
-      environment: environment,
-      query: _BuyButtonSlugQuery !== void 0 ? _BuyButtonSlugQuery : (_BuyButtonSlugQuery = require("../../__generated__/BuyButtonSlugQuery.graphql"), _BuyButtonSlugQuery.hash && _BuyButtonSlugQuery.hash !== "465a1d1ddcd982c9f97e4c5daa5755d6" && console.error("The definition of 'BuyButtonSlugQuery' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _BuyButtonSlugQuery),
-      variables: {
-        collectionSlug
-      },
-      render: _ref4 => {
-        var _props$viewer, _props$viewer$slug;
-        let {
-          error,
-          props
-        } = _ref4;
-        if (error || !props) return null;
-        return /*#__PURE__*/_react.default.createElement(BuyButton, _extends({}, rest, {
-          collection: ((_props$viewer = props.viewer) === null || _props$viewer === void 0 ? void 0 : (_props$viewer$slug = _props$viewer.slug) === null || _props$viewer$slug === void 0 ? void 0 : _props$viewer$slug.collection) ?? null
-        }));
-      }
-    });
+    return /*#__PURE__*/_react.default.createElement(BuyButtonSlugQueryRenderer, _extends({
+      collectionSlug: collectionSlug
+    }, rest));
   }
-  return null;
-};
+  throw new Error('BuyButton expected either a collectionId or collectionSlug prop');
+}
 var _default = BuyButtonQueryRenderer;
 exports.default = _default;

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

@@ -1,4 +1,4 @@
-/// <reference types="react" />
+import React from 'react';
 import { AddressFields_viewer$key } from '__generated__/AddressFields_viewer.graphql';
 import { Identity, UpdateOrderErrors } from './types';
 interface AddressFields_props {
@@ -9,5 +9,5 @@ interface AddressFields_props {
     errorsObject: UpdateOrderErrors['billingIdentity' | 'licenseeIdentity'] | undefined;
     onRequiredFieldsChange: (required: (keyof Identity)[]) => void;
 }
-declare const AddressFields: ({ viewer: viewerKey, value, onChange, requireAtLeast, errorsObject, onRequiredFieldsChange, }: AddressFields_props) => JSX.Element;
+declare const AddressFields: ({ viewer: viewerKey, value, onChange, requireAtLeast, errorsObject, onRequiredFieldsChange, }: AddressFields_props) => React.JSX.Element;
 export default AddressFields;

package/dist/components/Cart/AddressFields.js

@@ -31,7 +31,7 @@ const AddressFields = _ref => {
     onRequiredFieldsChange
   } = _ref;
   const [refetching, setRefetching] = (0, _react.useState)(false);
-  const [viewer, refetch] = (0, _reactRelay.useRefetchableFragment)(_AddressFields_viewer !== void 0 ? _AddressFields_viewer : (_AddressFields_viewer = require("../../__generated__/AddressFields_viewer.graphql"), _AddressFields_viewer.hash && _AddressFields_viewer.hash !== "f4433ebc3e6d0bf87e70b488cde24227" && console.error("The definition of 'AddressFields_viewer' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _AddressFields_viewer), viewerKey);
+  const [viewer, refetch] = (0, _reactRelay.useRefetchableFragment)(_AddressFields_viewer !== void 0 ? _AddressFields_viewer : (_AddressFields_viewer = require("../../__generated__/AddressFields_viewer.graphql"), _AddressFields_viewer.hash && _AddressFields_viewer.hash !== "6918328bf81519373ac576a147dbfd62" && console.error("The definition of 'AddressFields_viewer' appears to have changed. Run `relay-compiler` to update the generated files to receive the expected data."), _AddressFields_viewer), viewerKey);
   const countryData = (_viewer$countryData = viewer.countryData) === null || _viewer$countryData === void 0 ? void 0 : _viewer$countryData.response;
   const environment = (0, _reactRelay.useRelayEnvironment)();
   (0, _react.useEffect)(() => {
@@ -203,7 +203,7 @@ const AddressFields = _ref => {
       zip: v
     }),
     errors: getErrors('zip')
-  })), countryData.isEuCountry && /*#__PURE__*/_react.default.createElement("div", {
+  })), (countryData.isEuCountry || value.country === 'GB') && /*#__PURE__*/_react.default.createElement("div", {
     className: "checkout-modal__section"
   }, /*#__PURE__*/_react.default.createElement(_TextField.default, {
     label: "VAT number",