@reykjavik/hanna-react 0.10.103 → 0.10.104

package/esm/utils/browserSide.js

@@ -1 +1,152 @@
-export { useIsBrowserSide, useIsServerSide } from '@hugsmidjan/react/hooks';
+import { useEffect, useState } from 'react';
+let alreadyBrowserSide = false;
+const defaultSSRSupport = true;
+/**
+ * The default value use for the optional `ssrSupport` parameter
+ * on the `useIsBRowserSide` and `useIsServerSide` hooks.`
+ */
+let DEFAULT_SSR_SUPPORT = defaultSSRSupport;
+/**
+ * Low-level useState wrapper that initializes the state to one value
+ * during initial render and then updates it to another value
+ * once the component has been mounted.
+ *
+ * After that it's just a normal [value, setValue] pair.
+ *
+ * NOTE: The optional `ssrSupport` parameter is ignored after the initial render
+ */
+const useClientState = (serverState, clientState, 
+/**
+ * Indicates whether server-side rendering is supported or not.
+ *
+ * The `ssr-only` value is useful for cases where you need
+ * to demo the server-rendered version in a browser.
+ */
+ssrSupport = DEFAULT_SSR_SUPPORT) => {
+    const stateTuple = useState(() => (ssrSupport === 'ssr-only'
+        ? serverState
+        : ssrSupport && !alreadyBrowserSide
+            ? serverState
+            : clientState) // TODO: Remove this type assertion once @types/react and typescript have been updated
+    );
+    useEffect(() => {
+        alreadyBrowserSide = true;
+        if (ssrSupport !== 'ssr-only') {
+            stateTuple[1](clientState);
+        }
+    }, []);
+    return stateTuple;
+};
+/**
+ * Returns `true` if `useEffect` has not executed yet.
+ *
+ * This signals that we're in "server-side rendering" mode
+ * and it's not yet appropriate to do JS-driven UI enhancements.
+ *
+ * ```js
+ * const Knob = (props) => {
+ *   const [visible, setVisible] = useState(false);
+ *   const isServer = useIsServerSide();
+ *   const handleClick = () => {
+ *     setVisible(!visible);
+ *     props.onClick && props.onClick(!visible);
+ *   };
+ *
+ *   if (isServer) {
+ *     return <span className="Knob">{props.label}</span>
+ *   }
+ *   return (
+ *     <button className="Knob" aria-pressed={visible} onClick={handleClick}>
+ *       {props.label}
+ *     </button>
+ *   );
+ * }
+ * ```
+ *
+ * SSR support mode can optionally be set to:
+ *
+ * - `true` (the default) enables the serve-side phase (returns `true` then `undefined`).
+ * - `false` disables (skips) the serve-side phase (always returns `undefined`).
+ * - `"ssr-only"` disables (skips) the browser-side phase (always returns `true`).
+ *
+ * NOTE: The `ssrSupport` parameter is ignored after the initial render.
+ */
+export const useIsServerSide = (ssrSupport) => 
+// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+useClientState(true, false, ssrSupport)[0] || undefined;
+/**
+ * Returns `true` when `useEffect` has executed.
+ *
+ * This signals the time to apply Progressive Enhancement.
+ *
+ * ```js
+ * const Knob = (props) => {
+ *   const [visible, setVisible] = useState(false);
+ *   const isBrowser = useIsBrowserSide();
+ *   const handleClick = () => {
+ *     setVisible(!visible);
+ *     props.onClick && props.onClick(!visible);
+ *   };
+ *
+ *   if (isBrowser) {
+ *     return (
+ *       <button className="Knob" aria-pressed={visible} onClick={handleClick}>
+ *         {props.label}
+ *       </button>
+ *     );
+ *   }
+ *   return <span className="Knob">{props.label}</span>
+ * }
+ * ```
+ *
+ * SSR support mode can optionally be set to:
+ *
+ * - `true` (the default) enables the serve-side phase (returns `true` then `undefined`).
+ * - `false` disables (skips) the serve-side phase (always returns `true`).
+ * - `"ssr-only"` disables (skips) the browser-side phase (always returns `undefined`).
+ *
+ * NOTE: The `ssrSupport` parameter is ignored after the initial render.
+ */
+export const useIsBrowserSide = (ssrSupport) => 
+// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+useClientState(false, true, ssrSupport)[0] || undefined;
+// ---------------------------------------------------------------------------
+const _history = [];
+/**
+ * Allows you to set a the default SSRSupport value for the `useIsBRowserSide`
+ * and `useIsServerSide` hooks.
+ *
+ * Example use:
+ *
+ * ```js
+ * setDefaultSSR(false);
+ * ```
+ *
+ * The values are pushed to a simple stack, and if you want to revert
+ * a temporarily set value, use the `setDefaultSSR.pop()` method
+ * to go back to the previous value. Example:
+ *
+ * ```js
+ * setDefaultSSR('ssr-only');
+ * // ...render some components...
+ * setDefaultSSR.pop(); // go back to the previous state
+ * ```
+ *
+ * You explicitly switch to using the library's default by passing `undefined`
+ * as an argument — like so:
+ *
+ * ```js
+ * setDefaultSSR(undefined);
+ * ```
+ */
+export const setDefaultSSR = (ssrSupport) => {
+    DEFAULT_SSR_SUPPORT = ssrSupport != null ? ssrSupport : defaultSSRSupport;
+    _history.unshift(DEFAULT_SSR_SUPPORT);
+};
+/**
+ * Unsets the last pushed defaultSSR value
+ */
+setDefaultSSR.pop = () => {
+    _history.shift();
+    DEFAULT_SSR_SUPPORT = _history[0] != null ? _history[0] : defaultSSRSupport;
+};

