@reservoir0x/relay-kit-ui/_esm/src/components/primitives/Anchor.js

Relay is the Fastest and Cheapest Way to Bridge and Transact Across Chains.

import { jsx as _jsx } from "react/jsx-runtime";
import { cva, css as designCss } from '@reservoir0x/relay-design-system/css';
const AnchorStyle = cva({
    base: {
        cursor: 'pointer',
        width: 'max-content',
        fontWeight: 500,
        fontSize: 14,
        color: 'anchor-color',
        _hover: {
            color: 'anchor-hover-color'
        },
        '--focusColor': 'colors.focus-color',
        _focusVisible: {
            boxShadow: '0 0 0 2px var(--focusColor)',
            outline: 'none',
            borderRadius: '4px'
        }
    },
    variants: {
        color: {
            gray: {
                color: 'gray11',
                _hover: { color: 'gray12' }
            },
            base: {
                color: 'anchor-color',
                _hover: {
                    color: 'anchor-hover-color'
                }
            },
            black: {
                color: 'gray12',
                _hover: {
                    color: 'gray12'
                }
            }
        },
        weight: {
            heavy: { fontWeight: 900 },
            bold: { fontWeight: 700 },
            semi_bold: { fontWeight: 600 }
        }
    }
});
const Anchor = ({ css, weight, color, ...props }) => {
    return (_jsx("a", { ...props, className: designCss(AnchorStyle.raw({ weight, color }), designCss.raw(css)) }));
};
export const AnchorButton = ({ css, weight, color, children, ...props }) => {
    return (_jsx("button", { ...props, className: designCss(AnchorStyle.raw({ weight, color }), designCss.raw(css)), children: children }));
};
export default Anchor;
//# sourceMappingURL=Anchor.js.map