fontdue-js 3.11.0 → 3.12.1

package/dist/components/TypeTester/usePrefetchWhenNear.js

@@ -0,0 +1,69 @@
+import { useEffect, useRef } from 'react';
+
+// How far outside the viewport a tester counts as "near".
+export const PREFETCH_ROOT_MARGIN = '300px';
+// Upper bound on waiting for the browser to go idle.
+export const PREFETCH_IDLE_TIMEOUT = 2000;
+function onIdle(cb) {
+  if (typeof window.requestIdleCallback === 'function') {
+    const id = window.requestIdleCallback(cb, {
+      timeout: PREFETCH_IDLE_TIMEOUT
+    });
+    return {
+      cancel: () => window.cancelIdleCallback(id)
+    };
+  }
+  // Safari has no requestIdleCallback.
+  const id = window.setTimeout(cb, 200);
+  return {
+    cancel: () => window.clearTimeout(id)
+  };
+}
+
+/**
+ * Calls `prefetch` once, at idle time, after the element first comes near the
+ * viewport. Native `<select>` menus snapshot their options when they open (in
+ * Safari the open menu never updates), so data a dropdown needs has to be
+ * there before the first click – fetching on mousedown is too late. Waiting
+ * for idle keeps the request off the initial render, and waiting for the
+ * viewport keeps a long page of testers from fetching for every one at once.
+ *
+ *     const ref = useRef<HTMLDivElement>(null);
+ *     usePrefetchWhenNear(ref, loadOptions);
+ */
+export default function usePrefetchWhenNear(ref, prefetch) {
+  const prefetchRef = useRef(prefetch);
+  prefetchRef.current = prefetch;
+  useEffect(() => {
+    const el = ref.current;
+    if (!el) return;
+    let idle = null;
+    const schedule = () => {
+      idle ??= onIdle(() => {
+        var _prefetchRef$current;
+        return (_prefetchRef$current = prefetchRef.current) === null || _prefetchRef$current === void 0 ? void 0 : _prefetchRef$current.call(prefetchRef);
+      });
+    };
+    if (typeof IntersectionObserver !== 'function') {
+      schedule();
+      return () => {
+        var _idle;
+        return (_idle = idle) === null || _idle === void 0 ? void 0 : _idle.cancel();
+      };
+    }
+    const observer = new IntersectionObserver(entries => {
+      if (entries.some(entry => entry.isIntersecting)) {
+        observer.disconnect();
+        schedule();
+      }
+    }, {
+      rootMargin: PREFETCH_ROOT_MARGIN
+    });
+    observer.observe(el);
+    return () => {
+      var _idle2;
+      observer.disconnect();
+      (_idle2 = idle) === null || _idle2 === void 0 ? void 0 : _idle2.cancel();
+    };
+  }, [ref]);
+}

package/dist/fontdue.css

@@ -4007,6 +4007,7 @@ input:disabled + .fontdue-admin-toolbar__switch {
 
 fontdue-test-fonts-form,
 fontdue-newsletter-signup,
-fontdue-customer-login-form {
+fontdue-customer-login-form,
+fontdue-customer-sign-in {
   font-size: 1rem;
 }

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.11.0";
+export const version = "3.12.1";

package/package.json

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