@kubit-ui-web/react-components
Version:
Kubit React Components is a customizable, accessible library of React web components, designed to enhance your application's user experience
18 lines • 1.68 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import React from 'react';
import { BreadcrumbsControlled as Breadcrumbs } from '../../components/breadcrumbs/breadcrumbsControlled';
import { DeviceBreakpointsType } from '../../types/breakpoints/breakpoints';
import { BreadcrumbsWrapper, HeaderContainerStyled, HeaderContentStyled, HeaderLeftContentStyled, HeaderRightContentStyled, } from './header.styled';
import { HeaderContentPositionType } from './types/position';
const HeaderStandAloneComponent = ({ dataTestId = 'header', ...props }, ref) => {
const getPositionContent = (position) => {
return React.Children.toArray(props.children).filter((child) => {
return child?.props?.['data-position'] === position;
});
};
const leftContent = getPositionContent(HeaderContentPositionType.LEFT);
const rightContent = getPositionContent(HeaderContentPositionType.RIGHT);
return (_jsxs(HeaderContainerStyled, { ref: ref, "data-testid": dataTestId, styles: props.styles, children: [props.crumbs && props.device === DeviceBreakpointsType.DESKTOP && (_jsx(BreadcrumbsWrapper, { styles: props.styles, children: _jsx(Breadcrumbs, { crumbs: props.crumbs, variant: props.configBreadcrumbs?.variant, ...props.configBreadcrumbs }) })), _jsxs(HeaderContentStyled, { styles: props.styles, children: [_jsx(HeaderLeftContentStyled, { styles: props.styles, children: leftContent }), rightContent.length !== 0 && (_jsx(HeaderRightContentStyled, { styles: props.styles, children: rightContent }))] })] }));
};
export const HeaderStandAlone = React.forwardRef(HeaderStandAloneComponent);
//# sourceMappingURL=headerStandAlone.js.map