fontdue-js 3.7.0 → 3.9.0

package/dist/selection.js

@@ -19,8 +19,14 @@
  * wins, then the one with the fewest SKUs – so a variable font comes along with
  * a collection bundle priced like its static family, and a family beats its two
  * halves at the same price.
+ *
+ * On a product page, a pick the page shows only sits inside SKUs the page shows
+ * (see `viewedProduct`).
  */
 
+// The product page being viewed and every SKU its fetch returned – what the
+// page renders.
+
 // Nodes the exact search may visit per part of the catalog before it settles
 // for the best combination found so far. Real catalogs finish far below it; it
 // only bounds pathological ones.
@@ -159,6 +165,23 @@ const containersOf = (index, pick) => {
   return containers;
 };
 
+// The containers a pick may sit inside. Every product the buyer has seen – or
+// has a BuyButton for on the host page – stays in the catalog, so on a product
+// page a pick the page shows only sits inside SKUs the page shows. Otherwise a
+// font pack seen earlier would take a member family's styles on the family's
+// own page, with a SKU that page doesn't show (even a family sold only by the
+// style), and a family seen earlier would take the pack page's partial block
+// of its styles (FD-79). A SKU granting exactly the pick's styles at its price
+// is the pick as far as the index goes – only one of two such twins is
+// offered – so it always stays.
+const holdersOf = (index, pick, viewed) => {
+  const containers = containersOf(index, pick);
+  if (!(viewed !== null && viewed !== void 0 && viewed.skuIds.has(pick))) return containers;
+  const size = index.granted.get(pick).size;
+  const price = index.catalog.skuPrices[pick];
+  return containers.filter(skuId => viewed.skuIds.has(skuId) || index.granted.get(skuId).size === size && index.catalog.skuPrices[skuId] === price);
+};
+
 // The parts a pick's styles belong to.
 const partsOf = (index, pick) => {
   const cached = index.parts.get(pick);
@@ -199,27 +222,30 @@ const notNull = value => value !== null;
  *   cheapestSkuIds(['sku:bold', 'sku:regular', 'sku:light'], catalog)
  *   // => ['sku:light+regular+bold'] rather than a pair plus a single
  */
-export const cheapestSkuIds = (picks, catalog) => cheapestCombination(picks, catalog).skuIds;
-const selectionCost = (picks, catalog) => cheapestCombination(picks, catalog).cost;
-const cheapestCombination = (picks, catalog) => {
+export const cheapestSkuIds = function (picks, catalog) {
+  let viewed = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : null;
+  return cheapestCombination(picks, catalog, viewed).skuIds;
+};
+const selectionCost = (picks, catalog, viewed) => cheapestCombination(picks, catalog, viewed).cost;
+const cheapestCombination = (picks, catalog, viewed) => {
   const index = indexFor(catalog);
   const priceable = [...new Set(picks)].filter(pick => index.granted.has(pick)).sort();
-  return cover(priceable, new Set(), index) ?? EMPTY_COVER;
+  return cover(priceable, new Set(), index, viewed) ?? EMPTY_COVER;
 };
 
 // The cheapest cover of `picks` (sorted) without the `excluded` bridges, or
 // null when some pick has nowhere to sit without them.
-const cover = (picks, excluded, index) => {
+const cover = (picks, excluded, index, viewed) => {
   if (picks.length === 0) return EMPTY_COVER;
-  const key = `${picks.join(',')}#${[...excluded].sort().join(',')}`;
+  const key = `${picks.join(',')}#${[...excluded].sort().join(',')}@${(viewed === null || viewed === void 0 ? void 0 : viewed.id) ?? ''}`;
   if (index.covers.has(key)) return index.covers.get(key);
-  const result = coverUncached(picks, excluded, index);
+  const result = coverUncached(picks, excluded, index, viewed);
   if (index.covers.size >= MEMO_LIMIT) index.covers.clear();
   index.covers.set(key, result);
   return result;
 };
-const coverUncached = (picks, excluded, index) => {
-  const available = new Map(picks.map(pick => [pick, containersOf(index, pick).filter(id => !excluded.has(id))]));
+const coverUncached = (picks, excluded, index, viewed) => {
+  const available = new Map(picks.map(pick => [pick, holdersOf(index, pick, viewed).filter(id => !excluded.has(id))]));
   if (picks.some(pick => available.get(pick).length === 0)) return null;
   const parts = [...new Set(picks.flatMap(pick => [...partsOf(index, pick)]))];
   if (parts.length === 1) return branchAndBound(picks, available, index);
@@ -248,7 +274,7 @@ const coverUncached = (picks, excluded, index) => {
       const [part] = partsOf(index, pick);
       picksByGroup[groupOfPart.get(part)].push(pick);
     }
-    const covers = picksByGroup.map(group => cover(group, excluded, index));
+    const covers = picksByGroup.map(group => cover(group, excluded, index, viewed));
     return covers.every(notNull) ? combine(covers) : null;
   }
 
@@ -258,13 +284,13 @@ const coverUncached = (picks, excluded, index) => {
     bridge
   } = joining[0];
   const withoutBridge = new Set([...excluded, bridge]);
-  const rest = cover(picks.filter(pick => !available.get(pick).includes(bridge)), withoutBridge, index);
+  const rest = cover(picks.filter(pick => !available.get(pick).includes(bridge)), withoutBridge, index, viewed);
   const including = rest && combine([{
     skuIds: [bridge],
     cost: index.catalog.skuPrices[bridge],
     granted: index.granted.get(bridge)
   }, rest]);
-  const excluding = cover(picks, withoutBridge, index);
+  const excluding = cover(picks, withoutBridge, index, viewed);
   if (!including || !excluding) return including ?? excluding;
   return isBetter(including, excluding) ? including : excluding;
 };
@@ -393,6 +419,23 @@ const greedyCover = (options, all) => {
 // Selection state
 // ---------------------------------------------------------------------------
 
+const viewedSkuIdsCache = new WeakMap();
+
+// The product page the Store Modal is on – as the page reports it, so one
+// opened by slug counts the same as one opened by id – or null off a product
+// page and while the product's fetch is still in flight. productState records
+// every SKU a product's fetch returned, which is what its page renders.
+const viewedProduct = state => {
+  const productId = state.viewedProductId;
+  const skuIds = productId ? state.productSkuIds[productId] : undefined;
+  if (!productId || !skuIds) return null;
+  if (!viewedSkuIdsCache.has(skuIds)) viewedSkuIdsCache.set(skuIds, new Set(skuIds));
+  return {
+    id: productId,
+    skuIds: viewedSkuIdsCache.get(skuIds)
+  };
+};
+
 /**
  * Re-derives `selectedSkuIds` from the picks. A pick whose styles or price
  * aren't known yet – selected from the host page before its product data
@@ -400,7 +443,7 @@ const greedyCover = (options, all) => {
  */
 export const repriceSelection = state => {
   const unpriceable = state.requestedSkuIds.filter(skuId => !isPriceable(state, skuId));
-  const skuIds = union(cheapestSkuIds(state.requestedSkuIds, state), unpriceable);
+  const skuIds = union(cheapestSkuIds(state.requestedSkuIds, state, viewedProduct(state)), unpriceable);
   const unchanged = selectedSkuIdList(state).length === skuIds.length && skuIds.every(skuId => state.selectedSkuIds[skuId]);
   return unchanged ? state : {
     ...state,
@@ -476,18 +519,20 @@ const costCache = new WeakMap();
  */
 export const additionalCost = (state, skuId) => {
   if (!isPriceable(state, skuId)) return null;
+  const viewed = viewedProduct(state);
   let cache = costCache.get(state.requestedSkuIds);
-  if (!cache || cache.skuStyleIds !== state.skuStyleIds || cache.skuPrices !== state.skuPrices) {
+  if (!cache || cache.skuStyleIds !== state.skuStyleIds || cache.skuPrices !== state.skuPrices || cache.viewedId !== ((viewed === null || viewed === void 0 ? void 0 : viewed.id) ?? null)) {
     cache = {
       skuStyleIds: state.skuStyleIds,
       skuPrices: state.skuPrices,
-      base: selectionCost(state.requestedSkuIds, state),
+      viewedId: (viewed === null || viewed === void 0 ? void 0 : viewed.id) ?? null,
+      base: selectionCost(state.requestedSkuIds, state, viewed),
       costs: new Map()
     };
     costCache.set(state.requestedSkuIds, cache);
   }
   if (!cache.costs.has(skuId)) {
-    const withSku = selectionCost(union(state.requestedSkuIds, [skuId]), state);
+    const withSku = selectionCost(union(state.requestedSkuIds, [skuId]), state, viewed);
     cache.costs.set(skuId, withSku - cache.base);
   }
   return cache.costs.get(skuId);

package/dist/storeModalRoutes.js

@@ -28,10 +28,11 @@ function isGlobalId(value) {
  * `index` has to carry the configured `indexExcludeTags` — a route dispatched
  * without them lists collections the store front deliberately leaves out.
  *
- * A product is addressed by either its collection id or its slug, the same two
- * identifiers `BuyButton` takes. The route passes whichever it was given
- * through to the product query; a slug that names nothing (or names an article
- * rather than a collection) lands on the modal's "Collection not found".
+ * A product (a collection or a font pack) is addressed by either its id or its
+ * slug, the same two identifiers `BuyButton` takes. The route passes whichever
+ * it was given through to the product query; a slug that names nothing (or
+ * names an article rather than a product) lands on the modal's "Product not
+ * found".
  */
 const routes = {
   '^index$': config => ({

package/dist/version.js

@@ -8,4 +8,4 @@
 // (Fontage.ClientVersions) to spot sites that need to upgrade before a
 // feature that depends on a newer client can work for them.
 export const CLIENT_VERSION_HEADER = 'fontdue-client-version';
-export const version = "3.7.0";
+export const version = "3.9.0";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "fontdue-js",
-  "version": "3.7.0",
+  "version": "3.9.0",
   "type": "module",
   "scripts": {
     "build": "npm run relay && run-p build-js build-css build-ts",

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

@@ -1,25 +0,0 @@
-/**
- * @generated SignedSource<<2e0d1867d52ad59c939fc952ee3f136a>>
- * @lightSyntaxTransform
- * @nogrep
- */
-import { ReaderFragment } from 'relay-runtime';
-import { FragmentRefs } from "relay-runtime";
-export type BuyButton_collection$data = {
-    readonly fontStyles: ReadonlyArray<{
-        readonly sku: {
-            readonly id: string;
-        } | null;
-    }>;
-    readonly id: string;
-    readonly sku: {
-        readonly id: string;
-    } | null;
-    readonly " $fragmentType": "BuyButton_collection";
-};
-export type BuyButton_collection$key = {
-    readonly " $data"?: BuyButton_collection$data;
-    readonly " $fragmentSpreads": FragmentRefs<"BuyButton_collection">;
-};
-declare const node: ReaderFragment;
-export default node;

package/dist/__generated__/BuyButton_collection.graphql.js

@@ -1,49 +0,0 @@
-/**
- * @generated SignedSource<<2e0d1867d52ad59c939fc952ee3f136a>>
- * @lightSyntaxTransform
- * @nogrep
- */
-
-/* tslint:disable */
-/* eslint-disable */
-// @ts-nocheck
-
-const node = function () {
-  var v0 = {
-      "alias": null,
-      "args": null,
-      "kind": "ScalarField",
-      "name": "id",
-      "storageKey": null
-    },
-    v1 = {
-      "alias": null,
-      "args": null,
-      "concreteType": "Sku",
-      "kind": "LinkedField",
-      "name": "sku",
-      "plural": false,
-      "selections": [v0 /*: any*/],
-      "storageKey": null
-    };
-  return {
-    "argumentDefinitions": [],
-    "kind": "Fragment",
-    "metadata": null,
-    "name": "BuyButton_collection",
-    "selections": [v0 /*: any*/, v1 /*: any*/, {
-      "alias": null,
-      "args": null,
-      "concreteType": "FontStyle",
-      "kind": "LinkedField",
-      "name": "fontStyles",
-      "plural": true,
-      "selections": [v1 /*: any*/],
-      "storageKey": null
-    }],
-    "type": "FontCollection",
-    "abstractKey": null
-  };
-}();
-node.hash = "9c47030d7450494449d4aa5bda16e27e";
-export default node;