@coveord/plasma-mantine/dist/esm/components/header/Header.js

A Plasma flavoured Mantine theme

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Divider, Group, Stack, Text, Title, factory, useProps, useStyles } from '@mantine/core';
import { Children } from 'react';
import { HeaderProvider } from './Header.context';
import classes from './Header.module.css';
import { HeaderActions } from './HeaderActions/HeaderActions';
import { HeaderBreadcrumbs } from './HeaderBreadcrumbs/HeaderBreadcrumbs';
import { HeaderDocAnchor } from './HeaderDocAnchor/HeaderDocAnchor';
const defaultProps = {
    variant: 'primary',
    justify: 'space-between',
    wrap: 'nowrap'
};
export const Header = factory((_props, ref)=>{
    const props = useProps('PlasmaHeader', defaultProps, _props);
    const { className, description, borderBottom, variant, children, style, classNames, unstyled, vars, styles, ...others } = props;
    const getStyles = useStyles({
        name: 'PlasmaHeader',
        props,
        classes,
        className,
        style,
        classNames,
        styles,
        unstyled,
        vars
    });
    const stylesApiProps = {
        classNames,
        styles
    };
    const convertedChildren = Children.toArray(children);
    const breadcrumbs = convertedChildren.find((child)=>child.type === HeaderBreadcrumbs);
    const actions = convertedChildren.find((child)=>child.type === HeaderActions);
    const docAnchor = convertedChildren.find((child)=>child.type === HeaderDocAnchor);
    const otherChildren = convertedChildren.filter((child)=>child.type !== HeaderBreadcrumbs && child.type !== HeaderActions && child.type !== HeaderDocAnchor);
    return /*#__PURE__*/ _jsxs(HeaderProvider, {
        value: {
            getStyles
        },
        children: [
            /*#__PURE__*/ _jsxs(Group, {
                ref: ref,
                variant: variant,
                ...getStyles('root'),
                ...others,
                children: [
                    /*#__PURE__*/ _jsxs(Stack, {
                        gap: 0,
                        children: [
                            breadcrumbs,
                            /*#__PURE__*/ _jsxs(Title, {
                                variant: variant,
                                order: variant === 'primary' ? 1 : 3,
                                ...getStyles('title', stylesApiProps),
                                children: [
                                    otherChildren,
                                    docAnchor
                                ]
                            }),
                            /*#__PURE__*/ _jsx(Text, {
                                ...getStyles('description', stylesApiProps),
                                size: variant === 'primary' ? 'md' : 'sm',
                                children: description
                            })
                        ]
                    }),
                    actions
                ]
            }),
            borderBottom ? /*#__PURE__*/ _jsx(Divider, {
                ...getStyles('divider', stylesApiProps),
                size: "xs"
            }) : null
        ]
    });
});
Header.Breadcrumbs = HeaderBreadcrumbs;
Header.Actions = HeaderActions;
Header.DocAnchor = HeaderDocAnchor;

//# sourceMappingURL=Header.js.map