@fluentui/react
Version:
Reusable React components for building web experiences.
48 lines • 3 kB
JavaScript
define(["require", "exports", "tslib", "react", "../../Utilities", "../../Callout", "../../common/DirectionalHint"], function (require, exports, tslib_1, React, Utilities_1, Callout_1, DirectionalHint_1) {
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.TooltipBase = void 0;
var getClassNames = (0, Utilities_1.classNamesFunction)();
var TooltipBase = exports.TooltipBase = /** @class */ (function (_super) {
tslib_1.__extends(TooltipBase, _super);
function TooltipBase() {
var _this = _super !== null && _super.apply(this, arguments) || this;
_this._onRenderContent = function (props) {
if (typeof props.content === 'string') {
return React.createElement("p", { className: _this._classNames.subText }, props.content);
}
else {
return React.createElement("div", { className: _this._classNames.subText }, props.content);
}
};
return _this;
}
TooltipBase.prototype.render = function () {
var _a, _b;
var className = (_a = this.props, _a.className), calloutProps = _a.calloutProps, directionalHint = _a.directionalHint, directionalHintForRTL = _a.directionalHintForRTL, styles = _a.styles, id = _a.id, maxWidth = _a.maxWidth, onRenderContent = (_b = _a.onRenderContent, _b === void 0 ? this._onRenderContent : _b), targetElement = _a.targetElement, theme = _a.theme;
this._classNames = getClassNames(styles, {
theme: theme,
className: className || (calloutProps && calloutProps.className),
beakWidth: calloutProps && calloutProps.isBeakVisible ? calloutProps.beakWidth : 0,
gapSpace: calloutProps && calloutProps.gapSpace,
maxWidth: maxWidth,
});
return (React.createElement(Callout_1.Callout, tslib_1.__assign({ target: targetElement, directionalHint: directionalHint, directionalHintForRTL: directionalHintForRTL }, calloutProps, (0, Utilities_1.getNativeProps)(this.props, Utilities_1.divProperties, ['id']), { className: this._classNames.root }),
React.createElement("div", { className: this._classNames.content, id: id, onFocus: this.props.onFocus, onMouseEnter: this.props.onMouseEnter, onMouseLeave: this.props.onMouseLeave }, onRenderContent(this.props, this._onRenderContent))));
};
// Specify default props values
TooltipBase.defaultProps = {
directionalHint: DirectionalHint_1.DirectionalHint.topCenter,
maxWidth: '364px',
calloutProps: {
isBeakVisible: true,
beakWidth: 16,
gapSpace: 0,
setInitialFocus: true,
doNotLayer: false,
},
};
return TooltipBase;
}(React.Component));
});
//# sourceMappingURL=Tooltip.base.js.map