package/esm/utils/config.d.ts

@@ -1,14 +1 @@
-import { SSRSupport } from '@hugsmidjan/react/hooks';
-export type { LinkRenderer } from '../_abstract/_Link.js';
-export { setLinkRenderer } from '../_abstract/_Link.js';
-export { setDefaultSSR } from '@hugsmidjan/react/hooks';
-export type SSRSupportProps = {
-    /**
-     * Indicates whether server-side rendering is supported or not.
-     *
-     * The `ssr-only` value is useful for cases where you need
-     * to demo the server-rendered version in a browser.
-     */
-    ssr?: SSRSupport;
-};
-export type { SSRSupport };
+export { type LinkRenderer, setLinkRenderer } from '../_abstract/_Link.js';

package/esm/utils/config.js

@@ -1,3 +1 @@
 export { setLinkRenderer } from '../_abstract/_Link.js';
-// ---------------------------------------------------------------------------
-export { setDefaultSSR } from '@hugsmidjan/react/hooks';

package/esm/utils/useCallbackOnEsc.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Performs a callback whenever the user hits the ESC key.
+ *
+ * Pass `undefined` to remove the event listener
+ */
+export declare const useCallbackOnEsc: (callback: (() => void) | undefined) => void;

package/esm/utils/useCallbackOnEsc.js

@@ -0,0 +1,25 @@
+import { useEffect, useRef } from 'react';
+/**
+ * Performs a callback whenever the user hits the ESC key.
+ *
+ * Pass `undefined` to remove the event listener
+ */
+export const useCallbackOnEsc = (callback) => {
+    const cb = useRef(callback);
+    const active = !!callback;
+    cb.current = callback;
+    useEffect(() => {
+        if (!active) {
+            return;
+        }
+        const callbackOnEsc = (e) => {
+            if (e.key === 'Escape') {
+                cb.current && cb.current();
+            }
+        };
+        document.addEventListener('keydown', callbackOnEsc);
+        return () => {
+            document.removeEventListener('keydown', callbackOnEsc);
+        };
+    }, [active]);
+};

package/esm/utils/useDomid.d.ts

@@ -0,0 +1,8 @@
+/**
+ * Returns a stable, unique ID string.
+ *
+ * Uses useId from React@18 when available, but falls back on a custom id
+ * generator. (The custom generator causes angry hydration warnings in dev
+ * mode).
+ */
+export declare const useDomid: (staticId?: string) => string;

package/esm/utils/useDomid.js

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import domid from '@hugsmidjan/qj/domid';
+// @ts-expect-error  (transparently feature-detect useId hook, which is introduced in React@18)
+const useId = React.useId;
+/**
+ * Returns a stable, unique ID string.
+ *
+ * Uses useId from React@18 when available, but falls back on a custom id
+ * generator. (The custom generator causes angry hydration warnings in dev
+ * mode).
+ */
+export const useDomid = useId
+    ? (staticId) => {
+        const id = useId();
+        return staticId || id;
+    }
+    : (staticId) => React.useRef(staticId || domid()).current;

