react-instantsearch/dist/es/ui/Stats.js

⚡ Lightning-fast search for React, by Algolia

import { _ as _$3 } from '@swc/helpers/esm/_object_spread.js';
import { _ as _$2 } from '@swc/helpers/esm/_object_spread_props.js';
import { _ } from '@swc/helpers/esm/_object_without_properties.js';
import { _ as _$1 } from '@swc/helpers/esm/_sliced_to_array.js';
import { cx } from 'instantsearch-ui-components';
import React, { useState, useRef, useEffect } from 'react';

// Delay before announcing an update, so that rapid changes (e.g. typing in the
// search box) settle into a single announcement instead of piling up. Mirrors
// the debounce used by GOV.UK's accessible-autocomplete.
var ANNOUNCEMENT_DELAY = 1400;
var visuallyHiddenStyle = {
    position: 'absolute',
    width: 1,
    height: 1,
    padding: 0,
    margin: -1,
    overflow: 'hidden',
    clip: 'rect(0, 0, 0, 0)',
    whiteSpace: 'nowrap',
    border: 0
};
function Stats(_0) {
    var _0_classNames = _0.classNames, classNames = _0_classNames === void 0 ? {} : _0_classNames, nbHits = _0.nbHits, processingTimeMS = _0.processingTimeMS, nbSortedHits = _0.nbSortedHits, areHitsSorted = _0.areHitsSorted, translations = _0.translations, props = _(_0, [
        "classNames",
        "nbHits",
        "processingTimeMS",
        "nbSortedHits",
        "areHitsSorted",
        "translations"
    ]);
    var translationOptions = {
        nbHits: nbHits,
        processingTimeMS: processingTimeMS,
        nbSortedHits: nbSortedHits,
        areHitsSorted: areHitsSorted
    };
    var nextAnnouncement = translations.announcementText ? translations.announcementText(translationOptions) : '';
    var _useState = _$1(useState(''), 2), announcement = _useState[0], setAnnouncement = _useState[1];
    var timerRef = useRef(undefined);
    var isInitialRef = useRef(true);
    useEffect(function() {
        // Don't announce the initial results, only subsequent changes.
        if (isInitialRef.current) {
            isInitialRef.current = false;
            return undefined;
        }
        clearTimeout(timerRef.current);
        timerRef.current = setTimeout(function() {
            setAnnouncement(nextAnnouncement);
        }, ANNOUNCEMENT_DELAY);
        return function() {
            return clearTimeout(timerRef.current);
        };
    }, [
        nextAnnouncement
    ]);
    return /*#__PURE__*/ React.createElement("div", _$2(_$3({}, props), {
        className: cx('ais-Stats', classNames.root, props.className)
    }), /*#__PURE__*/ React.createElement("span", {
        className: "ais-Stats-text"
    }, translations.rootElementText(translationOptions)), /*#__PURE__*/ React.createElement("span", {
        className: "ais-Stats-announcement",
        role: "status",
        "aria-live": "polite",
        "aria-atomic": "true",
        style: visuallyHiddenStyle
    }, announcement));
}

export { Stats };