alchemy-tech-ui/dist/components/NavLink.js

react component library for alchemy apps

'use strict';

var tslib = require('tslib');
var styled = require('styled-components');
var React = require('react');
var colors = require('../colors.js');

var StyledLink = styled.div(templateObject_1 || (templateObject_1 = tslib.__makeTemplateObject(["\n  font-weight: bold;\n  color: black;\n  padding: 8px;\n  transition: all 0.2s ease-in-out;\n\n  :hover {\n    background-color: ", ";\n    border-radius: 4px: \n  }\n  ", "\n"], ["\n  font-weight: bold;\n  color: black;\n  padding: 8px;\n  transition: all 0.2s ease-in-out;\n\n  :hover {\n    background-color: ", ";\n    border-radius: 4px: \n  }\n  ", "\n"])), colors.gray["100"], function(_a) {
  var active = _a.active;
  return active ? "\n    text-decoration: underline;\n    text-decoration-thickness: 2px;\n    text-underline-offset: 6px;\n    " : "";
});
function NavLink(_a) {
  var text = _a.text, _b = _a.active, active = _b === void 0 ? false : _b, onClick = _a.onClick, className = _a.className;
  return React.createElement(StyledLink, { active: active, onClick: onClick, className: className }, text);
}
var templateObject_1;

module.exports = NavLink;