@reykjavik/webtools 0.0.0

package/esm/CookieHubConsent.js

@@ -0,0 +1,99 @@
+import React, { createContext, useContext, useEffect, useState } from 'react';
+// END: Mock typing of CookieHub's script API
+// --------------------------------------------------------------------------
+//
+// ---------------------------------------------------------------------------
+const idToken = '[ACCOUNT_ID]';
+const scriptUrlTemplate = process.env.NODE_ENV === 'production'
+    ? `https://cookiehub.net/c2/${idToken}.js`
+    : `https://cookiehub.net/dev/${idToken}.js`;
+const CookieHubContext = createContext(undefined);
+/**
+ * Used as the initial/default state when CookieHubProvider mounts and
+ * prepares to load the script
+ */
+const initialConsentState = {
+    consent: {
+        analytics: false,
+        preferences: false,
+        marketing: false,
+        uncategorized: false,
+    },
+};
+/**
+ * Moves the CookieHub `<div/>` to the bottom of the dom tree
+ * for better accessability in screen readers.
+ */
+const moveCookiehubScriptInDomTree = () => {
+    const cookieHubPromptElm = document.querySelector('.ch2');
+    if (cookieHubPromptElm) {
+        document.body.append(cookieHubPromptElm);
+    }
+};
+/**
+ * This context provider component loads and initialises the CookieHub consent
+ * management script and sets up a React state object with the relevant user
+ * consent flags.
+ *
+ * @see https://github.com/reykjavikcity/webtools/tree/v0.1##cookiehubprovider-component
+ */
+export const CookieHubProvider = (props) => {
+    const [state, setState] = useState(initialConsentState);
+    useEffect(() => {
+        const script = document.createElement('script');
+        script.async = true;
+        const opts = props.options || {};
+        script.src =
+            props.scriptUrl != null
+                ? props.scriptUrl
+                : scriptUrlTemplate.replace(idToken, props.accountId);
+        script.onload = () => {
+            window.cookiehub.load(Object.assign(Object.assign({}, opts), { onInitialise(status) {
+                    const analytics = this.hasConsented('analytics');
+                    const preferences = this.hasConsented('preferences');
+                    const marketing = this.hasConsented('marketing');
+                    const uncategorized = this.hasConsented('uncategorized');
+                    // only trigger re-render if the consent is different from the default (all false)
+                    if (analytics || preferences || marketing || uncategorized) {
+                        setState({
+                            consent: {
+                                analytics,
+                                preferences,
+                                marketing,
+                                uncategorized,
+                            },
+                        });
+                    }
+                    opts.onInitialise && opts.onInitialise.call(this, status);
+                },
+                onAllow(category) {
+                    if (category === 'necessary') {
+                        return;
+                    }
+                    setState((state) => (Object.assign(Object.assign({}, state), { consent: Object.assign(Object.assign({}, state.consent), { [category]: true }) })));
+                    opts.onAllow && opts.onAllow.call(this, category);
+                },
+                onRevoke(category) {
+                    if (category === 'necessary') {
+                        return;
+                    }
+                    setState((state) => (Object.assign(Object.assign({}, state), { consent: Object.assign(Object.assign({}, state.consent), { [category]: false }) })));
+                    opts.onAllow && opts.onAllow.call(this, category);
+                }, cookie: Object.assign({ secure: true }, opts.cookie) }));
+            moveCookiehubScriptInDomTree();
+        };
+        props.onError && (script.onerror = props.onError);
+        document.body.append(script);
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    []);
+    return (React.createElement(CookieHubContext.Provider, { value: state }, props.children));
+};
+// ---------------------------------------------------------------------------
+/**
+ * Returns up-to-date cookie consent flags. For use in React components or hook
+ * functions.
+ *
+ * @see https://github.com/reykjavikcity/webtools/tree/v0.1##usecookiehubconsent
+ */
+export const useCookieHubConsent = () => { var _a; return ((_a = useContext(CookieHubContext)) === null || _a === void 0 ? void 0 : _a.consent) || {}; };

package/esm/http.d.ts

@@ -0,0 +1,82 @@
+import { ServerResponse } from 'http';
+export declare const HTTP_200_OK = 200;
+/**
+ * The request succeeded, and a new resource was created as a result.
+ * This is typically the response sent after POST requests,
+ * or some PUT requests.
+ **/
+export declare const HTTP_201_Created = 201;
+export declare const HTTP_202_Accepted = 202;
+/**
+ * Only safe to use in response to GET and HEAD requests
+ *
+ * @deprecated  Instead use `HTTP_308_PermanentRedirect`.
+ */
+export declare const HTTP_301_MovedPermanently = 301;
+/**
+ * Only safe to use in response to GET and HEAD requests
+ *
+ * @deprecated  Instead use `HTTP_307_TemporaryRedirect`.
+ */
+export declare const HTTP_302_Found = 302;
+/** Use when POST or PUT successfully rediects to the created resource */
+export declare const HTTP_303_SeeOther = 303;
+/** Use in response GET and HEAD requests with `If-Modified-Since`/`If-None-Match` heaaders */
+export declare const HTTP_304_NotModified = 304;
+export declare const HTTP_307_TemporaryRedirect = 307;
+export declare const HTTP_308_PermanentRedirect = 308;
+/** The request is malformed (e.g. a URL param is of a wrong type) */
+export declare const HTTP_400_BadRequest = 400;
+/** User is not authenticated (i.e. not logged in) */
+export declare const HTTP_401_Unauthorized = 401;
+/** User is logged in but doesn't have the necessary privileges */
+export declare const HTTP_403_Forbidden = 403;
+/** The request looks OK but the resource does not exist */
+export declare const HTTP_404_NotFound = 404;
+/**
+ * The resource has been permanently deleted from server, with no forwarding
+ * address.
+ */
+export declare const HTTP_410_Gone = 410;
+/** The server refuses the attempt to brew coffee with a teapot. */
+export declare const HTTP_418_ImATeapot = 418;
+export declare const HTTP_500_InternalServerError = 500;
+export type HTTP_SUCCESS = typeof HTTP_200_OK | typeof HTTP_201_Created | typeof HTTP_202_Accepted;
+export type HTTP_REDIRECTION = typeof HTTP_301_MovedPermanently | typeof HTTP_302_Found | typeof HTTP_303_SeeOther | typeof HTTP_304_NotModified | typeof HTTP_307_TemporaryRedirect | typeof HTTP_308_PermanentRedirect;
+export type HTTP_NOTMODIFIED = typeof HTTP_304_NotModified;
+export type HTTP_CLIENT_ERROR = typeof HTTP_400_BadRequest | typeof HTTP_401_Unauthorized | typeof HTTP_403_Forbidden | typeof HTTP_404_NotFound | typeof HTTP_410_Gone | typeof HTTP_418_ImATeapot;
+export type HTTP_NOT_FOUND = typeof HTTP_400_BadRequest | typeof HTTP_404_NotFound | typeof HTTP_410_Gone;
+export type HTTP_BANNED = typeof HTTP_401_Unauthorized | typeof HTTP_403_Forbidden;
+export type HTTP_SERVER_ERROR = typeof HTTP_500_InternalServerError;
+export type HTTP_ERROR = HTTP_CLIENT_ERROR | HTTP_SERVER_ERROR;
+export type HTTP_STATUS = HTTP_SUCCESS | HTTP_REDIRECTION | HTTP_CLIENT_ERROR | HTTP_SERVER_ERROR;
+type TimeUnit = 's' | 'm' | 'h' | 'd' | 'w';
+type TTL = number | `${number}${TimeUnit}`;
+type TTLKeywords = 'permanent' | 'unset' | 'no-cache';
+type TTLObj = {
+    /** Sets the cache `max-age=` for the resource. */
+    maxAge: TTL | TTLKeywords;
+    /** Sets `stale-while-revalidate=` for the resource */
+    staleWhileRevalidate?: TTL;
+    staleIfError?: TTL;
+    /** Sets the response caching as "public", instead of the default "private" */
+    publ?: boolean;
+    /** Sets a 'must-revalidate' flag instead of the default 'immutable'  */
+    stability?: 'revalidate' | 'immutable' | 'normal';
+};
+/**
+ * Configures quick TTL-related settings for a HTTP request object
+ *
+ * @see https://github.com/reykjavikcity/webtools/tree/v0.1#type-ttlconfig
+ */
+export type TTLConfig = TTL | TTLKeywords | TTLObj;
+/**
+ * Use this function to quickly set the `Cache-Control` header with a `max-age=`
+ * on a HTTP response
+ *
+ * @see https://github.com/reykjavikcity/webtools/tree/v0.1#getcssbundleurl
+ */
+export declare const cacheControl: (response: ServerResponse | {
+    res: ServerResponse;
+}, ttlCfg: TTLConfig, eTag?: string | number) => void;
+export {};

package/esm/http.js

@@ -0,0 +1,125 @@
+export const HTTP_200_OK = 200;
+/**
+ * The request succeeded, and a new resource was created as a result.
+ * This is typically the response sent after POST requests,
+ * or some PUT requests.
+ **/
+export const HTTP_201_Created = 201;
+/*
+ * The request has been received but not yet acted upon.
+ * Uee in cases where another process or server handles the request.
+ */
+export const HTTP_202_Accepted = 202;
+/**
+ * Only safe to use in response to GET and HEAD requests
+ *
+ * @deprecated  Instead use `HTTP_308_PermanentRedirect`.
+ */
+export const HTTP_301_MovedPermanently = 301;
+/**
+ * Only safe to use in response to GET and HEAD requests
+ *
+ * @deprecated  Instead use `HTTP_307_TemporaryRedirect`.
+ */
+export const HTTP_302_Found = 302;
+/** Use when POST or PUT successfully rediects to the created resource */
+export const HTTP_303_SeeOther = 303;
+/** Use in response GET and HEAD requests with `If-Modified-Since`/`If-None-Match` heaaders */
+export const HTTP_304_NotModified = 304;
+export const HTTP_307_TemporaryRedirect = 307;
+export const HTTP_308_PermanentRedirect = 308;
+/** The request is malformed (e.g. a URL param is of a wrong type) */
+export const HTTP_400_BadRequest = 400;
+/** User is not authenticated (i.e. not logged in) */
+export const HTTP_401_Unauthorized = 401;
+/** User is logged in but doesn't have the necessary privileges */
+export const HTTP_403_Forbidden = 403;
+/** The request looks OK but the resource does not exist */
+export const HTTP_404_NotFound = 404;
+/**
+ * The resource has been permanently deleted from server, with no forwarding
+ * address.
+ */
+export const HTTP_410_Gone = 410;
+/** The server refuses the attempt to brew coffee with a teapot. */
+export const HTTP_418_ImATeapot = 418;
+export const HTTP_500_InternalServerError = 500;
+const unitToSeconds = {
+    s: 1,
+    m: 60,
+    h: 3600,
+    d: 24 * 3600,
+    w: 7 * 24 * 3600,
+};
+const toSec = (ttl) => {
+    if (ttl == null) {
+        return;
+    }
+    if (typeof ttl === 'string') {
+        const value = parseFloat(ttl);
+        const factor = unitToSeconds[ttl.slice(-1)] || 1;
+        ttl = value * factor;
+    }
+    return !isNaN(ttl) ? ttl : undefined;
+};
+const stabilities = {
+    revalidate: ', must-revalidate',
+    immutable: ', immutable',
+    normal: '',
+};
+const setCC = (response, cc) => {
+    const devModeHeader = 'X-Cache-Control';
+    // Also set `X-Cache-Control` in dev mode, because some frameworks
+    // **cough** **nextjs** **cough** forcefully override the `Cache-Control`
+    // header when the server is in dev mode.
+    if (!cc) {
+        response.removeHeader('Cache-Control');
+        process.env.NODE_ENV !== 'production' && response.removeHeader(devModeHeader);
+        return;
+    }
+    response.setHeader('Cache-Control', cc);
+    process.env.NODE_ENV !== 'production' && response.setHeader(devModeHeader, cc);
+};
+/**
+ * Use this function to quickly set the `Cache-Control` header with a `max-age=`
+ * on a HTTP response
+ *
+ * @see https://github.com/reykjavikcity/webtools/tree/v0.1#getcssbundleurl
+ */
+// eslint-disable-next-line complexity
+export const cacheControl = (response, ttlCfg, eTag) => {
+    response = 'res' in response ? response.res : response;
+    const opts = typeof ttlCfg === 'number' || typeof ttlCfg === 'string'
+        ? { maxAge: ttlCfg }
+        : ttlCfg;
+    let maxAge = opts.maxAge;
+    if (typeof maxAge === 'string') {
+        if (maxAge === 'permanent') {
+            maxAge = 365 * unitToSeconds.d;
+        }
+        else if (maxAge === 'no-cache') {
+            maxAge = 0;
+        }
+        else if (maxAge === 'unset') {
+            maxAge = undefined;
+        }
+    }
+    maxAge = toSec(maxAge);
+    if (maxAge == null) {
+        response.removeHeader('Cache-Control');
+        return;
+    }
+    const sWR_ttl = toSec(opts.staleWhileRevalidate);
+    const sWR = sWR_ttl != null ? `, stale-while-revalidate=${sWR_ttl}` : '';
+    const sIE_ttl = toSec(opts.staleIfError);
+    const sIE = sIE_ttl != null ? `, stale-if-error=${sIE_ttl}` : '';
+    maxAge = Math.round(maxAge);
+    if (maxAge <= 0) {
+        setCC(response, 'no-cache');
+        return;
+    }
+    const scope = opts.publ ? 'public' : 'private';
+    const stability = (opts.stability && stabilities[opts.stability]) || stabilities.immutable;
+    eTag != null && response.setHeader('ETag', eTag);
+    setCC(response, `${scope}, max-age=${maxAge + sWR + sIE + stability}`);
+};

package/esm/index.d.ts

@@ -0,0 +1,6 @@
+/// <reference path="./CookieHubConsent.d.tsx" />
+/// <reference path="./http.d.ts" />
+/// <reference path="./next/http.d.tsx" />
+/// <reference path="./next/SiteImprove.d.tsx" />
+
+export {};

package/esm/index.js

@@ -0,0 +1 @@
+export {};

package/esm/next/SiteImprove.d.ts

@@ -0,0 +1,81 @@
+/// <reference types="react" />
+import { EitherObj } from '@reykjavik/hanna-utils';
+declare global {
+    interface Window {
+        _sz?: Array<SiteImproveEvent> & {
+            /**
+             * Set if posting a tracking event is attempted before SiteImprove has
+             * been initialized, and the window._sz array had to be initialized
+             * just-in-time.
+             */
+            _jit_defined_?: true;
+        };
+    }
+}
+type SiteImproveEvent = SiteImprovePageView | SiteImproveCustomEvent;
+type SiteImprovePageView = [
+    type: 'trackdynamic',
+    data: {
+        /** New page URL */
+        url: string;
+        /** The previous (referer) URL */
+        ref: string;
+        /** New page title */
+        title?: string;
+    }
+];
+type SiteImproveCustomEvent = [
+    type: 'event',
+    category: string,
+    action: string,
+    label?: string
+];
+export type SiteImproveProps = EitherObj<{
+    /**
+     * Your SiteImprove account ID.
+     *
+     * It's a random-looking numerical string, and it can usually be
+     * extracted from the script embed URL like this:
+     * `"https://siteimproveanalytics.com/js/siteanalyze_[ACCOUNT_ID].js"`
+     */
+    accountId: string;
+}, {
+    /**
+     * The full SiteImprove analytics script URL.
+     *
+     * Something like `"https://siteimproveanalytics.com/js/siteanalyze_[ACCOUNT_ID].js"`
+     */
+    scriptUrl: string;
+}> & {
+    /**
+     * Manual GDPR 'analytics' consent flag.
+     *
+     * A value of `false` prevents the analytics script being loaded.
+     *
+     * Any other value causes the component to defer to the `CookieHubProvider`
+     * component, and only applies if the cookiehub flag is undefined.
+     */
+    hasConstented?: boolean;
+    /**
+     * Custom callback for when the SiteImprove script has loaded.
+     */
+    onLoad?: (e: unknown) => void;
+    /**
+     * Error callback for if the SiteImprove script fails to load.
+     */
+    onError?: (e: unknown) => void;
+};
+/**
+ * A component for loading a SiteImprove analytics script and set up page-view
+ * tracking across Next.js routes.
+ *
+ * @see https://github.com/reykjavikcity/webtools/tree/v0.1##siteimprove-component
+ */
+export declare const SiteImprove: (props: SiteImproveProps) => JSX.Element | null;
+/**
+ * A small helper for tracking custom UI events and reporting them to SiteImrove.
+ *
+ * @see https://github.com/reykjavikcity/webtools/tree/v0.1##pingsiteimprove-helper
+ */
+export declare const pingSiteImprove: (category: string, action: string, label?: string) => void;
+export {};

package/esm/next/SiteImprove.js

@@ -0,0 +1,100 @@
+import React, { useEffect } from 'react';
+import { Router } from 'next/router';
+import Script from 'next/script';
+import { useCookieHubConsent } from '../CookieHubConsent';
+// 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;
+        }
+        if (process.env.NODE_ENV === 'development') {
+            console.info('SiteImprove:', event);
+        }
+        else {
+            _sz.push(event);
+        }
+    };
+/*
+  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) => _emitEvent([
+    'trackdynamic',
+    {
+        url,
+        ref: refUrl,
+        title: document.title,
+    },
+]);
+// ---------------------------------------------------------------------------
+const idToken = '[ACCOUNT_ID]';
+const scriptUrlTemplate = `https://siteimproveanalytics.com/js/siteanalyze_${idToken}.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/tree/v0.1##siteimprove-component
+ */
+export const SiteImprove = (props) => {
+    const { analytics } = useCookieHubConsent();
+    const consented = (analytics && props.hasConstented !== false) ||
+        (analytics === undefined && props.hasConstented);
+    useEffect(() => {
+        if (consented) {
+            const routerEvents = Router.events;
+            routerEvents.on('routeChangeStart', captureRefUrl);
+            routerEvents.on('routeChangeComplete', sendRoutingEvent);
+            return () => {
+                routerEvents.off('routeChangeStart', captureRefUrl);
+                routerEvents.off('routeChangeComplete', sendRoutingEvent);
+            };
+        }
+    }, [consented]);
+    if (!consented) {
+        return null;
+    }
+    if (process.env.NODE_ENV !== 'production') {
+        console.info('Mock loading SiteImprove in development mode.');
+        if (!window._sz) {
+            setTimeout(() => {
+                window._sz = window._sz || [];
+            }, 300);
+        }
+        return null;
+    }
+    const scriptUrl = props.scriptUrl != null
+        ? props.scriptUrl
+        : scriptUrlTemplate.replace(idToken, props.accountId);
+    return (React.createElement(Script, { type: "text/javascript", strategy: "afterInteractive", src: scriptUrl, onLoad: props.onLoad, onError: props.onError }));
+};
+// ---------------------------------------------------------------------------
+/**
+ * A small helper for tracking custom UI events and reporting them to SiteImrove.
+ *
+ * @see https://github.com/reykjavikcity/webtools/tree/v0.1##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]);
+};

package/esm/next/http.d.ts

@@ -0,0 +1,56 @@
+/// <reference types="node" />
+import React, { FunctionComponent } from 'react';
+import { Cleanup } from '@reykjavik/hanna-utils';
+import { ServerResponse } from 'http';
+import type { AppType } from 'next/app';
+import type { HTTP_ERROR, TTLConfig } from '../http';
+export * from '../http';
+type NextContextLike = {
+    res: ServerResponse;
+};
+export type ErrorProps = {
+    statusCode: HTTP_ERROR;
+    /** If a HTTP_ERROR code is passed, a default error message is displayed */
+    message?: string;
+};
+type ErrorizedPageProps<EP extends ErrorProps = ErrorProps> = {
+    __error: ErrorProps;
+} & Omit<EP, keyof ErrorProps>;
+type ShowErrorPageFn<EP extends ErrorProps = ErrorProps> = (response: ServerResponse | NextContextLike, error: (ErrorProps extends EP ? HTTP_ERROR : never) | EP, 
+/** Defaults to `"2s"`. Gets forwarded on to the `cacheControl` helper from `@reykjavik/webtools/http` */
+ttl?: TTLConfig) => {
+    props: ErrorizedPageProps<EP>;
+};
+export type InferErrorPageProps<SEP extends ShowErrorPageFn<any>> = Cleanup<ReturnType<SEP>['props']>;
+/**
+ * Hhigher-order component (HOC) factory for Next.js App compnents to handle
+ * cases when `getServerSideProps` returns an `__error` prop with `statusCode`
+ * and optional friendly `message`.
+ *
+ * @see https://github.com/reykjavikcity/webtools/tree/v0.1#makeerrorizeapphoc
+ */
+export declare const makeErrorizeAppHOC: <EP extends Partial<ErrorProps>>(ErrorPage: React.FunctionComponent<EP>) => {
+    <P extends {
+        [key: string]: unknown;
+        __error?: undefined;
+    }>(App: AppType<P>): React.FunctionComponent<import("next/dist/shared/lib/utils").AppPropsType<any, P | ({
+        __error: ErrorProps;
+    } & Omit<ErrorProps & EP, keyof ErrorProps>)>> & {
+        getInitialProps?(context: import("next/dist/shared/lib/utils").AppContextType<import("next/router").NextRouter>): P | ({
+            __error: ErrorProps;
+        } & Omit<ErrorProps & EP, keyof ErrorProps>) | Promise<P | ({
+            __error: ErrorProps;
+        } & Omit<ErrorProps & EP, keyof ErrorProps>)>;
+    };
+    showErrorPage: ShowErrorPageFn<ErrorProps & EP>;
+};
+/**
+ * Use this method to inside a `getServerSideProps` method (or API route)
+ * to return an `HTTP_304_NotModified` response with an empty props object,
+ * in a way that doesn't make TypeScript at you.
+ *
+ * @see https://github.com/reykjavikcity/webtools/tree/v0.1#notmodified304-helper
+ */
+export declare const notModified304: (response: ServerResponse | NextContextLike) => {
+    readonly props: any;
+};

