import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
/*
* Copyright (c) 2020-present SMC Treviso s.r.l. All rights reserved.
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as published by
* the Free Software Foundation, either version 3 of the License, or
* (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program.  If not, see <http://www.gnu.org/licenses/>.
*/
import React from "react";
import { css } from "styled-components";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faChevronDown } from "@fortawesome/free-solid-svg-icons/faChevronDown";
import { faChevronUp } from "@fortawesome/free-solid-svg-icons/faChevronUp";
import { faSearch } from "@fortawesome/free-solid-svg-icons/faSearch";
import { useInfiniteQuery } from "react-query";
import { useDebounce } from "./useDebounce";
import { useOpenK9Client } from "./client";
import { useTranslation } from "react-i18next";
import { capitalize } from "lodash";
import { ArrowDownSvg } from "../svgElement/ArrowDownSvg";
import { Logo } from "./Logo";
import { useRange } from "./useRange";
import { NoFilter } from "./FilterCategory";
function FilterCategoryDynamic({ suggestionCategoryId, suggestionCategoryName, tokens, onAdd, onRemove, multiSelect, searchQuery, isUniqueLoadMore = false, loadAll = false, language, numberItems, isDynamicElement, setHasMoreSuggestionsCategories = undefined, noResultMessage, placeholder, iconCustom, haveSearch = true, isOpenFilter = false, }) {
    const [text, setText] = React.useState("");
    const debounced = useDebounce(text, 600);
    const [showSearch, setShowSearch] = React.useState(false);
    const tokensWithoutSearch = React.useMemo(() => (tokens ?? []).filter((t) => !t?.search), [tokens]);
    const suggestions = useInfiniteSuggestions(isDynamicElement, tokensWithoutSearch, suggestionCategoryId, debounced, loadAll, language, numberItems);
    const { t } = useTranslation();
    const resultPages = suggestions?.data?.pages ?? [];
    const keyOfSuggestion = React.useCallback((s) => {
        return s?.tokenType === "ENTITY"
            ? `FILTER__${s?.entityType ?? ""}__${s?.entityValue ?? ""}`
            : `FILTER__${s?.keywordKey ?? ""}__${s?.value ?? ""}`;
    }, []);
    const filters = React.useMemo(() => mergeAndSortObjects(resultPages, searchQuery ?? [], suggestionCategoryId, debounced), [resultPages, searchQuery, suggestionCategoryId, debounced]);
    const baseSelectedKeys = React.useMemo(() => {
        const set = new Set();
        for (const t of tokens ?? []) {
            if (t?.suggestionCategoryId === suggestionCategoryId && t?.values) {
                const kk = t?.keywordKey ?? "";
                for (const v of t?.values ?? [])
                    set.add(`FILTER__${kk}__${v}`);
            }
        }
        return set;
    }, [tokens, suggestionCategoryId]);
    const selectedCount = React.useMemo(() => filters.filter((s) => baseSelectedKeys.has(keyOfSuggestion(s))).length, [filters, baseSelectedKeys, keyOfSuggestion]);
    const [optimistic, setOptimistic] = React.useState(new Map());
    React.useEffect(() => {
        setOptimistic(new Map());
    }, [tokens]);
    React.useEffect(() => {
        if (setHasMoreSuggestionsCategories && suggestions?.hasNextPage != null) {
            setHasMoreSuggestionsCategories(Boolean(suggestions?.hasNextPage));
        }
    }, [suggestions?.hasNextPage, setHasMoreSuggestionsCategories]);
    const [isOpen, setIsOpen] = React.useState(isOpenFilter);
    const [singleSelect, setSingleselect] = React.useState(undefined);
    const show = Boolean(debounced || (filters?.length ?? 0) > 0);
    const handleClearCategory = React.useCallback(() => {
        for (const t of tokens ?? []) {
            if (t?.suggestionCategoryId === suggestionCategoryId && t?.values) {
                for (const v of t.values) {
                    onRemove({ ...t, values: [v] });
                }
            }
        }
    }, [tokens, suggestionCategoryId, onRemove]);
    if (!show)
        return (_jsx(_Fragment, { children: _jsx(NoFilter, { isOpen: isOpen, setIsOpen: setIsOpen, suggestionCategoryName: suggestionCategoryName, noResultMessage: noResultMessage }) }));
    return (_jsxs("fieldset", { className: `openk9-filter-category-container openk9-filter-category-${suggestionCategoryName}`, css: css `
        ${isUniqueLoadMore ? "width: 50%" : null}
        @media (max-width: 768px) {
          ${isUniqueLoadMore ? "height: 50%" : null}
        }
        @media (max-width: 480px) {
          width: unset;
        }
        margin: 0;
        padding: 0;
        border: none;
        box-shadow: none;
        background-color: transparent;
        background-image: none;
        font: inherit;
        color: inherit;
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding: 8px 16px;
      `, children: [_jsxs("div", { className: "openk9-filter-category-title", css: css `
          user-select: none;
          display: flex;
          align-items: center;
          justify-content: space-between;
          gap: 8px;
          padding: 6px 0;
          border-bottom: 1px solid var(--openk9-embeddable-search--border-color);
        `, children: [_jsx("legend", { className: "legend-filters", css: css `
            display: flex;
            align-items: center;
            gap: 8px;
            :first-letter {
              text-transform: uppercase;
            }
          `, children: _jsx("strong", { className: "name-category-filter", css: css `
              font-size: 14px;
              letter-spacing: 0.2px;
              color: var(--openk9-embeddable-search--secondary-text-color);
            `, children: suggestionCategoryName }) }), _jsxs("div", { className: "openk9-filter-category-actions-buttons", css: css `
            display: flex;
            align-items: center;
            gap: 8px;
          `, children: [isOpen && (_jsx("button", { className: "openk9-toggle-search-button", "aria-label": showSearch
                                    ? t("hide-search") || "Nascondi ricerca"
                                    : t("show-search") || "Mostra ricerca", css: css `
                background: transparent;
                border: 1px solid var(--openk9-embeddable-search--border-color);
                border-radius: 8px;
                padding: 6px 8px;
                cursor: pointer;
                transition: transform 120ms ease, background-color 120ms ease,
                  border-color 120ms ease;
                &:hover {
                  background: rgba(0, 0, 0, 0.03);
                }
                &:active {
                  transform: translateY(1px);
                }
                color: var(--openk9-embeddable-search--secondary-icon-color);
              `, onClick: () => setShowSearch((prev) => !prev), title: showSearch
                                    ? t("hide-search") || "Nascondi ricerca"
                                    : t("show-search") || "Mostra ricerca", children: _jsx(FontAwesomeIcon, { icon: faSearch }) })), _jsx("button", { className: `openk9-mobile-collapsable-filters openk9-collapsable-filters ${isOpen
                                    ? "openk9-dropdown-filters-open"
                                    : "openk9-dropdown-filters-close"}`, "aria-label": t("openk9-collapsable-filter") || "openk9 collapsable filter", "aria-expanded": isOpen ? "true" : "false", css: css `
              background: transparent;
              border: 1px solid var(--openk9-embeddable-search--border-color);
              border-radius: 8px;
              padding: 6px 8px;
              cursor: pointer;
              transition: transform 120ms ease, background-color 120ms ease,
                border-color 120ms ease;
              &:hover {
                background: rgba(0, 0, 0, 0.03);
              }
              &:active {
                transform: translateY(1px);
              }
            `, onClick: () => setIsOpen(!isOpen), children: _jsx(FontAwesomeIcon, { className: "icon-search icon-search-filters", icon: isOpen ? faChevronUp : faChevronDown, css: css `
                color: var(--openk9-embeddable-search--secondary-text-color);
                cursor: pointer;
              ` }) })] })] }), isOpen && (_jsxs(_Fragment, { children: [!isUniqueLoadMore && haveSearch && (_jsxs(_Fragment, { children: [showSearch && (_jsxs(_Fragment, { children: [_jsx("label", { htmlFor: "search-category-" + suggestionCategoryId, className: "visually-hidden", css: css `
                      border: 0;
                      padding: 0;
                      margin: 0;
                      position: absolute !important;
                      height: 1px;
                      width: 1px;
                      overflow: hidden;
                      clip: rect(1px 1px 1px 1px);
                      clip: rect(1px, 1px, 1px, 1px);
                      clip-path: inset(50%);
                      white-space: nowrap;
                    `, children: t("search-filters") }), _jsxs("div", { css: css `
                      position: relative;
                    `, children: [iconCustom?.Search ? (iconCustom?.Search) : (_jsx(FontAwesomeIcon, { icon: faSearch, width: 10, css: css `
                          position: absolute;
                          top: 45%;
                          left: 10px;
                          transform: translateY(-50%);
                          color: silver;
                          display: inline-block;
                          width: 0.75em;
                          height: 0.75em;
                          stroke-width: 0;
                          stroke: currentColor;
                          fill: currentColor;
                        ` })), _jsx("input", { type: "text", placeholder: placeholder || t("search-filters") || "", onChange: (event) => setText(event?.currentTarget?.value ?? ""), className: "openk9-filter-category-search", id: "search-category-" + suggestionCategoryId, value: text, css: css `
                        padding-left: calc(1em + 10px + 8px);
                        height: 2em;
                        width: -moz-available;
                        width: -webkit-fill-available;
                        width: fill-available;
                        padding: 3px;
                        flex-grow: 1;
                        text-indent: 25px;
                        border-radius: 8px;
                        border: 1px solid
                          var(--openk9-embeddable-search--border-color);
                        background: white;
                        :focus {
                          border: 1px solid
                            var(--openk9-embeddable-search--active-color);
                          outline: none;
                        }
                        ::placeholder {
                          font-style: normal;
                          font-weight: 400;
                          font-size: 15px;
                        }
                      ` })] })] })), baseSelectedKeys.size > 0 && (_jsx("button", { "aria-label": t("clear-category") || "clear category", className: "openk9-clear-category-button", onClick: handleClearCategory, css: css `
                    background: transparent;
                    border: 1px solid
                      var(--openk9-embeddable-search--border-color);
                    border-radius: 8px;
                    padding: 6px 8px;
                    cursor: pointer;
                    transition: transform 120ms ease,
                      background-color 120ms ease, border-color 120ms ease;
                    &:hover {
                      background: rgba(0, 0, 0, 0.03);
                    }
                    &:active {
                      transform: translateY(1px);
                    }
                    color: var(
                      --openk9-embeddable-search--secondary-text-color
                    );
                  `, title: t("clear-category") || "clear", children: "clear filter" }))] })), _jsxs("ul", { className: "openk9-filter-form-check-container", css: css `
              display: flex;
              flex-direction: ${isUniqueLoadMore ? "row" : "column"};
              gap: ${isUniqueLoadMore ? "0" : "5px"};
              flex-wrap: ${isUniqueLoadMore ? "wrap" : "initial"};
              padding-left: unset;
              margin: 0;
            `, children: [(filters?.length ?? 0) === 0 && _jsx(NoFiltersSearch, {}), filters?.map((suggestion, index) => {
                                const asSearchToken = mapSuggestionToSearchToken(suggestion, true);
                                const key = keyOfSuggestion(suggestion);
                                const baseChecked = baseSelectedKeys.has(key);
                                const optimisticOverride = optimistic.has(key)
                                    ? optimistic.get(key)
                                    : undefined;
                                const isChecked = optimisticOverride ?? baseChecked;
                                const idValue = suggestion?.tokenType === "ENTITY"
                                    ? `${suggestion?.entityType ?? ""}-${suggestion?.entityValue ?? ""}`
                                    : suggestion?.value ?? String(index);
                                const handleAdd = (tok) => {
                                    setOptimistic((prev) => {
                                        const m = new Map(prev);
                                        if (!multiSelect) {
                                            for (const s of filters ?? []) {
                                                const k = keyOfSuggestion(s);
                                                m.set(k, false);
                                            }
                                        }
                                        m.set(key, true);
                                        return m;
                                    });
                                    onAdd(tok);
                                };
                                const handleRemove = (tok) => {
                                    setOptimistic((prev) => {
                                        const m = new Map(prev);
                                        m.set(key, false);
                                        return m;
                                    });
                                    onRemove(tok);
                                };
                                const showSeparator = !isUniqueLoadMore &&
                                    selectedCount > 0 &&
                                    index === selectedCount &&
                                    (filters?.length ?? 0) > selectedCount;
                                return (_jsxs(React.Fragment, { children: [showSeparator && (_jsx("li", { role: "separator", "aria-hidden": "true", css: css `
                        height: 1px;
                        background: var(
                          --openk9-embeddable-search--border-color
                        );
                        margin: 4px 0;
                        list-style: none;
                        width: 100%;
                      ` })), _jsxs("li", { className: "form-check", css: css `
                      display: flex;
                      align-items: ${multiSelect ? "baseline" : "stretch"};
                      width: ${isUniqueLoadMore ? "50%" : "auto"};
                      margin-bottom: ${isUniqueLoadMore ? "8px" : "0"};
                      @media (max-width: 768px) {
                        width: 100%;
                        height: ${isUniqueLoadMore ? "50%" : "auto"};
                      }
                    `, children: [multiSelect ? (_jsx(CheckBoxSelect, { isChecked: isChecked, suggestion: suggestion, asSearchToken: asSearchToken, suggestionCategoryId: suggestionCategoryId, onAdd: handleAdd, onRemove: handleRemove })) : (_jsx(SingleSelect, { isChecked: isChecked, asSearchToken: asSearchToken, onAdd: handleAdd, onRemove: handleRemove, singleSelect: singleSelect, setSingleSelect: setSingleselect, suggestionValue: idValue, suggestionCategoryId: String(suggestionCategoryId) })), _jsx("label", { className: "form-check-label", htmlFor: multiSelect
                                                        ? "checkbox-dynamic-" +
                                                            idValue +
                                                            "-" +
                                                            suggestionCategoryId
                                                        : "radio-button-dynamic-" +
                                                            idValue +
                                                            "-" +
                                                            suggestionCategoryId, css: css `
                        text-overflow: ellipsis;
                        font-style: normal;
                        font-weight: 400;
                        line-height: 22px;
                        color: ${isChecked
                                                        ? "var(--openk9-embeddable-search--primary-color)"
                                                        : "#000000"};
                      `, children: suggestion?.tokenType === "ENTITY" ? (_jsxs(_Fragment, { children: [_jsx("strong", { className: "openk9-filter-category-suggestion-value", css: css `
                              :first-letter {
                                text-transform: uppercase;
                              }
                              display: inline-block;
                            `, children: suggestion?.entityType }), ": ", suggestion?.entityValue] })) : (_jsx(CapitalizeValue, { value: suggestion.value })) })] })] }, `fragment-filter-dynamic-${index}-${idValue}`));
                            })] }), !isUniqueLoadMore && suggestions?.hasNextPage && (_jsx("div", { className: "openk9-container-load-more", css: css `
                text-align: center;
                width: 100%;
                display: flex;
                margin-top: 10px;
                margin-bottom: 20px;
                justify-content: center;
                @media (max-width: 480px) {
                  margin-top: 15px;
                }
              `, children: _jsxs("button", { className: "openk9-load-more-button", "aria-label": t("load-more-filter") || "load more filters", css: css `
                  background: inherit;
                  color: var(--openk9-embeddable-search--primary-color);
                  font-size: 14px;
                  font-style: normal;
                  font-weight: 400;
                  line-height: normal;
                  display: flex;
                  align-items: center;
                  gap: 10px;
                  cursor: pointer;
                  padding: 8px 16px;
                  border: 1px solid
                    var(--openk9-embeddable-search--primary-color);
                  border-radius: 8px;
                `, onClick: () => {
                                suggestions?.fetchNextPage?.();
                            }, children: [t("load-more") || "Load More", _jsx(ArrowDownSvg, { size: "16px" })] }) }))] }))] }));
}
export const FilterCategoryDynamicMemo = React.memo(FilterCategoryDynamic);
export function useInfiniteSuggestions(isDynamicElement, searchQueryNotFilter, activeSuggestionCategory, suggestKeyword, loadAll, language, numberItems, allDynamic = false) {
    const pageSizeBase = loadAll ? 19 : suggestKeyword === "" ? 8 : 19;
    const NPageSize = numberItems ?? pageSizeBase;
    const client = useOpenK9Client();
    const searchQuery = allDynamic
        ? searchQueryNotFilter
        : createSuggestion(searchQueryNotFilter, isDynamicElement);
    const suggestionCategories = useInfiniteQuery([
        "suggestions",
        searchQuery,
        activeSuggestionCategory,
        suggestKeyword,
        loadAll,
        language,
    ], async ({ queryKey: [_, sq, activeId, sk], pageParam }) => {
        if (!sq)
            throw new Error("missing searchQuery");
        const result = await client?.getSuggestions?.({
            searchQuery: sq,
            range: [0, NPageSize + 1],
            afterKey: pageParam,
            suggestionCategoryId: activeId,
            suggestKeyword: sk,
            order: sk ? "desc" : "asc",
            language,
        });
        return {
            result: result?.result ?? [],
            afterKey: result?.afterKey ?? undefined,
        };
    }, {
        enabled: searchQuery !== null,
        keepPreviousData: true,
        getNextPageParam(lastPage, pages) {
            if (!lastPage?.afterKey)
                return undefined;
            if ((pages?.[pages.length - 1]?.result?.length ?? 0) < NPageSize)
                return undefined;
            return lastPage?.afterKey;
        },
        suspense: true,
    });
    return suggestionCategories;
}
function SingleSelect({ isChecked, asSearchToken, onAdd, onRemove, singleSelect, setSingleSelect, suggestionValue, suggestionCategoryId, }) {
    return (_jsx(_Fragment, { children: _jsx("div", { children: _jsx("input", { id: "radio-button-dynamic-" +
                    suggestionValue +
                    "-" +
                    suggestionCategoryId, className: `radio-button ${isChecked
                    ? "is-checked-dynamic-radio"
                    : "is-not-checked-dynamic-radio"}`, type: "radio", checked: isChecked, onChange: (event) => {
                    const checked = Boolean(event?.currentTarget?.checked);
                    if (checked) {
                        if (singleSelect)
                            onRemove(singleSelect);
                        setSingleSelect(asSearchToken);
                        onAdd(asSearchToken);
                    }
                    else {
                        onRemove(asSearchToken);
                    }
                }, onClick: () => {
                    if (isChecked)
                        onRemove(asSearchToken);
                }, css: css `
            appearance: none !important;
            width: 17px !important;
            height: 16px !important;
            border-radius: 50% !important;
            border: 2px solid #ccc !important;
            background-color: ${isChecked
                    ? "var(--openk9-embeddable-search--secondary-active-color) !important"
                    : "#fff !important"};
            cursor: pointer !important;
          `, onMouseOver: (event) => {
                    if (!isChecked) {
                        const target = event?.target;
                        if (target)
                            target.style.backgroundColor = "#e6e6e6";
                    }
                }, onMouseOut: (event) => {
                    const target = event?.target;
                    if (target)
                        target.style.backgroundColor = isChecked
                            ? "var(--openk9-embeddable-search--secondary-active-color)"
                            : "#fff";
                } }) }) }));
}
function CheckBoxSelect({ isChecked, suggestion, asSearchToken, suggestionCategoryId, onAdd, onRemove, }) {
    const { resetPage } = useRange();
    const idValue = suggestion?.tokenType === "ENTITY"
        ? `${suggestion?.entityType ?? ""}-${suggestion?.entityValue ?? ""}`
        : suggestion?.value ?? "val";
    return (_jsx(_Fragment, { children: _jsx("input", { className: `form-check-input ${isChecked
                ? "checked-checkbox filter-dynamic-check"
                : "not-checked-checkbox filter-dynamic-not-check"}`, id: "checkbox-dynamic-" + idValue + "-" + suggestionCategoryId, type: "checkbox", checked: isChecked, onChange: (event) => {
                const checked = Boolean(event?.currentTarget?.checked);
                if (checked) {
                    onAdd(asSearchToken);
                    resetPage?.();
                }
                else {
                    onRemove(asSearchToken);
                    resetPage?.();
                }
            }, css: css `
          cursor: pointer;
        ` }) }));
}
export function NoFiltersSearch() {
    const { t } = useTranslation();
    return (_jsx("div", { children: _jsxs("div", { className: "openk9-filter-category-no-results-is-open", css: css `
          color: var(--openk9-embeddable-search--secondary-text-color);
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          height: 100%;
        `, children: [_jsx(Logo, { size: 100 }), _jsxs("h4", { children: [t("no-filters"), " "] })] }) }));
}
export function mergeAndSortObjects(pages, selectedTokens, suggestionCategoryId, suggestKeyword) {
    const fromApi = pages?.flatMap((p) => p?.result ?? []) ?? [];
    const selectedEntries = [];
    for (const t of selectedTokens ?? []) {
        if (t?.suggestionCategoryId === suggestionCategoryId && t?.values) {
            for (const v of t?.values ?? []) {
                if (v != null)
                    selectedEntries.push({
                        keywordKey: t?.keywordKey,
                        value: v,
                        count: t?.count,
                    });
            }
        }
    }
    const keyOf = (s) => {
        if (s?.tokenType === "ENTITY")
            return `FILTER__${s?.entityType ?? ""}__${s?.entityValue ?? ""}`;
        return `FILTER__${s?.keywordKey ?? ""}__${s?.value ?? ""}`;
    };
    const labelOf = (s) => {
        if (s?.tokenType === "ENTITY")
            return `${s?.entityType ?? ""}: ${s?.entityValue ?? ""}`;
        return s?.value ?? "";
    };
    const existingKeys = new Set(fromApi?.map((x) => keyOf(x)) ?? []);
    const merged = [...fromApi];
    for (const e of selectedEntries) {
        const key = `FILTER__${e?.keywordKey ?? ""}__${e?.value}`;
        if (!existingKeys.has(key)) {
            merged.push({
                tokenType: "FILTER",
                keywordKey: e?.keywordKey ?? "",
                value: e?.value ?? "",
                suggestionCategoryId,
                count: e?.count,
            });
            existingKeys.add(key);
        }
    }
    const selectedKeys = new Set(selectedEntries?.map((e) => `FILTER__${e?.keywordKey ?? ""}__${e?.value}`) ?? []);
    const filtered = suggestKeyword && suggestKeyword.trim().length > 0
        ? merged.filter((m) => labelOf(m).toLowerCase().includes(suggestKeyword.toLowerCase()))
        : merged;
    filtered.sort((a, b) => {
        const aSel = selectedKeys.has(keyOf(a));
        const bSel = selectedKeys.has(keyOf(b));
        if (aSel && !bSel)
            return -1;
        if (!aSel && bSel)
            return 1;
        return labelOf(a).localeCompare(labelOf(b));
    });
    return filtered;
}
export function createSuggestion(searchQueryNotFilter, whoIsDynamic) {
    const searchQuery = [];
    whoIsDynamic?.forEach((add) => {
        switch (add) {
            case "tab":
                searchQueryNotFilter?.forEach((st) => {
                    if (st?.isTab)
                        searchQuery.push(st);
                });
                break;
            case "filter":
                searchQueryNotFilter?.forEach((st) => {
                    if (st?.goToSuggestion ||
                        st?.isFilter)
                        searchQuery.push(st);
                });
                break;
            case "search":
                searchQueryNotFilter?.forEach((st) => {
                    if (st?.search)
                        searchQuery.push(st);
                });
                break;
            case "date":
                searchQueryNotFilter?.forEach((st) => {
                    if (st?.tokenType === "DATE")
                        searchQuery.push(st);
                });
                break;
            default:
                break;
        }
    });
    return searchQuery;
}
export function haveSomeValue(values, value) {
    const singleValue = value?.[0];
    return (values ?? []).includes(singleValue);
}
function mapSuggestionToSearchToken(s, forceGoToSuggestion = true) {
    if (s?.tokenType === "ENTITY") {
        return {
            tokenType: "FILTER",
            keywordKey: s?.entityType,
            values: [s?.entityValue ?? ""],
            filter: true,
            suggestionCategoryId: s?.suggestionCategoryId,
            count: s?.count ?? undefined,
            ...(forceGoToSuggestion ? { goToSuggestion: true } : {}),
        };
    }
    return {
        tokenType: "FILTER",
        keywordKey: s?.keywordKey,
        values: [s?.value ?? ""],
        filter: true,
        suggestionCategoryId: s?.suggestionCategoryId,
        count: s?.count ?? undefined,
        ...(forceGoToSuggestion ? { goToSuggestion: true } : {}),
    };
}
function CapitalizeValue({ value }) {
    const [isHover, setIsHover] = React.useState(false);
    if (!value || value.length === 0)
        return _jsx(_Fragment, {});
    return (_jsx("span", { className: `openk9-capitalize-value ${isHover ? "is-hover" : ""}`, css: css `
        cursor: pointer;
        &:hover {
          color: var(--openk9-embeddable-search--primary-light-color);
          font-weight: 600;
        }
      `, onMouseOver: () => setIsHover(true), onMouseOut: () => setIsHover(false), title: isHover ? value : "", children: capitalize(value ?? "") }));
}
