react-instantsearch/dist/cjs/widgets/SearchBox.js

⚡ Lightning-fast search for React, by Algolia

'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});
Object.defineProperty(exports, "SearchBox", {
    enumerable: true,
    get: function() {
        return SearchBox;
    }
});
var _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
var _object_spread = require("@swc/helpers/_/_object_spread");
var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
var _sliced_to_array = require("@swc/helpers/_/_sliced_to_array");
var _chat = require("instantsearch.js/cjs/lib/chat");
var _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
var _reactinstantsearchcore = require("react-instantsearch-core");
var _SearchBox = require("../ui/SearchBox");
function SearchBox(_0) {
    var queryHook = _0.queryHook, _0_searchAsYouType = _0.searchAsYouType, searchAsYouType = _0_searchAsYouType === void 0 ? true : _0_searchAsYouType, _0_ignoreCompositionEvents = _0.ignoreCompositionEvents, ignoreCompositionEvents = _0_ignoreCompositionEvents === void 0 ? false : _0_ignoreCompositionEvents, aiMode = _0.aiMode, translations = _0.translations, props = _object_without_properties._(_0, [
        "queryHook",
        "searchAsYouType",
        "ignoreCompositionEvents",
        "aiMode",
        "translations"
    ]);
    var _useSearchBox = (0, _reactinstantsearchcore.useSearchBox)({
        queryHook: queryHook
    }, _object_spread._({
        $$widgetType: 'ais.searchBox'
    }, aiMode ? {
        opensChat: true
    } : {})), query = _useSearchBox.query, refine = _useSearchBox.refine, isSearchStalled = _useSearchBox.isSearchStalled;
    var indexRenderState = (0, _reactinstantsearchcore.useInstantSearch)().indexRenderState;
    var _useState = _sliced_to_array._((0, _react.useState)(query), 2), inputValue = _useState[0], setInputValue = _useState[1];
    var inputRef = (0, _react.useRef)(null);
    function setQuery(newQuery) {
        var isComposing = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
        setInputValue(newQuery);
        if (searchAsYouType && !(ignoreCompositionEvents && isComposing)) {
            refine(newQuery);
        }
    }
    function onReset() {
        setQuery('');
        if (!searchAsYouType) {
            refine('');
        }
    }
    function onChange(event) {
        setQuery(event.currentTarget.value, event.nativeEvent.isComposing);
    }
    function onSubmit(event) {
        if (!searchAsYouType) {
            refine(inputValue);
        }
        if (props.onSubmit) {
            props.onSubmit(event);
        }
    }
    // Track when the InstantSearch query changes to synchronize it with
    // the React state.
    // We bypass the state update if the input is focused to avoid concurrent
    // updates when typing.
    if (query !== inputValue && document.activeElement !== inputRef.current) {
        setInputValue(query);
    }
    var chatRenderState = indexRenderState.chat;
    var uiProps = {
        inputRef: inputRef,
        isSearchStalled: isSearchStalled,
        onChange: onChange,
        onReset: onReset,
        onSubmit: onSubmit,
        onAiModeClick: aiMode ? function() {
            if ((0, _chat.openChat)(chatRenderState, {
                message: inputValue,
                referer: 'ai-mode'
            })) {
                onReset();
            }
        } : undefined,
        aiModeButtonDisabled: aiMode ? (0, _chat.isChatBusy)(chatRenderState) : undefined,
        value: inputValue,
        translations: _object_spread._({
            submitButtonTitle: 'Submit the search query',
            resetButtonTitle: 'Clear the search query',
            aiModeButtonTitle: 'AI Mode'
        }, translations)
    };
    return /*#__PURE__*/ _react.default.createElement(_SearchBox.SearchBox, _object_spread._({}, props, uiProps));
}