@heycar-uikit/core/header/esm/components/LanguageList.js

The React UI library from HeyCar

import React from 'react';
import Typography from '../../../typography';
import { LANG_OPTIONS } from '../constants/Header.constants.js';
import { getFlagIcon } from '../utils/headerItemHelpers.js';
import '../tslib.es6-4ac54363.js';
import '../../../icons';

var styles = {"languageList":"header__languageList_1jqt2"};

var LanguageList = React.forwardRef(function (_a, ref) {
    var dataTestId = _a.dataTestId, heading = _a.heading, itemOnClick = _a.itemOnClick, onFocusEvents = _a.onFocusEvents, onHoverEvents = _a.onHoverEvents, _b = _a.options, options = _b === void 0 ? LANG_OPTIONS : _b, trackingFn = _a.trackingFn;
    return (React.createElement("div", { className: styles.languageList, "data-test-id": dataTestId, onMouseOut: function () { return onHoverEvents(false); }, onMouseOver: function () { return onHoverEvents(true); }, ref: ref, role: "menu" },
        React.createElement(Typography, { variant: "subheading1" }, heading),
        React.createElement("ul", null, options.map(function (langItem) {
            var Icon = getFlagIcon(langItem.langCode);
            return (React.createElement("li", { key: langItem.langCode, role: "menuitem" },
                React.createElement("a", { "aria-label": langItem.label + " language select", href: langItem.href, onBlur: function () { return onFocusEvents(false); }, onClick: function () {
                        return itemOnClick({
                            fn: trackingFn,
                            obj: {
                                label: langItem.label + " language select",
                                href: langItem.href,
                            },
                        }, langItem.onClick);
                    }, onFocus: function () { return onFocusEvents(true); } },
                    Icon,
                    React.createElement(Typography, { variant: "button3" }, langItem.label))));
        }))));
});

export { LanguageList as default };