@public-ui/components/dist/components/CustomSuggestionsOptionsGroup.js

Contains all web components that belong to KoliBri - The accessible HTML-Standard.

/*!
 * KoliBri - The accessible HTML-Standard
 */
import { h } from '@stencil/core/internal/client';
import { c as clsx } from './clsx.js';

const CustomSuggestionsOptionFc = ({ disabled, index, ref, selected, onClick, onMouseOver, onFocus, onKeyDown, option, searchTerm, }) => {
    const highlightSearchTerm = (text, searchTerm) => {
        if (!(searchTerm === null || searchTerm === void 0 ? void 0 : searchTerm.trim()))
            return text;
        const regex = new RegExp(`(${searchTerm.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')})`, 'gi');
        const parts = text.split(regex);
        return parts.map((part, partIndex) => (partIndex % 2 === 1 ? h("mark", null, part) : part));
    };
    return (h("li", { id: `option-${index}`, key: `-${index}`, ref: ref, "data-index": index, tabIndex: -1, role: "option", "aria-selected": selected ? 'true' : undefined, "aria-disabled": disabled ? 'true' : undefined, onClick: onClick, onMouseOver: onMouseOver, onFocus: onFocus, class: clsx('kol-custom-suggestions-option', { 'kol-custom-suggestions-option--disabled': disabled }), onKeyDown: onKeyDown }, h("span", null, highlightSearchTerm(String(option), searchTerm || ''))));
};

const CustomSuggestionsOptionsGroupFc = ({ blockSuggestionMouseOver, onKeyDown, style, hidden, id }, children) => {
    return (h("ul", { id: id, role: "listbox", style: style, class: clsx('kol-custom-suggestions-options-group', {
            'kol-custom-suggestions-options-group--cursor-hidden': blockSuggestionMouseOver,
            'kol-custom-suggestions-options-group--open': !hidden,
        }), hidden: hidden, onKeyDown: onKeyDown }, children));
};

export { CustomSuggestionsOptionsGroupFc as C, CustomSuggestionsOptionFc as a };
//# sourceMappingURL=CustomSuggestionsOptionsGroup.js.map

//# sourceMappingURL=CustomSuggestionsOptionsGroup.js.map