import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import * as React from 'react';
import { useAnalytics } from "../../gravity-blocks/hooks/index.js";
import { DefaultEventNames } from "../../models/index.js";
import { block } from "../../utils/index.js";
import { i18n } from "./i18n/index.js";
import './HeaderBreadcrumbs.css';
const b = block('header-breadcrumbs');
export default function HeaderBreadcrumbs(props) {
    const { items, theme = 'light', className, analyticsEvents } = props;
    const handleAnalytics = useAnalytics(DefaultEventNames.Breadcrumb);
    const onClick = React.useCallback(() => {
        handleAnalytics(analyticsEvents);
    }, [analyticsEvents, handleAnalytics]);
    return (_jsx("nav", { className: b({ theme }, className), "aria-label": i18n('label'), children: _jsx("ol", { className: b('list'), children: items?.map(({ url, text }) => (_jsxs("li", { className: b('item'), children: [_jsx("a", { href: url, className: b('text'), onClick: onClick, children: text }), _jsx("span", { className: b('separator'), "aria-hidden": true, children: "/" })] }, url))) }) }));
}
//# sourceMappingURL=HeaderBreadcrumbs.js.map
