@sap-ux/ui-components
Version:
SAP UI Components Library
68 lines • 2.9 kB
JavaScript
"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.UIActionCallout = void 0;
const react_1 = require("@fluentui/react");
const react_2 = __importDefault(require("react"));
const Icons_1 = require("../Icons");
const UICallout_1 = require("../UICallout");
const UIIcon_1 = require("../UIIcon");
require("./UIActionCallout.scss");
/**
*
*
*/
class UIActionCallout extends react_2.default.Component {
/**
* Initializes component properties.
*
* @param {ActionCalloutProps} props
*/
constructor(props) {
super(props);
this.actionDetail = props.actionDetail;
this.commandAction = props.commandAction;
this.targetElementId = props.targetElementId;
this.showInline = props.showInline;
this.anchor = react_2.default.createRef();
this.onCalloutClick = this.onCalloutClick.bind(this);
this.icon = props.icon;
this.onClick = props.onClick;
this.anchorClicked = false;
this.isError = props.isError ?? false;
}
onCalloutClick() {
if (this.onClick && !this.anchorClicked) {
this.onClick();
}
if (this.actionDetail.command && this.commandAction) {
this.commandAction(this.actionDetail.command);
}
else {
this.anchor.current?.click();
this.anchorClicked = false;
}
}
handleAnchorClick() {
this.anchorClicked = true;
}
/**
* @returns {JSX.Element}
*/
render() {
return (react_2.default.createElement(UICallout_1.UICallout, { className: "UIActionCallout-callout", onClick: this.onCalloutClick, target: `#${this.targetElementId}`, isBeakVisible: true, doNotLayer: true, beakWidth: 10, calloutMaxWidth: 230, calloutMinWidth: 230, directionalHint: react_1.DirectionalHint.bottomLeftEdge, styles: {
calloutMain: { padding: '10px' },
root: {
position: this.showInline === false ? 'absolute' : 'sticky',
border: this.isError === true ? 'thin solid var(--vscode-errorForeground)' : 'thin solid none'
}
} },
this.icon?.render() ?? react_2.default.createElement(UIIcon_1.UIIcon, { iconName: Icons_1.UiIcons.HelpAction }),
react_2.default.createElement("a", { ref: this.anchor, href: this.actionDetail.url, className: "UIActionCallout-link", target: "_blank", rel: "noreferrer", onClick: () => this.handleAnchorClick() }, this.actionDetail.linkText),
react_2.default.createElement("div", { className: "UIActionCallout-subText" }, this.actionDetail.subText)));
}
}
exports.UIActionCallout = UIActionCallout;
//# sourceMappingURL=UIActionCallout.js.map