package/esm/utils/useLaggedState.d.ts

@@ -0,0 +1,18 @@
+/**
+ * A `useState` alternative with in-built support for delayed (debounced) effect.
+ *
+ * This is especially useful when emulating "focusin"/"focusout" events,
+ * and a less jittery 'onMouseEnter'/'onMouseLeave' behavior.
+ *
+ * The returned `setState` function accepts an optional `customDelay` parameter.
+ *
+ * An explicitly falsy delay (`0` | `false` | `null`) results in a
+ * immediate (normal) `setState` invocation, whereas any other value uses
+ * `setTimeout` to delay the update.
+ *
+ * Each `setState` call automatically cancels any pending scheduled update.
+ *
+ * You can also use the `setState.cancel()` helper to to cancel the last
+ * scheduled update, without explicitly setting a new value.
+ */
+export declare const useLaggedState: <S>(initialState: S | (() => S), defaultDelay?: number, thenState?: S | (() => S) | undefined) => [currentState: S, setState: (newState: S | ((prevState: S, upcomingState: S) => S), customDelay?: number | false) => void, nextState: S, isTransitioning: true | undefined];

package/esm/utils/useLaggedState.js

@@ -0,0 +1,84 @@
+import { useState, useRef, useEffect, useMemo } from 'react';
+// ---------------------------------------------------------------------------
+/**
+ * A `useState` alternative with in-built support for delayed (debounced) effect.
+ *
+ * This is especially useful when emulating "focusin"/"focusout" events,
+ * and a less jittery 'onMouseEnter'/'onMouseLeave' behavior.
+ *
+ * The returned `setState` function accepts an optional `customDelay` parameter.
+ *
+ * An explicitly falsy delay (`0` | `false` | `null`) results in a
+ * immediate (normal) `setState` invocation, whereas any other value uses
+ * `setTimeout` to delay the update.
+ *
+ * Each `setState` call automatically cancels any pending scheduled update.
+ *
+ * You can also use the `setState.cancel()` helper to to cancel the last
+ * scheduled update, without explicitly setting a new value.
+ */
+export const useLaggedState = (initialState, 
+/**
+ * Default delay in milliseconds.  A value of `0` results in a
+ * immediate (normal) setState invocation.
+ *
+ * NOTE: The `defaultDelay` parameter is ignored after the initial render.
+ */
+defaultDelay = 0, 
+/**
+ * A state that should be automatically transitioned to after the initial mounting.
+ *
+ * Syntatic sugar equivalent to the following:
+ *
+ * ```js
+ *   const [value, _, setValue] = useLaggedState(initialState, defaultDelay);
+ *   useEffect(() => {
+ *     setValue(thenState, defaultDelay);
+ *   }, [])
+ * ```
+ */
+thenState) => {
+    const timeout = useRef();
+    const [[currentState, nextState], setLocalState] = useState(() => {
+        const initial = typeof initialState === 'function' ? initialState() : initialState;
+        return [initial, initial];
+    });
+    const setState = useMemo(() => {
+        const _setter = (newState, customDelay) => {
+            timeout.current && clearTimeout(timeout.current);
+            const delay = customDelay !== undefined ? customDelay : defaultDelay;
+            setLocalState((prevState) => {
+                const [current, upcoming] = prevState;
+                const newValue = typeof newState === 'function'
+                    ? newState(current, upcoming)
+                    : newState;
+                if (!delay || newValue === current) {
+                    // Instant update!
+                    return newValue === current && newValue === upcoming
+                        ? prevState
+                        : [newValue, newValue];
+                }
+                // Debounced update!
+                timeout.current = setTimeout(() => setLocalState([newValue, newValue]), delay);
+                return [current, newValue];
+            });
+        };
+        _setter.cancel = () => {
+            _setter((prevState) => prevState, null);
+        };
+        return _setter;
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [
+    // defaultDelay,
+    ]);
+    useEffect(() => {
+        thenState !== undefined && setState(thenState);
+        return () => {
+            timeout.current && clearTimeout(timeout.current);
+        };
+    }, [] // eslint-disable-line react-hooks/exhaustive-deps
+    );
+    const isTransitioning = currentState !== nextState || undefined;
+    return [currentState, setState, nextState, isTransitioning];
+};

package/esm/utils/useOnClickOutside.d.ts

@@ -0,0 +1,9 @@
+import { MutableRefObject, RefObject } from 'react';
+type Ref<E extends HTMLElement> = MutableRefObject<E> | RefObject<E>;
+/**
+ *
+ * @param ref single or array of refs to check for click outside
+ * @param handler callback to run when clicked outside of the ref
+ */
+declare const useOnClickOutside: <E extends HTMLElement>(ref: Ref<E> | Ref<E>[], handler: (event: globalThis.MouseEvent | globalThis.TouchEvent) => void) => void;
+export { useOnClickOutside };

package/esm/utils/useOnClickOutside.js

@@ -0,0 +1,32 @@
+import { useEffect, useMemo } from 'react';
+/**
+ *
+ * @param ref single or array of refs to check for click outside
+ * @param handler callback to run when clicked outside of the ref
+ */
+const useOnClickOutside = (ref, handler) => {
+    const refs = Array.isArray(ref) ? ref : [ref];
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    const stableRefs = useMemo(() => refs, refs);
+    useEffect(() => {
+        const listener = (event) => {
+            const shouldTrigger = !stableRefs.some((r) => {
+                const node = r.current;
+                if (!node) {
+                    return false;
+                }
+                return node.contains(event.target);
+            });
+            if (shouldTrigger) {
+                handler(event);
+            }
+        };
+        document.addEventListener('mousedown', listener);
+        document.addEventListener('touchstart', listener);
+        return () => {
+            document.removeEventListener('mousedown', listener);
+            document.removeEventListener('touchstart', listener);
+        };
+    }, [handler, stableRefs]);
+};
+export { useOnClickOutside };

package/esm/utils/useScrollEdgeDetect.d.ts

@@ -0,0 +1,15 @@
+import { RefObject } from 'react';
+type ScrollAxis = 'horizontal' | 'vertical';
+type AtState = {
+    start: boolean;
+    end: boolean;
+};
+export type ScrollEdgeDetectOptions<RefElm extends HTMLElement = HTMLElement> = {
+    axis: ScrollAxis;
+    /** **NOTE:** Make sure this function is stable to avoid unnecessary re-runs */
+    getElm?: (elm: RefElm | null | undefined) => HTMLElement | undefined | null | false;
+    /** Initial `at` status */
+    startAt?: AtState;
+};
+export declare const useScrollEdgeDetect: <RefElm extends HTMLElement = HTMLElement>(options: ScrollAxis | ScrollEdgeDetectOptions<RefElm>, scrollerRef?: RefObject<RefElm> | undefined) => [scrollElmRef: RefObject<RefElm>, at: AtState];
+export {};

package/esm/utils/useScrollEdgeDetect.js

@@ -0,0 +1,45 @@
+import { useEffect, useRef, useState } from 'react';
+import throttle from '@hugsmidjan/qj/throttle';
+const tolerance = 8; // px
+const throttleMs = 100;
+export const useScrollEdgeDetect = (options, scrollerRef) => {
+    const opts = typeof options === 'string' ? { axis: options } : options;
+    const _scrollerRef = useRef(null);
+    scrollerRef = scrollerRef || _scrollerRef;
+    const [at, setAt] = useState(opts.startAt || { start: true, end: true });
+    const scrollerRefElm = scrollerRef.current;
+    const { getElm, axis } = opts;
+    useEffect(() => {
+        const scrollerElm = scrollerRefElm && getElm ? getElm(scrollerRefElm) : scrollerRefElm;
+        if (!(scrollerElm instanceof HTMLElement)) {
+            return;
+        }
+        const checkScroll = throttle(() => setAt((at) => {
+            let scroll, offsetSize, totalSize;
+            if (axis === 'horizontal') {
+                scroll = scrollerElm.scrollLeft;
+                offsetSize = scrollerElm.offsetWidth;
+                totalSize = scrollerElm.scrollWidth;
+            }
+            else {
+                scroll = scrollerElm.scrollTop;
+                offsetSize = scrollerElm.offsetHeight;
+                totalSize = scrollerElm.scrollHeight;
+            }
+            const start = scroll < tolerance;
+            const end = totalSize - (offsetSize + scroll) < tolerance;
+            if (at.start === start && at.end === end) {
+                return at;
+            }
+            return { start, end };
+        }), throttleMs);
+        scrollerElm.addEventListener('scroll', checkScroll);
+        window.addEventListener('resize', checkScroll);
+        checkScroll();
+        return () => {
+            scrollerElm.removeEventListener('scroll', checkScroll);
+            window.removeEventListener('resize', checkScroll);
+        };
+    }, [scrollerRefElm, getElm, axis]);
+    return [scrollerRef, at];
+};

package/esm/utils/useShortState.d.ts

@@ -0,0 +1,2 @@
+/** State variable that always snaps back to `undefined` after `duration` milliseconds. */
+export declare const useShortState: <S>(initialState?: S | (() => S) | undefined, defaultDuration?: number) => readonly [S | undefined, (newState: S | (() => S), duration?: number) => void];

package/esm/utils/useShortState.js

@@ -0,0 +1,34 @@
+import { useEffect, useRef, useState } from 'react';
+const DEFAULT_DURATION = 0;
+// TODO: Add function signtures allowing either zero args, or 2.
+/** State variable that always snaps back to `undefined` after `duration` milliseconds. */
+export const useShortState = (
+/** Initial temporary state that then gets reverted back
+ * to `undefined` after `duration` milliseconds
+ * */
+initialState, 
+/** Default duration, can be overridden on a case-by-case basis
+ * by passing a custom duration to the `setState` function
+ * */
+defaultDuration = DEFAULT_DURATION) => {
+    const [state, _setState] = useState(initialState);
+    const timeout = useRef();
+    const cancelTimeout = () => {
+        timeout.current && clearTimeout(timeout.current);
+    };
+    const setState = useRef((newState, duration = defaultDuration) => {
+        _setState(newState);
+        cancelTimeout();
+        timeout.current = setTimeout(() => {
+            timeout.current = null;
+            _setState(undefined);
+        }, duration);
+    }).current;
+    useEffect(() => {
+        if (initialState !== undefined) {
+            setState(initialState, defaultDuration);
+        }
+        return cancelTimeout;
+    }, []);
+    return [state, setState];
+};

package/esm/utils.d.ts

@@ -3,6 +3,7 @@ export * from './utils/browserSide.js';
 export * from './utils/config.js';
 export { HannaUIState, useHannaUIState } from './utils/HannaUIState.js';
 export * from './utils/useDidChange.js';
+export * from './utils/useDomid.js';
 export * from './utils/useFormatMonitor.js';
 export * from './utils/useGetSVGtext.js';
 export * from './utils/useMenuToggling.js';

package/esm/utils.js

@@ -2,6 +2,7 @@ export * from './utils/browserSide.js';
 export * from './utils/config.js';
 export { HannaUIState, useHannaUIState } from './utils/HannaUIState.js';
 export * from './utils/useDidChange.js';
+export * from './utils/useDomid.js';
 export * from './utils/useFormatMonitor.js';
 export * from './utils/useGetSVGtext.js';
 export * from './utils/useMenuToggling.js';

package/index.d.ts

@@ -89,6 +89,7 @@
 /// <reference path="./Bling.d.tsx" />
 /// <reference path="./BgBox.d.tsx" />
 /// <reference path="./BasicTable.d.tsx" />
+/// <reference path="./AutosuggestSearch.d.tsx" />
 /// <reference path="./Attention.d.tsx" />
 /// <reference path="./ArticleMeta.d.tsx" />
 /// <reference path="./ArticleCarousel.d.tsx" />

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@reykjavik/hanna-react",
-	"version": "0.10.103",
+	"version": "0.10.104",
 	"author": "Reykjavík (http://www.reykjavik.is)",
 	"contributors": [
 		"Hugsmiðjan ehf (http://www.hugsmidjan.is)",
@@ -18,7 +18,7 @@
 		"@hugsmidjan/qj": "^4.22.1",
 		"@hugsmidjan/react": "^0.4.32",
 		"@reykjavik/hanna-css": "^0.4.7",
-		"@reykjavik/hanna-utils": "^0.2.9",
+		"@reykjavik/hanna-utils": "^0.2.10",
 		"@types/react-autosuggest": "^10.1.0",
 		"@types/react-datepicker": "^4.8.0",
 		"@types/react-transition-group": "^4.4.0",
@@ -409,6 +409,10 @@
 			"import": "./esm/BasicTable.js",
 			"require": "./BasicTable.js"
 		},
+		"./AutosuggestSearch": {
+			"import": "./esm/AutosuggestSearch.js",
+			"require": "./AutosuggestSearch.js"
+		},
 		"./Attention": {
 			"import": "./esm/Attention.js",
 			"require": "./Attention.js"

package/utils/browserSide.d.ts

@@ -1 +1,119 @@
-export { useIsBrowserSide, useIsServerSide } from '@hugsmidjan/react/hooks';
+/**
+ * Indicates whether server-side rendering is supported or not.
+ *
+ * The `ssr-only` value is useful for cases where you need
+ * to demo the server-rendered version in a browser.
+ */
+export type SSRSupport = boolean | 'ssr-only';
+export type SSRSupportProps = {
+    /**
+     * Indicates whether server-side rendering is supported or not.
+     *
+     * The `ssr-only` value is useful for cases where you need
+     * to demo the server-rendered version in a browser.
+     */
+    ssr?: SSRSupport;
+};
+/**
+ * Returns `true` if `useEffect` has not executed yet.
+ *
+ * This signals that we're in "server-side rendering" mode
+ * and it's not yet appropriate to do JS-driven UI enhancements.
+ *
+ * ```js
+ * const Knob = (props) => {
+ *   const [visible, setVisible] = useState(false);
+ *   const isServer = useIsServerSide();
+ *   const handleClick = () => {
+ *     setVisible(!visible);
+ *     props.onClick && props.onClick(!visible);
+ *   };
+ *
+ *   if (isServer) {
+ *     return <span className="Knob">{props.label}</span>
+ *   }
+ *   return (
+ *     <button className="Knob" aria-pressed={visible} onClick={handleClick}>
+ *       {props.label}
+ *     </button>
+ *   );
+ * }
+ * ```
+ *
+ * SSR support mode can optionally be set to:
+ *
+ * - `true` (the default) enables the serve-side phase (returns `true` then `undefined`).
+ * - `false` disables (skips) the serve-side phase (always returns `undefined`).
+ * - `"ssr-only"` disables (skips) the browser-side phase (always returns `true`).
+ *
+ * NOTE: The `ssrSupport` parameter is ignored after the initial render.
+ */
+export declare const useIsServerSide: (ssrSupport?: SSRSupport) => true | undefined;
+/**
+ * Returns `true` when `useEffect` has executed.
+ *
+ * This signals the time to apply Progressive Enhancement.
+ *
+ * ```js
+ * const Knob = (props) => {
+ *   const [visible, setVisible] = useState(false);
+ *   const isBrowser = useIsBrowserSide();
+ *   const handleClick = () => {
+ *     setVisible(!visible);
+ *     props.onClick && props.onClick(!visible);
+ *   };
+ *
+ *   if (isBrowser) {
+ *     return (
+ *       <button className="Knob" aria-pressed={visible} onClick={handleClick}>
+ *         {props.label}
+ *       </button>
+ *     );
+ *   }
+ *   return <span className="Knob">{props.label}</span>
+ * }
+ * ```
+ *
+ * SSR support mode can optionally be set to:
+ *
+ * - `true` (the default) enables the serve-side phase (returns `true` then `undefined`).
+ * - `false` disables (skips) the serve-side phase (always returns `true`).
+ * - `"ssr-only"` disables (skips) the browser-side phase (always returns `undefined`).
+ *
+ * NOTE: The `ssrSupport` parameter is ignored after the initial render.
+ */
+export declare const useIsBrowserSide: (ssrSupport?: SSRSupport) => true | undefined;
+/**
+ * Allows you to set a the default SSRSupport value for the `useIsBRowserSide`
+ * and `useIsServerSide` hooks.
+ *
+ * Example use:
+ *
+ * ```js
+ * setDefaultSSR(false);
+ * ```
+ *
+ * The values are pushed to a simple stack, and if you want to revert
+ * a temporarily set value, use the `setDefaultSSR.pop()` method
+ * to go back to the previous value. Example:
+ *
+ * ```js
+ * setDefaultSSR('ssr-only');
+ * // ...render some components...
+ * setDefaultSSR.pop(); // go back to the previous state
+ * ```
+ *
+ * You explicitly switch to using the library's default by passing `undefined`
+ * as an argument — like so:
+ *
+ * ```js
+ * setDefaultSSR(undefined);
+ * ```
+ */
+export declare const setDefaultSSR: {
+    (ssrSupport: SSRSupport | undefined): void;
+    /**
+     * Unsets the last pushed defaultSSR value
+     */
+    pop(): void;
+};