@sap-ux/ui-components
Version:
SAP UI Components Library
75 lines • 2.73 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.UILink = void 0;
const react_1 = __importDefault(require("react"));
const react_2 = require("@fluentui/react");
const linkStyle = {
primary: {
color: 'var(--vscode-textLink-foreground)',
hoverColor: 'var(--vscode-textLink-activeForeground)'
},
secondary: {
color: 'var(--vscode-foreground)',
hoverColor: 'var(--vscode-foreground)'
}
};
/**
* UILink component
* based on https://developer.microsoft.com/en-us/fluentui#/controls/web/link
*
* @exports
* @class UILink
* @extends {React.Component<UILinkProps, {}>}
*/
class UILink extends react_1.default.Component {
/**
* Initializes component properties.
*
* @param {UILinkProps} props
*/
constructor(props) {
super(props);
}
/**
* @returns {JSX.Element}
*/
render() {
const { secondary, underline, disabled } = this.props;
const styles = secondary ? linkStyle.secondary : linkStyle.primary;
const linkStyles = () => {
return {
root: {
color: styles.color,
fontFamily: 'var(--vscode-font-family)',
textDecoration: underline === false ? undefined : 'underline',
selectors: !disabled
? {
'&:hover, &:hover:focus, &:hover:active': {
color: styles.hoverColor,
textDecoration: underline === false ? 'underline' : 'none'
},
'&:active, &:focus': {
color: styles.hoverColor,
textDecoration: underline === false ? 'underline' : 'none',
outline: 'none'
},
// Focus through tab navigation
'.ms-Fabric--isFocusVisible &:focus': {
boxShadow: 'none',
outline: '1px solid var(--vscode-focusBorder)',
outlineOffset: '-1px'
}
}
: undefined,
opacity: disabled ? 0.4 : undefined
}
};
};
return react_1.default.createElement(react_2.Link, { ...this.props, styles: linkStyles });
}
}
exports.UILink = UILink;
//# sourceMappingURL=UILink.js.map