import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import Box from '../box';
import { useStyleConfig, vui } from '../core';
import Link from '../link';
import T from '../t';
import { cs } from '../utils';
import { useHeaderContext } from './context';
/** Text inviting to create an account when logged out. */
export const HeaderCreateAccount = vui((props, ref) => {
    const { children, className, url, ...rest } = props;
    const { isMobile, links } = useHeaderContext() ?? {};
    const styles = useStyleConfig('Header', useHeaderContext()).createAccount;
    const screenProps = isMobile ? { borderBottom: '1px solid sandstone.main', p: 2 } : { ml: 3 };
    const linkVariant = isMobile ? 'dark' : (styles?.link?.variant ?? 'dark');
    return (_jsx(Box, { className: cs('vui-headerCreateAccount', className), column: true, flexShrink: 0, ref: ref, ...styles.container, ...screenProps, ...rest, children: children ?? (_jsxs(_Fragment, { children: [_jsx(T, { size: "sm", ...styles.text, color: isMobile ? 'darkBlue.main' : (styles?.text?.color ?? 'darkBlue.main'), children: "New to Veracity?" }), _jsx(Link, { fontWeight: "medium", href: url ?? links.signUp, isUnderlined: true, size: "sm", variant: linkVariant, children: "Create account" })] })) }));
});
HeaderCreateAccount.displayName = 'HeaderCreateAccount';
export default HeaderCreateAccount;
//# sourceMappingURL=headerCreateAccount.js.map