package/esm/next/http.js

@@ -0,0 +1,81 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React from 'react';
+import { cacheControl, HTTP_304_NotModified } from '../http';
+/*
+  Re-export all of the base [http module](#reykjavikwebtoolshttp)'s exports,
+  purely for convenience.
+*/
+export * from '../http';
+/**
+ * Use this method inside a `getServerSideProps` method (or API route)
+ * to return an error page with proper HTTP status code and all the shit.
+ *
+ * @see https://github.com/reykjavikcity/webtools/tree/v0.1#showerrorpage-helper
+ */
+const showErrorPage = (response, error, ttl = '2s') => {
+    error =
+        typeof error === 'number'
+            ? { statusCode: error }
+            : error;
+    const { statusCode, message } = error, otherProps = __rest(error, ["statusCode", "message"]);
+    response = 'res' in response ? response.res : response;
+    response.statusCode = error.statusCode;
+    cacheControl(response, ttl);
+    return {
+        props: Object.assign(Object.assign({}, otherProps), { __error: { statusCode, message } }),
+    };
+};
+// ===========================================================================
+/**
+ * Hhigher-order component (HOC) factory for Next.js App compnents to handle
+ * cases when `getServerSideProps` returns an `__error` prop with `statusCode`
+ * and optional friendly `message`.
+ *
+ * @see https://github.com/reykjavikcity/webtools/tree/v0.1#makeerrorizeapphoc
+ */
+export const makeErrorizeAppHOC = (ErrorPage) => {
+    // the HOC
+    const withErrorHandling = (App) => {
+        const ErrorizedApp = (appProps) => {
+            const { pageProps } = appProps;
+            if (pageProps.__error) {
+                const { __error } = pageProps, otherProps = __rest(pageProps, ["__error"]);
+                return (React.createElement(App, Object.assign({}, appProps, { Component: ErrorPage, pageProps: Object.assign(Object.assign({}, otherProps), __error) })));
+            }
+            return React.createElement(App, Object.assign({}, appProps));
+        };
+        ErrorizedApp.getInitialProps = App.getInitialProps;
+        ErrorizedApp.displayName = 'Errorized' + (App.displayName || App.name || 'App');
+        return ErrorizedApp;
+    };
+    withErrorHandling.showErrorPage = showErrorPage;
+    return withErrorHandling;
+};
+// ===========================================================================
+/**
+ * Use this method to inside a `getServerSideProps` method (or API route)
+ * to return an `HTTP_304_NotModified` response with an empty props object,
+ * in a way that doesn't make TypeScript at you.
+ *
+ * @see https://github.com/reykjavikcity/webtools/tree/v0.1#notmodified304-helper
+ */
+export const notModified304 = (response) => {
+    response = 'res' in response ? response.res : response;
+    response.statusCode = HTTP_304_NotModified;
+    return {
+        props: 
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        {},
+    };
+};
+// ---------------------------------------------------------------------------

package/esm/package.json

@@ -0,0 +1 @@
+{"type":"module"}