@reservoir0x/relay-kit-ui
Version:
Relay is the Fastest and Cheapest Way to Bridge and Transact Across Chains.
57 lines • 1.84 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.AnchorButton = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const css_1 = require("@reservoir0x/relay-design-system/css");
const AnchorStyle = (0, css_1.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 ((0, jsx_runtime_1.jsx)("a", { ...props, className: (0, css_1.css)(AnchorStyle.raw({ weight, color }), css_1.css.raw(css)) }));
};
const AnchorButton = ({ css, weight, color, children, ...props }) => {
return ((0, jsx_runtime_1.jsx)("button", { ...props, className: (0, css_1.css)(AnchorStyle.raw({ weight, color }), css_1.css.raw(css)), children: children }));
};
exports.AnchorButton = AnchorButton;
exports.default = Anchor;
//# sourceMappingURL=Anchor.js.map