@reykjavik/webtools 0.1.21 → 0.1.23-canary.1

package/CHANGELOG.md

@@ -4,14 +4,21 @@
 
 - ... <!-- Add new lines here. -->
 
-## 0.1.21
+## 0.1.23-canary.1
+
+_2024-03-15_
+
+- feat: Add framework agnostic `@reykjavik/webtools/SiteImprove` module —
+  deprecate `@reykjavik/webtools/next/SiteImprove` instead
+
+## 0.1.21 – 0.1.22
 
 _2024-03-14_
 
 - feat: Add `@reykjavik/webtools/remix/Wait` component
 - feat: Add `@reykjavik/webtools/remix/http` module — with `isClientFetch`
   helper
-- feat: Add `@reykjavik/webtools/remix/async` module with promise helpers
+- feat: Add `@reykjavik/webtools/async` module with promise helpers
 
 ## 0.1.18 – 0.1.20
 

package/README.md

@@ -22,20 +22,24 @@ bun add @reykjavik/webtools
   - [`cacheControl` helper](#cachecontrol-helper)
     - [Type `TTLConfig`](#type-ttlconfig)
   - [`toSec` TTL helper](#tosec-ttl-helper)
-- [`@reykjavik/webtools/CookieHubConsent`](#reykjavikwebtoolscookiehubconsent)
-  - [`CookieHubProvider` component](#cookiehubprovider-component)
-  - [`useCookieHubConsent`](#usecookiehubconsent)
 - [`@reykjavik/webtools/async`](#reykjavikwebtoolsasync)
   - [`promiseAllObject`](#promiseallobject)
   - [`maxWait`](#maxwait)
+- [`@reykjavik/webtools/fixIcelandicLocale`](#reykjavikwebtoolsfixicelandiclocale)
+  - [Limitations](#limitations)
+- [`@reykjavik/webtools/SiteImprove`](#reykjavikwebtoolssiteimprove)
+  - [`SiteImprove` component](#siteimprove-component)
+  - [`pingSiteImprove` helper](#pingsiteimprove-helper)
+  - [`pingSiteImproveOutbound` helper](#pingsiteimproveoutbound-helper)
+- [`@reykjavik/webtools/CookieHubConsent`](#reykjavikwebtoolscookiehubconsent)
+  - [`CookieHubProvider` component](#cookiehubprovider-component)
+  - [`useCookieHubConsent`](#usecookiehubconsent)
 - [`@reykjavik/webtools/vanillaExtract`](#reykjavikwebtoolsvanillaextract)
   - [`vanillaGlobal`](#vanillaglobal)
   - [`vanillaProps`](#vanillaprops)
   - [`vanillaClass`](#vanillaclass)
   - [`vanillaClassNested`](#vanillaclassnested)
   - [`vanillaNest`](#vanillanest)
-- [`@reykjavik/webtools/fixIcelandicLocale`](#reykjavikwebtoolsfixicelandiclocale)
-  - [Limitations](#limitations)
 - [Framework Specific Tools](#framework-specific-tools)
   - [Next.js Tools](#nextjs-tools)
   - [Remix.run Tools](#remixrun-tools)
@@ -184,6 +188,216 @@ const ttlSec = toSec(ttl);
 
 ---
 
+## `@reykjavik/webtools/async`
+
+Contains a few small helpers for working with async functions and promises.
+
+---
+
+### `promiseAllObject`
+
+**Syntax:**
+`promiseAllObject<T extends PlainObj>(promisesMap: T>): Promise<{ [K in keyof T]: Awaited<T[K]>; }>`
+
+A variation of `Promise.all()` that accepts an object with named promises and
+returns a same-shaped object with the resolved values.
+
+```ts
+import { promiseAllObject } from '@reykjavik/webtools/async';
+
+const { user, posts } = await promiseAllObject({
+  user: fetchUser(),
+  posts: fetchPosts(),
+});
+```
+
+---
+
+### `maxWait`
+
+**Syntax:** `maxWait(timeout: number, promises: Array<any>): Promise<void>`  
+**Syntax:**
+`maxWait<T extends PlainObj>(timeout: number, promises: T): Promise<{ [K in keyof T]: { value: Awaited<T[K]> } | undefined }>`
+
+This somewhat esoteric helper resolves soon as all of the passed `promises`
+have resolved, or after `timeout` milliseconds — whichever comes first.
+
+If an object is passed, the resolved value will be an object with the same
+keys, with undefined values for any promises that didn't resolve in time, and
+the resolved values in a `value` container object.
+
+```ts
+import { maxWait } from '@reykjavik/webtools/async';
+
+const user = fetchUser();
+const posts = fetchPosts();
+
+// Array of promises resolves to void
+await maxWait(500, [user, posts]);
+
+// Object of promises resolves to an object with any resolved values at that time
+const { user, posts } = await maxWait(500, { user, posts });
+
+console.log(user?.value); // undefined | User
+console.log(posts?.value); // undefined | Array<Post>
+```
+
+---
+
+## `@reykjavik/webtools/fixIcelandicLocale`
+
+As of early 2004, Google Chrome still does not support the Icelandic locale
+`is`/`is-IS` in any way. Meanwhile other browsers have supported it for over a
+decade.
+
+This module does attempts to patches the following methods/classes by
+substituting the `is` locale with `da` (Danish) and apply a few post-hoc fixes
+to their return values.
+
+- `Intl.Collator` and `String.prototype.localeCompare`
+- `Intl.NumberFormat` and `Number.prototype.toLocaleString`
+- `Intl.DateTimeFormat` and `Date.prototype.toLocaleDateString`
+- `Intl.PluralRules`
+- `Intl.ListFormat`
+
+This provides usable (but not perfect) results, with some caveats listed
+below.
+
+To apply these patches, simply "side-effect import" this module at the top of
+your app's entry point:
+
+```ts
+import '@reykjavik/webtools/fixIcelandicLocale';
+
+// Then continue with your day and use `localeCompare` and other Intl.* methods
+// as you normally would. (See "limitations" below.)
+```
+
+(**NOTE** The patch is only applied in engines that fail a simple feature
+detection test.)
+
+### Limitations
+
+**`Intl.Collator` and `localeCompare`:**
+
+- It incorrectly treats `ð` and `d` as the same letter (most of the time), and
+  the acute-accented characters `á`, `é`, `í`, `ó`, `ú` and `ý` get lumped in
+  with their non-accented counterparts (unless the compared).  
+  We fix this only for the first letter in the string, but not for the rest of
+  it.
+
+**`Intl.NumberFormat` and `toLocaleString`:**
+
+- The `style: "unit"` option is not supported and prints units in Danish. (Soo
+  many units and unit-variants…)
+- The `currencyDisplay: "name"` option is not supported and prints the
+  currency's full name in Danish.
+
+**`Intl.DateTimeFormat` and `toLocaleDateString`:**
+
+- The `month: 'narrow'` and `weekday: 'narrow'` options are not supported, and
+  print the corresponding Danish initials.
+- For `timeZoneName` the values `"long"`, `"shortGeneric"` and `"longGeneric"`
+  will appear in Danish.
+- The `timeStyle: 'full'` option prints the timezone names in Danish
+- The `dayPeriod` option has a couple of slight mismatches, at 5 am and 12
+  noon.
+
+---
+
+## `@reykjavik/webtools/SiteImprove`
+
+Contains React helpers for loading SiteImprove's analytics scripts, and
+perform page-view and custom event tracking in applications with client-side
+(`pushState`) routing.
+
+### `SiteImprove` component
+
+A component for loading a SiteImprove analytics script and set up page-view
+tracking across URL routes.
+
+It also automatically logs all out-bound link clicks, to match the behavior of
+the vanilla SiteImprove script.
+
+**Props:**
+
+The Component's props have detailed JSDoc comments (displayed in your code
+editor), but there's a brief summary:
+
+- `accountId?: string` — Your SiteImprove account ID. (alternative to
+  `scriptUrl` prop).
+- `scriptUrl?: string` — The full SiteImprove analytics script URL.
+  (alternative to `accountId` prop).
+- `hasConsented?: boolean` — Manual GDPR 'analytics' consent flag. Allows hard
+  opt-out, but defers to
+  [`CookieHubProvider` values](./README.md#usecookiehubconsent) if they are
+  available.
+- `onLoad?: (e: unknown) => void` — Fires when the script has loaded.
+- `onError?: (e: unknown) => void` — Fires if loading the script failed.
+
+Example usage somewhere in your application:
+
+```js
+import { SiteImprove } from '@reykjavik/webtools/SiteImprove';
+
+// ideally emit this from your loader function
+const siteImproveAccountId = '[ACCOUNT_ID]'; // e.g. "7654321"
+
+   const location = useRouter()
+// ...then Inside root.tsx component:
+  <SiteImprove
+    accountId={siteImproveAccountId}
+    onError={(error) =>
+      Logger('error', 'An error occured initializing siteimprove', error)
+    }
+  />;
+```
+
+In dev mode it does NOT load the SiteImprove script and merely logs page-view
+events to the console.
+
+### `pingSiteImprove` helper
+
+**Syntax:**
+`pingSiteImprove(category: string, action: string, label?: string): void`
+
+A small helper for tracking custom UI events and reporting them to SiteImrove.
+
+It safely manages GDPR consent, so you can use it unconditionally.
+
+```js
+import { pingSiteImprove } from '@reykjavik/webtools/SiteImprove';
+
+const handleSubmit = () => {
+  // perform submit action...
+  if (success) {
+    pingSiteImprove('application', 'add_new');
+  }
+};
+```
+
+### `pingSiteImproveOutbound` helper
+
+**Syntax:** `pingSiteImproveOutbound(ourl: string): void`
+
+A small helper for reporting to SiteImrove when the user is programmatically
+being sent to a different URL/resource.
+
+```js
+import { pingSiteImproveOutbound } from '@reykjavik/webtools/SiteImprove';
+
+const handleSubmit = () => {
+  // perform submit action...
+  if (success) {
+    const fileUrl = '/download/report.pdf';
+    pingSiteImproveOutbound(fileUrl);
+    document.location.href = fileUrl;
+  }
+};
+```
+
+---
+
 ## `@reykjavik/webtools/CookieHubConsent`
 
 Contains React helpers for loading CookieHub's consent manager and reading
@@ -257,62 +471,6 @@ this hook will return an empty object.
 
 ---
 
-## `@reykjavik/webtools/async`
-
-Contains a few small helpers for working with async functions and promises.
-
----
-
-### `promiseAllObject`
-
-**Syntax:**
-`promiseAllObject<T extends PlainObj>(promisesMap: T>): Promise<{ [K in keyof T]: Awaited<T[K]>; }>`
-
-A variation of `Promise.all()` that accepts an object with named promises and
-returns a same-shaped object with the resolved values.
-
-```ts
-import { promiseAllObject } from '@reykjavik/webtools/async';
-
-const { user, posts } = await promiseAllObject({
-  user: fetchUser(),
-  posts: fetchPosts(),
-});
-```
-
----
-
-### `maxWait`
-
-**Syntax:** `maxWait(timeout: number, promises: Array<any>): Promise<void>`  
-**Syntax:**
-`maxWait<T extends PlainObj>(timeout: number, promises: T): Promise<{ [K in keyof T]: { value: Awaited<T[K]> } | undefined }>`
-
-This somewhat esoteric helper resolves soon as all of the passed `promises`
-have resolved, or after `timeout` milliseconds — whichever comes first.
-
-If an object is passed, the resolved value will be an object with the same
-keys, with undefined values for any promises that didn't resolve in time, and
-the resolved values in a `value` container object.
-
-```ts
-import { maxWait } from '@reykjavik/webtools/async';
-
-const user = fetchUser();
-const posts = fetchPosts();
-
-// Array of promises resolves to void
-await maxWait(500, [user, posts]);
-
-// Object of promises resolves to an object with any resolved values at that time
-const { user, posts } = await maxWait(500, { user, posts });
-
-console.log(user?.value); // undefined | User
-console.log(posts?.value); // undefined | Array<Post>
-```
-
----
-
 ## `@reykjavik/webtools/vanillaExtract`
 
 Contains helpers for writing [vanilla-extract](https://vanilla-extract.style)
@@ -486,67 +644,6 @@ vanillaGlobal(`
 
 ---
 
-## `@reykjavik/webtools/fixIcelandicLocale`
-
-As of early 2004, Google Chrome still does not support the Icelandic locale
-`is`/`is-IS` in any way. Meanwhile other browsers have supported it for over a
-decade.
-
-This module does attempts to patches the following methods/classes by
-substituting the `is` locale with `da` (Danish) and apply a few post-hoc fixes
-to their return values.
-
-- `Intl.Collator` and `String.prototype.localeCompare`
-- `Intl.NumberFormat` and `Number.prototype.toLocaleString`
-- `Intl.DateTimeFormat` and `Date.prototype.toLocaleDateString`
-- `Intl.PluralRules`
-- `Intl.ListFormat`
-
-This provides usable (but not perfect) results, with some caveats listed
-below.
-
-To apply these patches, simply "side-effect import" this module at the top of
-your app's entry point:
-
-```ts
-import '@reykjavik/webtools/fixIcelandicLocale';
-
-// Then continue with your day and use `localeCompare` and other Intl.* methods
-// as you normally would. (See "limitations" below.)
-```
-
-(**NOTE** The patch is only applied in engines that fail a simple feature
-detection test.)
-
-### Limitations
-
-**`Intl.Collator` and `localeCompare`:**
-
-- It incorrectly treats `ð` and `d` as the same letter (most of the time), and
-  the acute-accented characters `á`, `é`, `í`, `ó`, `ú` and `ý` get lumped in
-  with their non-accented counterparts (unless the compared).  
-  We fix this only for the first letter in the string, but not for the rest of
-  it.
-
-**`Intl.NumberFormat` and `toLocaleString`:**
-
-- The `style: "unit"` option is not supported and prints units in Danish. (Soo
-  many units and unit-variants…)
-- The `currencyDisplay: "name"` option is not supported and prints the
-  currency's full name in Danish.
-
-**`Intl.DateTimeFormat` and `toLocaleDateString`:**
-
-- The `month: 'narrow'` and `weekday: 'narrow'` options are not supported, and
-  print the corresponding Danish initials.
-- For `timeZoneName` the values `"long"`, `"shortGeneric"` and `"longGeneric"`
-  will appear in Danish.
-- The `timeStyle: 'full'` option prints the timezone names in Danish
-- The `dayPeriod` option has a couple of slight mismatches, at 5 am and 12
-  noon.
-
----
-
 ## Framework Specific Tools
 
 ---
@@ -556,8 +653,6 @@ detection test.)
 <a name="reykjavikwebtoolsnexthttp"></a> <a name="makeerrorizeapphoc"></a>
 <a name="showerrorpage-helper"></a> <a name="notmodified304-helper"></a>
 <a name="reykjavikwebtoolsnextsiteimprove"></a>
-<a name="siteimprove-component"></a> <a name="pingsiteimprove-helper"></a>
-<a name="pingsiteimproveoutbound-helper"></a>
 
 ### Next.js Tools
 

package/{esm/next/SiteImprove.privates.d.ts → SiteImprove.d.ts}

@@ -1,3 +1,4 @@
+import React from 'react';
 import { EitherObj } from '@reykjavik/hanna-utils';
 declare global {
     interface Window {
@@ -14,8 +15,8 @@ declare global {
         };
     }
 }
-export type SiteImproveEvent = SiteImprovePageView | SiteImproveRequest | SiteImproveCustomEvent;
-export type SiteImprovePageView = [
+type SiteImproveEvent = SiteImprovePageView | SiteImproveRequest | SiteImproveCustomEvent;
+type SiteImprovePageView = [
     type: 'trackdynamic',
     data: {
         /** New page URL */
@@ -26,7 +27,7 @@ export type SiteImprovePageView = [
         title?: string;
     }
 ];
-export type SiteImproveRequest = [
+type SiteImproveRequest = [
     type: 'request',
     data: {
         /** Outbound URL */
@@ -36,33 +37,25 @@ export type SiteImproveRequest = [
         autoonclick?: 1;
     }
 ];
-export type SiteImproveCustomEvent = [
+type SiteImproveCustomEvent = [
     type: 'event',
     category: string,
     action: string,
     label?: string
 ];
-/**
- * A small helper to send "trackdynamic" page view/load events to SiteImrove.
- *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#pingsiteimprove-helper
- */
-export declare const trackDynamicPageView: (url: string, refUrl?: string, title?: string) => void;
 /**
  * A small helper for tracking custom UI events and reporting them to SiteImrove.
  *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#pingsiteimprove-helper
+ * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README.md#pingsiteimprove-helper
  */
 export declare const pingSiteImprove: (category: string, action: string, label?: string) => void;
 /**
  * A small helper for reporting to SiteImrove when the user is programmatically
  * being sent to a different URL/resource.
  *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#pingsiteimproveoutbound-helper
+ * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README.md#pingsiteimproveoutbound-helper
  */
 export declare const pingSiteImproveOutbound: (ourl: string) => void;
-export declare const logOutboundLinks: () => () => void;
-export declare const makeScriptUrl: (accountId: string) => string;
 export type SiteImproveProps = EitherObj<{
     /**
      * Your SiteImprove account ID.
@@ -88,7 +81,7 @@ export type SiteImproveProps = EitherObj<{
      * A value of `true` still defers to the 'analytics' consent state provided
      * by the `CookieHubProvider` component (if present).
      */
-    hasConstented?: boolean;
+    hasConsented?: boolean;
     /**
      * Custom callback for when the SiteImprove script has loaded.
      */
@@ -98,3 +91,11 @@ export type SiteImproveProps = EitherObj<{
      */
     onError?: (e: unknown) => void;
 };
+/**
+ * A component for loading a SiteImprove analytics script and set up page-view
+ * tracking across client-side (pushState, replaceState) routing.
+ *
+ * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README.md#siteimprove-component
+ */
+export declare const SiteImprove: (props: SiteImproveProps) => React.JSX.Element | null;
+export {};

package/SiteImprove.js

@@ -0,0 +1,164 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.SiteImprove = exports.pingSiteImproveOutbound = exports.pingSiteImprove = void 0;
+const react_1 = __importStar(require("react"));
+const CookieHubConsent_js_1 = require("./CookieHubConsent.js");
+// END: Mock typing of SiteImprove's event tracking API
+// --------------------------------------------------------------------------
+//
+// ---------------------------------------------------------------------------
+const _emitEvent = typeof window === 'undefined'
+    ? () => undefined
+    : (event) => {
+        let _sz = window._sz;
+        if (!_sz) {
+            _sz = window._sz = [];
+            _sz._jit_defined_ = true;
+        }
+        _sz.push(event);
+        if (process.env.NODE_ENV === 'development') {
+            console.info('SiteImprove:', event);
+        }
+    };
+// ---------------------------------------------------------------------------
+/**
+ * A small helper to send "trackdynamic" page view/load events to SiteImrove.
+ */
+const trackDynamicPageView = (url, refUrl, title) => _emitEvent(['trackdynamic', { url, ref: refUrl, title }]);
+// ---------------------------------------------------------------------------
+/**
+ * A small helper for tracking custom UI events and reporting them to SiteImrove.
+ *
+ * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README.md#pingsiteimprove-helper
+ */
+const pingSiteImprove = (category, action, label) => {
+    if (process.env.NODE_ENV === 'development' &&
+        (!window._sz || window._sz._jit_defined_)) {
+        console.warn('`pingSiteImprove` was called before SiteImprove script was loaded.');
+    }
+    _emitEvent(['event', category, action, label]);
+};
+exports.pingSiteImprove = pingSiteImprove;
+// ---------------------------------------------------------------------------
+/**
+ * A small helper for reporting to SiteImrove when the user is programmatically
+ * being sent to a different URL/resource.
+ *
+ * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README.md#pingsiteimproveoutbound-helper
+ */
+const pingSiteImproveOutbound = (ourl) => {
+    if (process.env.NODE_ENV === 'development' &&
+        (!window._sz || window._sz._jit_defined_)) {
+        console.warn('`pingSiteImproveOutbound` was called before SiteImprove script was loaded.');
+    }
+    _emitEvent(['request', { ourl, ref: document.location.href }]);
+};
+exports.pingSiteImproveOutbound = pingSiteImproveOutbound;
+// ---------------------------------------------------------------------------
+const logOutboundLinks = () => {
+    const captureLinkClicks = (e) => {
+        const link = e.target.closest('a[href]');
+        if (!link || link.$$bound) {
+            return;
+        }
+        link.$$bound = true;
+        // Waiting for the bubble phase allows other click handlers to preventDefault()
+        link.addEventListener('click', (e) => {
+            var _a, _b;
+            if (e.defaultPrevented) {
+                return;
+            }
+            // Skip logging outbound request if SiteImprove has already done so.
+            // BTW, SiteImprove binds its autoonclick handlers on "mousedown"
+            // so they're guaranteed to have run before our "click" listener.
+            const events = (_b = (_a = window._sz) === null || _a === void 0 ? void 0 : _a.core) === null || _b === void 0 ? void 0 : _b.data;
+            const [type, data] = (events && events[events.length - 1]) || [];
+            if (type === 'request' && data.autoonclick && data.ourl === link.href) {
+                return;
+            }
+            (0, exports.pingSiteImproveOutbound)(link.href);
+        });
+    };
+    const { body } = document;
+    // bind 'click' listener to the capture phase
+    body.addEventListener('click', captureLinkClicks, true);
+    return () => body.removeEventListener('click', captureLinkClicks, true);
+};
+// ---------------------------------------------------------------------------
+const makeScriptUrl = (accountId) => `https://siteimproveanalytics.com/js/siteanalyze_${accountId}.js`;
+// ---------------------------------------------------------------------------
+const useResolvedAnalyticsConsent = (hasConsented) => {
+    const { analytics } = (0, CookieHubConsent_js_1.useCookieHubConsent)();
+    return ((analytics && hasConsented !== false) || (analytics === undefined && hasConsented));
+};
+// ---------------------------------------------------------------------------
+const mockSIGlobalIfNeeded = (props) => {
+    if (process.env.NODE_ENV !== 'production') {
+        console.info('Mock loading SiteImprove in development mode.', props.scriptUrl || props.accountId);
+        if (!window._sz) {
+            setTimeout(() => {
+                window._sz = window._sz || [];
+            }, 300);
+        }
+    }
+};
+// ===========================================================================
+let lastUrl = '';
+/**
+ * A component for loading a SiteImprove analytics script and set up page-view
+ * tracking across client-side (pushState, replaceState) routing.
+ *
+ * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README.md#siteimprove-component
+ */
+const SiteImprove = (props) => {
+    var _a;
+    const consented = useResolvedAnalyticsConsent(props.hasConsented);
+    const { pathname, search, hash } = typeof document !== 'undefined'
+        ? document.location
+        : { pathname: '.', search: '', hash: '' };
+    const thisUrl = pathname + search + hash;
+    (0, react_1.useEffect)(() => {
+        if (consented && lastUrl && thisUrl !== lastUrl) {
+            trackDynamicPageView(thisUrl, lastUrl, document.title);
+            lastUrl = thisUrl;
+        }
+    }, [consented, thisUrl]);
+    (0, react_1.useEffect)(() => {
+        if (!consented) {
+            return;
+        }
+        mockSIGlobalIfNeeded(props);
+        return logOutboundLinks();
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [consented]);
+    if (!consented || process.env.NODE_ENV !== 'production') {
+        return null;
+    }
+    const scriptUrl = (_a = props.scriptUrl) !== null && _a !== void 0 ? _a : makeScriptUrl(props.accountId);
+    return react_1.default.createElement("script", { defer: true, src: scriptUrl, onLoad: props.onLoad, onError: props.onError });
+};
+exports.SiteImprove = SiteImprove;

package/{next/SiteImprove.privates.d.ts → esm/SiteImprove.d.ts}

@@ -1,3 +1,4 @@
+import React from 'react';
 import { EitherObj } from '@reykjavik/hanna-utils';
 declare global {
     interface Window {
@@ -14,8 +15,8 @@ declare global {
         };
     }
 }
-export type SiteImproveEvent = SiteImprovePageView | SiteImproveRequest | SiteImproveCustomEvent;
-export type SiteImprovePageView = [
+type SiteImproveEvent = SiteImprovePageView | SiteImproveRequest | SiteImproveCustomEvent;
+type SiteImprovePageView = [
     type: 'trackdynamic',
     data: {
         /** New page URL */
@@ -26,7 +27,7 @@ export type SiteImprovePageView = [
         title?: string;
     }
 ];
-export type SiteImproveRequest = [
+type SiteImproveRequest = [
     type: 'request',
     data: {
         /** Outbound URL */
@@ -36,33 +37,25 @@ export type SiteImproveRequest = [
         autoonclick?: 1;
     }
 ];
-export type SiteImproveCustomEvent = [
+type SiteImproveCustomEvent = [
     type: 'event',
     category: string,
     action: string,
     label?: string
 ];
-/**
- * A small helper to send "trackdynamic" page view/load events to SiteImrove.
- *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#pingsiteimprove-helper
- */
-export declare const trackDynamicPageView: (url: string, refUrl?: string, title?: string) => void;
 /**
  * A small helper for tracking custom UI events and reporting them to SiteImrove.
  *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#pingsiteimprove-helper
+ * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README.md#pingsiteimprove-helper
  */
 export declare const pingSiteImprove: (category: string, action: string, label?: string) => void;
 /**
  * A small helper for reporting to SiteImrove when the user is programmatically
  * being sent to a different URL/resource.
  *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#pingsiteimproveoutbound-helper
+ * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README.md#pingsiteimproveoutbound-helper
  */
 export declare const pingSiteImproveOutbound: (ourl: string) => void;
-export declare const logOutboundLinks: () => () => void;
-export declare const makeScriptUrl: (accountId: string) => string;
 export type SiteImproveProps = EitherObj<{
     /**
      * Your SiteImprove account ID.
@@ -88,7 +81,7 @@ export type SiteImproveProps = EitherObj<{
      * A value of `true` still defers to the 'analytics' consent state provided
      * by the `CookieHubProvider` component (if present).
      */
-    hasConstented?: boolean;
+    hasConsented?: boolean;
     /**
      * Custom callback for when the SiteImprove script has loaded.
      */
@@ -98,3 +91,11 @@ export type SiteImproveProps = EitherObj<{
      */
     onError?: (e: unknown) => void;
 };
+/**
+ * A component for loading a SiteImprove analytics script and set up page-view
+ * tracking across client-side (pushState, replaceState) routing.
+ *
+ * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README.md#siteimprove-component
+ */
+export declare const SiteImprove: (props: SiteImproveProps) => React.JSX.Element | null;
+export {};

package/{next/SiteImprove.privates.js → esm/SiteImprove.js}

@@ -1,6 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.makeScriptUrl = exports.logOutboundLinks = exports.pingSiteImproveOutbound = exports.pingSiteImprove = exports.trackDynamicPageView = void 0;
+import React, { useEffect } from 'react';
+import { useCookieHubConsent } from './CookieHubConsent.js';
 // END: Mock typing of SiteImprove's event tracking API
 // --------------------------------------------------------------------------
 //
@@ -21,40 +20,35 @@ const _emitEvent = typeof window === 'undefined'
 // ---------------------------------------------------------------------------
 /**
  * A small helper to send "trackdynamic" page view/load events to SiteImrove.
- *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#pingsiteimprove-helper
  */
 const trackDynamicPageView = (url, refUrl, title) => _emitEvent(['trackdynamic', { url, ref: refUrl, title }]);
-exports.trackDynamicPageView = trackDynamicPageView;
 // ---------------------------------------------------------------------------
 /**
  * A small helper for tracking custom UI events and reporting them to SiteImrove.
  *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#pingsiteimprove-helper
+ * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README.md#pingsiteimprove-helper
  */
-const pingSiteImprove = (category, action, label) => {
+export const pingSiteImprove = (category, action, label) => {
     if (process.env.NODE_ENV === 'development' &&
         (!window._sz || window._sz._jit_defined_)) {
         console.warn('`pingSiteImprove` was called before SiteImprove script was loaded.');
     }
     _emitEvent(['event', category, action, label]);
 };
-exports.pingSiteImprove = pingSiteImprove;
 // ---------------------------------------------------------------------------
 /**
  * A small helper for reporting to SiteImrove when the user is programmatically
  * being sent to a different URL/resource.
  *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#pingsiteimproveoutbound-helper
+ * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README.md#pingsiteimproveoutbound-helper
  */
-const pingSiteImproveOutbound = (ourl) => {
+export const pingSiteImproveOutbound = (ourl) => {
     if (process.env.NODE_ENV === 'development' &&
         (!window._sz || window._sz._jit_defined_)) {
         console.warn('`pingSiteImproveOutbound` was called before SiteImprove script was loaded.');
     }
     _emitEvent(['request', { ourl, ref: document.location.href }]);
 };
-exports.pingSiteImproveOutbound = pingSiteImproveOutbound;
 // ---------------------------------------------------------------------------
 const logOutboundLinks = () => {
     const captureLinkClicks = (e) => {
@@ -77,7 +71,7 @@ const logOutboundLinks = () => {
             if (type === 'request' && data.autoonclick && data.ourl === link.href) {
                 return;
             }
-            (0, exports.pingSiteImproveOutbound)(link.href);
+            pingSiteImproveOutbound(link.href);
         });
     };
     const { body } = document;
@@ -85,7 +79,57 @@ const logOutboundLinks = () => {
     body.addEventListener('click', captureLinkClicks, true);
     return () => body.removeEventListener('click', captureLinkClicks, true);
 };
-exports.logOutboundLinks = logOutboundLinks;
 // ---------------------------------------------------------------------------
 const makeScriptUrl = (accountId) => `https://siteimproveanalytics.com/js/siteanalyze_${accountId}.js`;
-exports.makeScriptUrl = makeScriptUrl;
+// ---------------------------------------------------------------------------
+const useResolvedAnalyticsConsent = (hasConsented) => {
+    const { analytics } = useCookieHubConsent();
+    return ((analytics && hasConsented !== false) || (analytics === undefined && hasConsented));
+};
+// ---------------------------------------------------------------------------
+const mockSIGlobalIfNeeded = (props) => {
+    if (process.env.NODE_ENV !== 'production') {
+        console.info('Mock loading SiteImprove in development mode.', props.scriptUrl || props.accountId);
+        if (!window._sz) {
+            setTimeout(() => {
+                window._sz = window._sz || [];
+            }, 300);
+        }
+    }
+};
+// ===========================================================================
+let lastUrl = '';
+/**
+ * A component for loading a SiteImprove analytics script and set up page-view
+ * tracking across client-side (pushState, replaceState) routing.
+ *
+ * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README.md#siteimprove-component
+ */
+export const SiteImprove = (props) => {
+    var _a;
+    const consented = useResolvedAnalyticsConsent(props.hasConsented);
+    const { pathname, search, hash } = typeof document !== 'undefined'
+        ? document.location
+        : { pathname: '.', search: '', hash: '' };
+    const thisUrl = pathname + search + hash;
+    useEffect(() => {
+        if (consented && lastUrl && thisUrl !== lastUrl) {
+            trackDynamicPageView(thisUrl, lastUrl, document.title);
+            lastUrl = thisUrl;
+        }
+    }, [consented, thisUrl]);
+    useEffect(() => {
+        if (!consented) {
+            return;
+        }
+        mockSIGlobalIfNeeded(props);
+        return logOutboundLinks();
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [consented]);
+    if (!consented || process.env.NODE_ENV !== 'production') {
+        return null;
+    }
+    const scriptUrl = (_a = props.scriptUrl) !== null && _a !== void 0 ? _a : makeScriptUrl(props.accountId);
+    return React.createElement("script", { defer: true, src: scriptUrl, onLoad: props.onLoad, onError: props.onError });
+};

package/esm/index.d.ts

@@ -3,6 +3,7 @@
 /// <reference path="./async.d.ts" />
 /// <reference path="./fixIcelandicLocale.d.ts" />
 /// <reference path="./remix/http.d.ts" />
+/// <reference path="./SiteImprove.d.tsx" />
 /// <reference path="./CookieHubConsent.d.tsx" />
 /// <reference path="./remix/Wait.d.tsx" />
 /// <reference path="./next/SiteImprove.d.tsx" />

package/esm/next/SiteImprove.d.ts

@@ -1,11 +1,10 @@
-import React from 'react';
-import { SiteImproveProps } from './SiteImprove.privates.js';
-export type { SiteImproveProps } from './SiteImprove.privates.js';
-export { pingSiteImprove, pingSiteImproveOutbound } from './SiteImprove.privates.js';
-/**
- * A component for loading a SiteImprove analytics script and set up page-view
- * tracking across Next.js routes.
- *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#siteimprove-component
- */
-export declare const SiteImprove: (props: SiteImproveProps) => React.JSX.Element | null;
+/// <reference types="react" resolution-mode="require"/>
+import { SiteImproveProps as _SiteImproveProps } from '../SiteImprove.js';
+/** @deprecated Instead import from `@reykjavik/webtools/SiteImprove`  (Will be removed in v0.2) */
+export type SiteImproveProps = _SiteImproveProps;
+/** @deprecated Instead import from `@reykjavik/webtools/SiteImprove`  (Will be removed in v0.2) */
+export declare const SiteImprove: (props: _SiteImproveProps) => import("react").JSX.Element | null;
+/** @deprecated Instead import from `@reykjavik/webtools/SiteImprove`  (Will be removed in v0.2) */
+export declare const pingSiteImprove: (category: string, action: string, label?: string | undefined) => void;
+/** @deprecated Instead import from `@reykjavik/webtools/SiteImprove`  (Will be removed in v0.2) */
+export declare const pingSiteImproveOutbound: (ourl: string) => void;

package/esm/next/SiteImprove.js

@@ -1,75 +1,7 @@
-import React, { useEffect } from 'react';
-import { Router } from 'next/router.js';
-import NextScript from 'next/script.js';
-import { useCookieHubConsent } from '../CookieHubConsent.js';
-import { logOutboundLinks, makeScriptUrl, trackDynamicPageView, } from './SiteImprove.privates.js';
-// Fixes an issue with `next/script`'s types and mixture of default and named exports.
-// This workaround doesn't seem to be necessary in Next.js 13.5 (pages router), but
-// is definitely needed for the webpack bundler used by Next.js 11. (v12 is untested.)
-const Script = ('__esModule' in NextScript && 'default' in NextScript
-    ? NextScript.default
-    : NextScript);
-// ---------------------------------------------------------------------------
-/*
-  SiteImprove's "trackdynamic" (page view) event requires both the new URL
-  and the old (referer) URL.
-  Next router's `routeChangeComplete` (which is the correct point in time
-  to send the tracking event) does not provide access to the previous URL,
-  so we need to capture it during `routeChangeStart`.
-  We feel it's safe to assume that every `routeChangeComplete` event
-  always fires directly after its `routeChangeStart` counterpart,
-  and it is thus safe to simply store the old URL in a local variable.
-  This may look dodgy, but should prove reasonably safe in practice.
-*/
-let _refUrl = '';
-const captureRefUrl = () => {
-    _refUrl = document.location.pathname + document.location.search;
-};
-const sendRoutingEvent = (url) => {
-    // On `history.back()`/`history.forward()` the URL change happens before
-    // `routeChangeStart`, so `refUrl` and `url` become the same.
-    // in that case we suppress the `ref`
-    const refUrl = _refUrl !== url ? _refUrl : undefined;
-    trackDynamicPageView(url, refUrl, document.title);
-};
-export { pingSiteImprove, pingSiteImproveOutbound } from './SiteImprove.privates.js';
-/**
- * A component for loading a SiteImprove analytics script and set up page-view
- * tracking across Next.js routes.
- *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#siteimprove-component
- */
-export const SiteImprove = (props) => {
-    const { analytics } = useCookieHubConsent();
-    const consented = (analytics && props.hasConstented !== false) ||
-        (analytics === undefined && props.hasConstented);
-    useEffect(() => {
-        if (!consented) {
-            return;
-        }
-        if (process.env.NODE_ENV !== 'production') {
-            console.info('Mock loading SiteImprove in development mode.', props.scriptUrl || props.accountId);
-            if (!window._sz) {
-                setTimeout(() => {
-                    window._sz = window._sz || [];
-                }, 300);
-            }
-        }
-        const routerEvents = Router.events;
-        routerEvents.on('routeChangeStart', captureRefUrl);
-        routerEvents.on('routeChangeComplete', sendRoutingEvent);
-        const stopLoggingOutboundLinks = logOutboundLinks();
-        return () => {
-            routerEvents.off('routeChangeStart', captureRefUrl);
-            routerEvents.off('routeChangeComplete', sendRoutingEvent);
-            stopLoggingOutboundLinks();
-        };
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [consented]);
-    if (!consented || process.env.NODE_ENV !== 'production') {
-        return null;
-    }
-    const scriptUrl = props.scriptUrl != null ? props.scriptUrl : makeScriptUrl(props.accountId);
-    return (React.createElement(Script, { type: "text/javascript", strategy: "afterInteractive", src: scriptUrl, onLoad: props.onLoad, onError: props.onError }));
-};
+import { pingSiteImprove as _pingSiteImprove, pingSiteImproveOutbound as _pingSiteImproveOutbound, SiteImprove as _SiteImprove, } from '../SiteImprove.js';
+/** @deprecated Instead import from `@reykjavik/webtools/SiteImprove`  (Will be removed in v0.2) */
+export const SiteImprove = _SiteImprove;
+/** @deprecated Instead import from `@reykjavik/webtools/SiteImprove`  (Will be removed in v0.2) */
+export const pingSiteImprove = _pingSiteImprove;
+/** @deprecated Instead import from `@reykjavik/webtools/SiteImprove`  (Will be removed in v0.2) */
+export const pingSiteImproveOutbound = _pingSiteImproveOutbound;

package/esm/next/http.d.ts

@@ -35,7 +35,7 @@ export declare const makeErrorizeAppHOC: <EP extends Partial<ErrorProps>>(ErrorP
     }>(App: AppType<P>): React.FunctionComponent<import("next/dist/shared/lib/utils.js").AppPropsType<any, P | ({
         __error: ErrorProps;
     } & Omit<ErrorProps & EP, keyof ErrorProps>)>> & {
-        getInitialProps?(context: import("next/dist/shared/lib/utils.js").AppContextType<import("next/router.js").NextRouter>): P | ({
+        getInitialProps?(context: import("next/dist/shared/lib/utils.js").AppContextType<import("next/dist/client/router.js").NextRouter>): P | ({
             __error: ErrorProps;
         } & Omit<ErrorProps & EP, keyof ErrorProps>) | Promise<P | ({
             __error: ErrorProps;

package/esm/remix/Wait.d.ts

@@ -18,12 +18,12 @@ type WaitFallbacks = {
     /**
      * Custom loading/spinner component.
      */
-    meanwhile?: Exclude<ReactNode, number>;
+    meanwhile?: ReactNode;
     /**
      * Custom error component if the promise is rejected or if it resolves to an
      * object with an `error` property.
      */
-    error?: Exclude<ReactNode, number>;
+    error?: ReactNode;
 };
 export type WaitProps<T> = WaitPropsBase<T> & WaitFallbacks;
 /**

package/index.d.ts

@@ -3,6 +3,7 @@
 /// <reference path="./async.d.ts" />
 /// <reference path="./fixIcelandicLocale.d.ts" />
 /// <reference path="./remix/http.d.ts" />
+/// <reference path="./SiteImprove.d.tsx" />
 /// <reference path="./CookieHubConsent.d.tsx" />
 /// <reference path="./remix/Wait.d.tsx" />
 /// <reference path="./next/SiteImprove.d.tsx" />

package/next/SiteImprove.d.ts

@@ -1,11 +1,10 @@
-import React from 'react';
-import { SiteImproveProps } from './SiteImprove.privates.js';
-export type { SiteImproveProps } from './SiteImprove.privates.js';
-export { pingSiteImprove, pingSiteImproveOutbound } from './SiteImprove.privates.js';
-/**
- * A component for loading a SiteImprove analytics script and set up page-view
- * tracking across Next.js routes.
- *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#siteimprove-component
- */
-export declare const SiteImprove: (props: SiteImproveProps) => React.JSX.Element | null;
+/// <reference types="react" />
+import { SiteImproveProps as _SiteImproveProps } from '../SiteImprove.js';
+/** @deprecated Instead import from `@reykjavik/webtools/SiteImprove`  (Will be removed in v0.2) */
+export type SiteImproveProps = _SiteImproveProps;
+/** @deprecated Instead import from `@reykjavik/webtools/SiteImprove`  (Will be removed in v0.2) */
+export declare const SiteImprove: (props: _SiteImproveProps) => import("react").JSX.Element | null;
+/** @deprecated Instead import from `@reykjavik/webtools/SiteImprove`  (Will be removed in v0.2) */
+export declare const pingSiteImprove: (category: string, action: string, label?: string | undefined) => void;
+/** @deprecated Instead import from `@reykjavik/webtools/SiteImprove`  (Will be removed in v0.2) */
+export declare const pingSiteImproveOutbound: (ourl: string) => void;

package/next/SiteImprove.js

@@ -1,107 +1,10 @@
 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.SiteImprove = exports.pingSiteImproveOutbound = exports.pingSiteImprove = void 0;
-const react_1 = __importStar(require("react"));
-const router_js_1 = require("next/router.js");
-const script_js_1 = __importDefault(require("next/script.js"));
-const CookieHubConsent_js_1 = require("../CookieHubConsent.js");
-const SiteImprove_privates_js_1 = require("./SiteImprove.privates.js");
-// Fixes an issue with `next/script`'s types and mixture of default and named exports.
-// This workaround doesn't seem to be necessary in Next.js 13.5 (pages router), but
-// is definitely needed for the webpack bundler used by Next.js 11. (v12 is untested.)
-const Script = ('__esModule' in script_js_1.default && 'default' in script_js_1.default
-    ? script_js_1.default.default
-    : script_js_1.default);
-// ---------------------------------------------------------------------------
-/*
-  SiteImprove's "trackdynamic" (page view) event requires both the new URL
-  and the old (referer) URL.
-  Next router's `routeChangeComplete` (which is the correct point in time
-  to send the tracking event) does not provide access to the previous URL,
-  so we need to capture it during `routeChangeStart`.
-  We feel it's safe to assume that every `routeChangeComplete` event
-  always fires directly after its `routeChangeStart` counterpart,
-  and it is thus safe to simply store the old URL in a local variable.
-  This may look dodgy, but should prove reasonably safe in practice.
-*/
-let _refUrl = '';
-const captureRefUrl = () => {
-    _refUrl = document.location.pathname + document.location.search;
-};
-const sendRoutingEvent = (url) => {
-    // On `history.back()`/`history.forward()` the URL change happens before
-    // `routeChangeStart`, so `refUrl` and `url` become the same.
-    // in that case we suppress the `ref`
-    const refUrl = _refUrl !== url ? _refUrl : undefined;
-    (0, SiteImprove_privates_js_1.trackDynamicPageView)(url, refUrl, document.title);
-};
-var SiteImprove_privates_js_2 = require("./SiteImprove.privates.js");
-Object.defineProperty(exports, "pingSiteImprove", { enumerable: true, get: function () { return SiteImprove_privates_js_2.pingSiteImprove; } });
-Object.defineProperty(exports, "pingSiteImproveOutbound", { enumerable: true, get: function () { return SiteImprove_privates_js_2.pingSiteImproveOutbound; } });
-/**
- * A component for loading a SiteImprove analytics script and set up page-view
- * tracking across Next.js routes.
- *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#siteimprove-component
- */
-const SiteImprove = (props) => {
-    const { analytics } = (0, CookieHubConsent_js_1.useCookieHubConsent)();
-    const consented = (analytics && props.hasConstented !== false) ||
-        (analytics === undefined && props.hasConstented);
-    (0, react_1.useEffect)(() => {
-        if (!consented) {
-            return;
-        }
-        if (process.env.NODE_ENV !== 'production') {
-            console.info('Mock loading SiteImprove in development mode.', props.scriptUrl || props.accountId);
-            if (!window._sz) {
-                setTimeout(() => {
-                    window._sz = window._sz || [];
-                }, 300);
-            }
-        }
-        const routerEvents = router_js_1.Router.events;
-        routerEvents.on('routeChangeStart', captureRefUrl);
-        routerEvents.on('routeChangeComplete', sendRoutingEvent);
-        const stopLoggingOutboundLinks = (0, SiteImprove_privates_js_1.logOutboundLinks)();
-        return () => {
-            routerEvents.off('routeChangeStart', captureRefUrl);
-            routerEvents.off('routeChangeComplete', sendRoutingEvent);
-            stopLoggingOutboundLinks();
-        };
-    }, 
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    [consented]);
-    if (!consented || process.env.NODE_ENV !== 'production') {
-        return null;
-    }
-    const scriptUrl = props.scriptUrl != null ? props.scriptUrl : (0, SiteImprove_privates_js_1.makeScriptUrl)(props.accountId);
-    return (react_1.default.createElement(Script, { type: "text/javascript", strategy: "afterInteractive", src: scriptUrl, onLoad: props.onLoad, onError: props.onError }));
-};
-exports.SiteImprove = SiteImprove;
+exports.pingSiteImproveOutbound = exports.pingSiteImprove = exports.SiteImprove = void 0;
+const SiteImprove_js_1 = require("../SiteImprove.js");
+/** @deprecated Instead import from `@reykjavik/webtools/SiteImprove`  (Will be removed in v0.2) */
+exports.SiteImprove = SiteImprove_js_1.SiteImprove;
+/** @deprecated Instead import from `@reykjavik/webtools/SiteImprove`  (Will be removed in v0.2) */
+exports.pingSiteImprove = SiteImprove_js_1.pingSiteImprove;
+/** @deprecated Instead import from `@reykjavik/webtools/SiteImprove`  (Will be removed in v0.2) */
+exports.pingSiteImproveOutbound = SiteImprove_js_1.pingSiteImproveOutbound;

package/next/http.d.ts

@@ -35,7 +35,7 @@ export declare const makeErrorizeAppHOC: <EP extends Partial<ErrorProps>>(ErrorP
     }>(App: AppType<P>): React.FunctionComponent<import("next/dist/shared/lib/utils.js").AppPropsType<any, P | ({
         __error: ErrorProps;
     } & Omit<ErrorProps & EP, keyof ErrorProps>)>> & {
-        getInitialProps?(context: import("next/dist/shared/lib/utils.js").AppContextType<import("next/router.js").NextRouter>): P | ({
+        getInitialProps?(context: import("next/dist/shared/lib/utils.js").AppContextType<import("next/dist/client/router.js").NextRouter>): P | ({
             __error: ErrorProps;
         } & Omit<ErrorProps & EP, keyof ErrorProps>) | Promise<P | ({
             __error: ErrorProps;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@reykjavik/webtools",
-	"version": "0.1.21",
+	"version": "0.1.23-canary.1",
 	"description": "Misc. JS/TS helpers used by Reykjavík City's web dev teams.",
 	"main": "index.js",
 	"repository": "ssh://git@github.com:reykjavikcity/webtools.git",
@@ -68,6 +68,10 @@
 			"import": "./esm/remix/http.js",
 			"require": "./remix/http.js"
 		},
+		"./SiteImprove": {
+			"import": "./esm/SiteImprove.js",
+			"require": "./SiteImprove.js"
+		},
 		"./CookieHubConsent": {
 			"import": "./esm/CookieHubConsent.js",
 			"require": "./CookieHubConsent.js"

package/remix/Wait.d.ts

@@ -18,12 +18,12 @@ type WaitFallbacks = {
     /**
      * Custom loading/spinner component.
      */
-    meanwhile?: Exclude<ReactNode, number>;
+    meanwhile?: ReactNode;
     /**
      * Custom error component if the promise is rejected or if it resolves to an
      * object with an `error` property.
      */
-    error?: Exclude<ReactNode, number>;
+    error?: ReactNode;
 };
 export type WaitProps<T> = WaitPropsBase<T> & WaitFallbacks;
 /**

package/esm/next/SiteImprove.privates.js

@@ -1,83 +0,0 @@
-// END: Mock typing of SiteImprove's event tracking API
-// --------------------------------------------------------------------------
-//
-// ---------------------------------------------------------------------------
-const _emitEvent = typeof window === 'undefined'
-    ? () => undefined
-    : (event) => {
-        let _sz = window._sz;
-        if (!_sz) {
-            _sz = window._sz = [];
-            _sz._jit_defined_ = true;
-        }
-        _sz.push(event);
-        if (process.env.NODE_ENV === 'development') {
-            console.info('SiteImprove:', event);
-        }
-    };
-// ---------------------------------------------------------------------------
-/**
- * A small helper to send "trackdynamic" page view/load events to SiteImrove.
- *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#pingsiteimprove-helper
- */
-export const trackDynamicPageView = (url, refUrl, title) => _emitEvent(['trackdynamic', { url, ref: refUrl, title }]);
-// ---------------------------------------------------------------------------
-/**
- * A small helper for tracking custom UI events and reporting them to SiteImrove.
- *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#pingsiteimprove-helper
- */
-export const pingSiteImprove = (category, action, label) => {
-    if (process.env.NODE_ENV === 'development' &&
-        (!window._sz || window._sz._jit_defined_)) {
-        console.warn('`pingSiteImprove` was called before SiteImprove script was loaded.');
-    }
-    _emitEvent(['event', category, action, label]);
-};
-// ---------------------------------------------------------------------------
-/**
- * A small helper for reporting to SiteImrove when the user is programmatically
- * being sent to a different URL/resource.
- *
- * @see https://github.com/reykjavikcity/webtools/blob/v0.1/README-nextjs.md#pingsiteimproveoutbound-helper
- */
-export const pingSiteImproveOutbound = (ourl) => {
-    if (process.env.NODE_ENV === 'development' &&
-        (!window._sz || window._sz._jit_defined_)) {
-        console.warn('`pingSiteImproveOutbound` was called before SiteImprove script was loaded.');
-    }
-    _emitEvent(['request', { ourl, ref: document.location.href }]);
-};
-// ---------------------------------------------------------------------------
-export const logOutboundLinks = () => {
-    const captureLinkClicks = (e) => {
-        const link = e.target.closest('a[href]');
-        if (!link || link.$$bound) {
-            return;
-        }
-        link.$$bound = true;
-        // Waiting for the bubble phase allows other click handlers to preventDefault()
-        link.addEventListener('click', (e) => {
-            var _a, _b;
-            if (e.defaultPrevented) {
-                return;
-            }
-            // Skip logging outbound request if SiteImprove has already done so.
-            // BTW, SiteImprove binds its autoonclick handlers on "mousedown"
-            // so they're guaranteed to have run before our "click" listener.
-            const events = (_b = (_a = window._sz) === null || _a === void 0 ? void 0 : _a.core) === null || _b === void 0 ? void 0 : _b.data;
-            const [type, data] = (events && events[events.length - 1]) || [];
-            if (type === 'request' && data.autoonclick && data.ourl === link.href) {
-                return;
-            }
-            pingSiteImproveOutbound(link.href);
-        });
-    };
-    const { body } = document;
-    // bind 'click' listener to the capture phase
-    body.addEventListener('click', captureLinkClicks, true);
-    return () => body.removeEventListener('click', captureLinkClicks, true);
-};
-// ---------------------------------------------------------------------------
-export const makeScriptUrl = (accountId) => `https://siteimproveanalytics.com/js/siteanalyze_${accountId}.js`;